Add custom css file after plugin css with Wordpress Child Theme functions.php

admin管理员组

文章数量:1300027

I am trying to enque a css file thorugh my child themes functions.php after a specific plugin css file with the handle openpos.bill.bootstrap. Unfortunately the current code does not load anything. Any idea how to solve this problem?

Plugin uses the following code block to load styles

public function initScripts(){
    global $op_in_pos_screen;
    global $op_in_bill_screen;
    global $op_in_kitchen_screen;
    if($op_in_pos_screen)
    {
        add_action( 'init', array($this,'registerScripts') ,10 );
    }
    if($op_in_bill_screen)
    {
        add_action( 'init', array($this,'registerBillScripts') ,10 );
    }
    if($op_in_kitchen_screen)
    {
        add_action( 'init', array($this,'registerKitchenScripts') ,10 );
    }
    add_filter('script_loader_tag',  array($this,'add_async_attribute'), 10, 2);
}

public function registerBillScripts(){
    $info = $this->_core->getPluginInfo();

    wp_enqueue_style('openpos.bill.bootstrap', OPENPOS_URL.'/assets/css/bootstrap.css') // load my custom css after this one

    // ... and so on

}

My code to load my custom style.css file which fails to load anything

function load_custom_css_to_style_billing_screen() {
    wp_enqueue_style('bill-screen-style', get_stylesheet_directory_uri() . '/include-parts-from-functions-php-file/frontend-related/plugins/openpos-plugin/pos-app/css/bill-screen-style.css',array('openpos.bill.bootstrap'));
    }
add_action( 'wp_enqueue_scripts', 'load_custom_css_to_style_billing_screen', 10 );

I am trying to enque a css file thorugh my child themes functions.php after a specific plugin css file with the handle openpos.bill.bootstrap. Unfortunately the current code does not load anything. Any idea how to solve this problem?

Plugin uses the following code block to load styles

public function initScripts(){
    global $op_in_pos_screen;
    global $op_in_bill_screen;
    global $op_in_kitchen_screen;
    if($op_in_pos_screen)
    {
        add_action( 'init', array($this,'registerScripts') ,10 );
    }
    if($op_in_bill_screen)
    {
        add_action( 'init', array($this,'registerBillScripts') ,10 );
    }
    if($op_in_kitchen_screen)
    {
        add_action( 'init', array($this,'registerKitchenScripts') ,10 );
    }
    add_filter('script_loader_tag',  array($this,'add_async_attribute'), 10, 2);
}

public function registerBillScripts(){
    $info = $this->_core->getPluginInfo();

    wp_enqueue_style('openpos.bill.bootstrap', OPENPOS_URL.'/assets/css/bootstrap.css') // load my custom css after this one

    // ... and so on

}

My code to load my custom style.css file which fails to load anything

function load_custom_css_to_style_billing_screen() {
    wp_enqueue_style('bill-screen-style', get_stylesheet_directory_uri() . '/include-parts-from-functions-php-file/frontend-related/plugins/openpos-plugin/pos-app/css/bill-screen-style.css',array('openpos.bill.bootstrap'));
    }
add_action( 'wp_enqueue_scripts', 'load_custom_css_to_style_billing_screen', 10 );

• functions
• child-theme
• wp-enqueue-script
• wp-enqueue-style

Share Improve this question edited Mar 25, 2021 at 11:47 evavienna asked Mar 25, 2021 at 10:13 evaviennaevavienna 14111 silver badge55 bronze badges

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

The original stylesheet is enqueued as openpos.bill.bootstrap

wp_enqueue_style('openpos.bill.bootstrap', OPENPOS_URL.'/assets/css/bootstrap.css') // load my custom css after this one

But you've set openpos.bill.style as the dependency:

wp_enqueue_style('bill-screen-style', get_stylesheet_directory_uri() . '/include-parts-from-functions-php-file/frontend-related/plugins/openpos-plugin/pos-app/css/bill-screen-style.css',array('openpos.bill.style'));

These need to be the same.

本文标签： Add custom css file after plugin css with Wordpress Child Theme functionsphp