WordPress.org

Forums

Dependency Minification
[resolved] Minifying Child Theme CSS but not Parent CSS (6 posts)

  1. ModularBase
    Member
    Posted 2 years ago #

    Site: demo.modularbase(dot)com
    Both parent and child CSS are enqued through functions.php. The plugin minifies the child CSS twice, and does not minify the parent CSS.
    (mbsimplicity theme is child of modularbase theme - parent CSS called by @import in child CSS)

    /*! This minified dependency bundle includes:
     * 01. http://demo.modularbase.com/wp-content/themes/mbsimplicity/style.css
     * 02. http://demo.modularbase.com/wp-content/themes/mbsimplicity/style.css
     */

    When performing tests on page tests for "Website Speed and Performance Optimization" on sites such as GTmetrix (gtmetrix(dot)com), it shows the parent CSS not being minified.

    http://wordpress.org/plugins/dependency-minification/

  2. Weston Ruter
    Member
    Plugin Author

    Posted 2 years ago #

    Please share the full wp_enqueue_style calls that are in the parent theme and in the child theme.

  3. lkraav
    Member
    Plugin Contributor

    Posted 2 years ago #

    I think using @import shows the theme authors are not very well versed in their business.

  4. ModularBase
    Member
    Posted 2 years ago #

    @ Weston Ruter ...great plugin, btw :)

    from child theme...

    function mbsimplicity_scripts_styles() {
    	wp_enqueue_style( 'mbsimplicity-style', get_stylesheet_uri() );
    }
    add_action( 'wp_enqueue_scripts', 'mbsimplicity_scripts_styles' );

    from parent theme...
    -this is in the theme set-up function at the start of functions.php-

    add_action( 'wp_enqueue_scripts', 'modularbase_scripts_styles' );

    -this is further into the file-

    if ( ! function_exists( 'modularbase_scripts_styles' ) ) ;
    
    function modularbase_scripts_styles() {
    	wp_enqueue_style( 'modularbase-style', get_stylesheet_uri() );
    }
    endif;

    ======

    @lkraav

    from the WordPress Codex : Child Themes (http://codex.wordpress.org/Child_Themes)

    The child theme’s stylesheet will overwrite the parent theme’s stylesheet, but chances are you want to include the parent theme's stylesheet. To do this, you need to start the stylesheet with the following line: 
    
    @import url("../twentythirteen/style.css");
  5. Weston Ruter
    Member
    Plugin Author

    Posted 2 years ago #

    @Modularbase:

    The problem is that you are registering the same script twice via get_stylesheet_uri().

    Your child theme can continue to have:

    function mbsimplicity_scripts_styles() {
    	wp_enqueue_style( 'mbsimplicity-style', get_stylesheet_uri() );
    }
    add_action( 'wp_enqueue_scripts', 'mbsimplicity_scripts_styles' );

    But then your parent theme needs to not use get_stylesheet_uri() but instead a function that returns the stylesheet URL for the parent theme, for example:

    function modularbase_scripts_styles() {
    	wp_enqueue_style( 'modularbase-style', get_template_directory_uri() . '/style.css' );
    }
    add_action( 'wp_enqueue_scripts', 'modularbase_scripts_styles' );
  6. ModularBase
    Member
    Posted 2 years ago #

    Your completely correct and I totally missed this. Thank you very much for pointing this out.

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • Dependency Minification
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic