Я хочу оформить админку WordPress. Для этого я скопировал следующий код в файл функции и приступил к его стилизации:
function custom_css()
{ echo '<style>
.widefat {
width: 1700px !important;
max-width: 1700px !important;
}
</style>'; }
add_action('admin_head','custom_css');
таким образом, файл функции становится очень переполненным, и поэтому я хочу оформить его в отдельном файле CSS; Как я могу ввести ссылку на мой файл style.css в код выше?
Я использовал этот код, но он не работал:
{ echo include ("/style.css"); }
Я нашел ответ на свой вопрос. Ответ таков:
function custom_css() {
echo wp_enqueue_style( 'style', get_template_directory_uri() . '/style.css', array(), '4.0.0' );
}
add_action('admin_head','custom_css');
/* admin_enqueue_scripts is the proper hook to use when enqueuing scripts and styles that are meant to be used in the administration panel. Despite the name, it is used for enqueuing both scripts and styles. */
Enqueue a custom stylesheet in the admin
Sometimes you want to load a set of CSS and/or Javascript documents to all admin pages. You can do this from within your plugin or from your themes function file:
/**
* Register and enqueue a custom stylesheet in the WordPress admin.
*/
// get_template_directory_uri() -> Retrieves template directory URI for the active theme.
function wpdocs_enqueue_custom_admin_style() {
// loading css
wp_register_style( 'custom_wp_admin_css', get_template_directory_uri(). '/admin-style.css', false, '1.0.0' );
wp_enqueue_style( 'custom_wp_admin_css' ); // Enqueue a style.
// loading js
wp_register_script( 'custom_wp_admin_js', get_template_directory_uri().'/admin-script.js', array('jquery-core'),false, true );
wp_enqueue_script( 'custom_wp_admin_js' ); // Enqueue a script.
}
add_action( 'admin_enqueue_scripts', 'wpdocs_enqueue_custom_admin_style' );
CSS-файлы темы Wordpress отвечают за стиль и внешний вид веб-сайта. Они находятся в каталоге /wp-content/themes/
. Файлы css обычно называются style.css
, есть несколько дополнительных опций, которые вы можете попробовать:
Внутри style.css
используйте правило @import
at для ссылки на другой файл (если он размещен снаружи).
@import url("//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css");
Отредактируйте тему header.php
, чтобы связать ее с внешней таблицей стилей.
<link href = "//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel = "stylesheet">
Чтобы связать файл CSS в заголовке WordPress, вам нужно сначала поставить файл в очередь с помощью wp_enqueue_scripts
из functions.php. После этого вы можете связать его с помощью get_stylesheet_uri
function roofers_wp_resources(){
wp_enqueue_style('style', get_stylesheet_uri());
wp_enqueue_style('name css file', get_template_directory_uri() . 'css file');
}
add_action('wp_enqueue_scripts', 'roofers_wp_resources');
или поставить в очередь файл, указывающий на ваш внешний URL css
add_action( 'wp_enqueue_scripts', 'register_custom_plugin_styles' );
function register_custom_plugin_styles() {
wp_register_style( 'style', 'CSS URL' );
wp_enqueue_style( 'style' );
}