Woocommerce include custom stylesheet after woocommerce styling

After the upgrade to WC 2.1.2 my styling seems to be overruled by the standard WC styling. Is there a way to overrule the standard WC styling without using solutions like using the !important or other hackish methods?

Maybe by enqueueing it in a certain way in functions.php?

Read More

A lot of people recommend to disable WC styles and to copy all the styles into your own theme styles. But isn’t this bad if Woocommerce adds functionality?

Related posts

1 comment

  1. wp_enqueue_style supports dependencies. So, if you make the WooCommerce style a dependency for your new stylesheet then your stylesheet will always load after the WooCommerce stylesheet.

    Something like this ought to work, but it is untested:

    function enqueue_style_after_wc(){
        $deps = class_exists( 'WooCommerce' ) ? array( 'woocommerce-layout', 'woocommerce-smallscreen', 'woocommerce-general' ) : array();
        wp_enqueue_style( 'my-style', 'my-style.css', $deps, '1.0' );
    }
    add_action( 'wp_enqueue_scripts', 'enqueue_style_after_wc' );
    

    EDIT: It turns out you don’t need to use dependencies. You just need to enqueue your styles after WooCommerce enqueue’s theirs…. by using a later priority.

    function enqueue_style_after_wc(){
            wp_enqueue_style( 'my-style', 'my-style.css', array(), '2.0' );
    }
    add_action( 'wp_enqueue_scripts', 'enqueue_style_after_wc', 20 );
    

Comments are closed.