将 Bootstrap css 添加到 wordpress 管理区域而不添加主要 style.css

Posted 2023-03-21

【中文标题】将 Bootstrap css 添加到 wordpress 管理区域而不添加主要 style.css

【英文标题】：Add Bootstrap css to wordpress admin area without adding main style.css

【发布时间】：2021-05-06 05:15:22

【问题描述】：

我正在创建一个新的自定义 Wordpress 主题，我正在尝试将 Boostrap CSS 添加到管理区域，但它仅在我将 style.css 添加到管理区域时才有效。 Boostrap js 正在添加到管理区域但 CSS 没有，如何在不将 style.css 添加到管理区域的情况下添加 Bootstrap CSS？

这是我的函数.php

<?php

/*
 * Function to register bootstrap css style
 */
function bootstrap_enqueue_styles() 
    wp_register_style('bootstrap', get_template_directory_uri().'/bootstrap/css/bootstrap.min.css');


/*
 * Function to register theme css style
 */
function main_enqueue_style()
    $dependencies = array('bootstrap');
    wp_enqueue_style('main-css-style', get_stylesheet_uri(), $dependencies);


/*
 * Function to register Bootstrap javascript
 */
function bootstrap_enqueue_scripts() 
    $dependencies = array('jquery');
    wp_enqueue_script('bootstrap', get_template_directory_uri().'/bootstrap/js/bootstrap.min.js', $dependencies, '3.3.6', true );


add_action( 'wp_enqueue_scripts', 'bootstrap_enqueue_styles' );
add_action( 'wp_enqueue_scripts', 'main_enqueue_style' );
add_action( 'wp_enqueue_scripts', 'bootstrap_enqueue_scripts' );
add_action( 'admin_init', 'bootstrap_enqueue_styles' );
add_action( 'admin_init', 'bootstrap_enqueue_scripts' );
//add_action( 'admin_init', 'main_enqueue_style' ); <-- IF I DONT ADD THIS ONE IT DOESNT ADD BOOTSTRAP CSS TO THE ADMIN AREA

【参考方案1】：

您的函数main_enqueue_style 不仅将您的主题样式表排入队列，而且还调用 Bootstrap 作为依赖项。请参阅：https://developer.wordpress.org/reference/functions/wp_enqueue_style/ 了解更多信息。

因此，实际上，您将主主题样式表排入队列，这就是该函数的目的。您需要设置一个单独的函数来仅将 Bootstrap 排入队列。

但是，您可能需要查看admin_enqueue_scripts 挂钩，以了解为管理方面添加样式表的正确方法。引用 WordPress 自己的文档，它是：

“在将要在管理面板中使用的脚本和样式排入队列时使用的正确挂钩。尽管名称如此，但它用于将脚本和样式排入队列。”

在上面的文档中，您可以找到几个不同的示例，说明如何为您的管理员正确添加引导样式表。例如，您可以创建一个单独的函数，例如：

function myunique_namespace_bootstrap_enqueue() 
   wp_enqueue_style('bootstrap');

然后

add_action( 'admin_enqueue_scripts', 'myunique_namespace_bootstrap_enqueue' );

【参考方案2】：

如果您只需要在管理员端添加自定义样式表/您自己的样式/引导 css。试试两个wordpress函数wp_register_style()和wp_enqueue_style()

function wpCustomStyleSheet()
    //first register sthe style sheet and then enqueue
    wp_register_style( 'adminCustomStyle', get_bloginfo('stylesheet_directory') . '/adminCustomStyle.css', false, '1.0.0' );
    wp_enqueue_style( 'adminCustomStyle' );

add_action('admin_enqueue_scripts', 'wpCustomStyleSheet');