我正在編寫一個自定義 WordPress 插件，我正在將 OceanWP 主題與 Elementor 一起使用，并嘗試排隊/注冊 Bootstrap 4.5 樣式/腳本以及我自己的自定義樣式/腳本。然而，OceanWP 的樣式仍然優先使用，而不是我的樣式/腳本。目前，我正在嘗試通過提高 add_action 掛鉤中的優先級來覆蓋主題資產，但沒有任何運氣。我正在嘗試顯示自定義的多部分表單并使用短代碼將其顯示在頁面上。public function __construct() { //set dirpath $this->_dirpath = dirname(__FILE__); add_action('wp_enqueue_scripts', array($this, 'cmmc_styles'), 9999); add_action('wp_footer', array($this, 'cmmc_scripts')); add_shortcode("sme-cmmc-form", array($this, "displayCmmcForm")); } public function cmmc_scripts() { ///wp_enqueue_style('bootstrap_css', 'https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css', false, NULL, 'all'); wp_enqueue_script('popper_js', 'https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js', array('jquery'), NULL, true); wp_enqueue_script('bootstrap_js', 'https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js', array('jquery'), NULL, true); wp_enqueue_script('cmmc_js', plugin_dir_url( __FILE__ ) . 'assets/js/app.js', array('jquery'), '1.0' ); //wp_enqueue_style('custom_styles', plugins_url('/assets/css/styles.css', __FILE__)); } public function cmmc_styles() { wp_register_style('bootstrap_css', 'https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css', false, NULL, 'all' ); wp_enqueue_style('bootstrap_css'); wp_enqueue_style('custom_styles', plugins_url('/assets/css/styles.css', __FILE__)); }有人可以告訴我如何覆蓋主題樣式，即使它只是針對這個插件，或者暫時使該單頁的樣式出列嗎？
3 回答
MMMHUHU
TA貢獻1834條經驗 獲得超8個贊
很難說如何在不查看主題源代碼的情況下使腳本出隊。無論如何，通常你只需要等到主題完成它的工作，掛接到 wp 并刪除搜索其句柄名稱的樣式。像這樣的東西：
add_action('after_setup_theme','alter_styles');
function alter_styles(){
wp_dequeue_style();
wp_dequeue_script();
}
相反，談到您的代碼，第一個問題是：您確定您在正確的時間、正確的位置加載了該代碼，還是它根本就被執行了？你可以這樣做：
add_action('template_redirect','my_template_redirect');
function my_template_redirect(){
if (is_page('your_page')){
// Load class / do stuff with scripts/styles
}
}
確保僅針對該特定頁面執行代碼
函數式編程
TA貢獻1807條經驗 獲得超9個贊
有多種方法可以讓您的樣式表在加載其他樣式表后加載。您已經嘗試了幾種方法，但是父主題的優先級非常高9999，因此您需要使用更高的主題，否則它將無法工作。
1. 優先權
9999您在 中使用優先級add_action，但是如果您查看父主題，它會使用：
add_action( 'wp_enqueue_scripts', array( 'OCEANWP_Theme_Class', 'custom_style_css' ), 9999 );
您的代碼的優先級實際上并不高于父主題，因此您需要再次提高，例如
add_action('wp_enqueue_scripts', array($this, 'cmmc_styles'), 10000);
2.出隊（注意，需要匹配入隊時使用的值）
您說出列對您不起作用，但請注意，當您使樣式出列時，優先級決定了它何時運行 - 就像您入隊時一樣 - 因此您需要使用比入隊時使用的優先級更高的優先級。它還必須使用相同的鉤子（或更高版本的鉤子）。
正如我們在上面看到的，您需要以高于9999它們排隊的優先級來執行此操作，例如
function dequeue_oceanwp_styles() {
wp_dequeue_style('oceanwp-style');
wp_deregister_style('oceanwp-style');
}
/* Now call this function with a higher priority than 9999 */
add_action( 'wp_enqueue_scripts', 'dequeue_oceanwp_styles', 10000);
3. 依賴關系
如果這不起作用，您可以在樣式之間設置依賴關系以強制執行順序。
當您使用wp_register_style或 時wp_enqueue_style，您可以指定您正在注冊/排隊的樣式表的依賴關系 - 即您的樣式表所需的其他樣式表。這意味著您正在注冊的樣式表只有在它所依賴的樣式表之后才會加載。
為此，您需要傳遞必須首先加載的樣式表的句柄數組，例如
// create an array with the handles of the stylesheets you want to load before yours
$dependencies = array('oceanwp-style', 'oceanwp-hamburgers', /* etc. */ );
/* Noew pass this in as the dependencies for your stylesheets */
wp_register_style('bootstrap_css',
'https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css',
$dependencies, /* array of dependencies */
NULL, 'all' );
wp_enqueue_style('bootstrap_css');
/* Add bootstrap to the dependencies, if your custom_styles needs it */
$dependencies[] = 'bootstrap_css';
wp_enqueue_style('custom_styles',
plugins_url('/assets/css/styles.css', __FILE__),
$dependencies, /* array of dependencies */
);
- 3 回答
- 0 關注
- 149 瀏覽
添加回答
舉報
0/150
提交
取消