Proper Enqueuing of Child Theme; Removing Query Strings

  • Chris

    (@chrisnawojczyk)


    6 years, 2 months ago

    I created a child theme for customization by enqueuing it in functions.php:

    <?php
function my_theme_enqueue_styles() {

    $parent_style = 'twentynineteen-style'; // This is 'twentynineteen-style' for the Twenty Nineteen theme.

    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
        wp_get_theme()->get('Version')
    );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
?>

    Upon creating the file, I inserted additional code below to remove query strings from static resources, which I often put in other themes to enhance speed.

    //* TN - Remove Query String from Static Resources
function remove_css_js_ver( $src ) {
if( strpos( $src, '?ver=' ) )
$src = remove_query_arg( 'ver', $src );
return $src;
}
add_filter( 'style_loader_src', 'remove_css_js_ver', 10, 2 );
add_filter( 'script_loader_src', 'remove_css_js_ver', 10, 2 );

    Unlike other themes, the string removal code shows up above the header of the site. I removed it at this time. Did I enqueue the child theme properly?

    Thanks!

    • This topic was modified 6 years, 2 months ago by Chris.
    • This topic was modified 6 years, 2 months ago by Chris.

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)

  • You did it right but wrong.
    The Twenty Nineteen theme has
    wp_enqueue_style( 'twentynineteen-style', get_stylesheet_uri(), array(), wp_get_theme()->get( 'Version' ) );

    That means that if you make a child theme, it will be loaded using the twentynineteen-style handle and the child theme version. (I wrote an issue on this, but they didn’t want to change it.)

    So then your code properly loads the Twenty Nineteen style with that same handle and your child-style handle is used on your child file (which could just use get_stylesheet_uri()), and is dependent on the twentynineteen-style. You need to look into which one is run first and whether the 2nd enqueue of the same name is overwriting the first or just adding another.

    I don’t know why your code would show in the output page, but you must have done something strange.

    Thread Starter Chris

    (@chrisnawojczyk)

    Thanks, but I’m confused. How should the entire code look exactly? I took the part you gave me and replaced it with the part I thought was incorrect; it broke the site’s design.

    Please give me an example of the entire function.

    • This reply was modified 6 years, 2 months ago by Chris.

    OK, I looked it up for you. The child functions.php is loaded and then the parent functions.php is loaded. So since neither is specifying other priorities in the add_action call, the child actions will be run before the parent actions.
    That means that the parent call to wp_enqueue_style for the twentnineteen-style handle will be ignored (it already exists, so it just returns false), which is good since it would be loading the child stylesheet under that handle.

    So your code enqueues the child style with a version number and then you add a filter to remove the version numbers. It’s not that great for your visitors to have the old version cached and not see the new version, but you can remove them I guess.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Proper Enqueuing of Child Theme; Removing Query Strings’ is closed to new replies.