1

I'm trying to edit the revelar theme for my site, I've set up my child theme, created a style.css file and successfully imported all the features from the parent theme, but no matter what I try I can't seem to make any changes to my design. I've tried everything and the code I use in my child theme's style.css file simply isn't showing up on my site. What am I doing wrong?

Really hope someone can help, any input is much appreciated!

My site is: resourcefulliving.dk

Best

closed as off-topic by Michael, cjbj, fuxia Feb 27 '17 at 5:18

This question appears to be off-topic. The users who voted to close gave this specific reason:

If this question can be reworded to fit the rules in the help center, please edit the question.

  • Silly questions: 1) Did you activate the child theme? 2) Did you delete all sorts of cache (browser cache + any plugin cache)? – Scott Feb 23 '17 at 17:24
  • 2
    Just checked, your site is loading the child theme. So the problem is you didn't clear your browser cache. Clear your browser cache and it'll work. (unless your ISP is caching). – Scott Feb 23 '17 at 17:30
0

Looking at your site's source code, I assume it's a problem with the name of your child theme's folder - in the source code view, it shows up as revelar%20child%20theme.

Recommended steps:

  • Re-enable the parent theme.
  • Rename the child theme folder from "revelar child theme" to "revelar-child-theme" ... or anything without spaces or accented characters.
  • Re-enable the child theme.
0

I think @Scott's comments are on the money - your child theme's CSS is applied correctly.

If you're using Google Chrome/Chromium, bring up the Dev Tools by hitting F12, then click and hold the Refresh button and select either of the "Hard Reload" options. Other browsers have a similar feature - see this Codex entry for more information.

If you'd like to skip hard-reloading for every change, a few options exist. If you look at your site's source to see how it loads your parent and child themes' style.css files, you'll see URLs

wp-content/themes/revelar/style.css?ver=4.7.2

and

wp-content/themes/revelar%20child%20theme/style.css?ver=4.7.2

Note the ?ver=4.7.2 at the end - one of the optional arguments for the functions which enqueue scripts and stylesheets is a version number - if the version number is omitted, WordPress uses the WordPress installation's version number, as it has done here. The version number is appended to the end of asset URLs such that when it changes, it automatically invalidates cached copies, and browsers will download the (potentially) new asset instead of using the old one.

If you followed the Theme Developer Handbook's guide on creating a child theme, then you're likely using an action in your child theme's functions.php file to enqueue Revelar and your child theme's style.css files like this:

add_action( 'wp_enqueue_scripts', 'wpse257696_child_enqueue_styles' );

function wpse257696_child_enqueue_styles() {
  $parent_style  = 'revelar-styles';

  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')
  );
}

Note that it specifies the version argument of your child theme's stylesheet as wp_get_theme()->get('Version') - what this does is snag the currently active theme (your child theme)'s version number as specified in the header of your style.css file, if it exists. So one way to break the cache when you make changes, then, is to add a Version: field to your stylesheet header, and then increment it each time you make changes to the stylesheet.

In WPSE #40667, toscho provides a more robust solution which simply sets the stylesheet's version number to the "last modified time" of the file itself - in this manner changing and saving the stylesheet will automatically invalidate the cache without having to manually change your theme's version number. For your needs, such a solution would look similar to this:

add_action( 'wp_enqueue_scripts', 'wpse257696_child_enqueue_styles' );

function wpse257696_child_enqueue_styles() {
  $parent_style     = 'revelar-styles';
  $child_stylesheet = get_stylesheet_directory_uri() . '/style.css';
  $last_modified    = filemtime( $child_stylesheet );

  wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
  wp_enqueue_style( 'child-style',
    $child_stylesheet,
    array( $parent_style ),
    $last_modified
  );
}

Not the answer you're looking for? Browse other questions tagged or ask your own question.