Child Theme is ignored

  • I want to change the color of the bar below the ‘Poste On’ line from green to red. I have created a child theme and edited the color in the child theme but when I inspect the site it still loads this part from the parent theme.

    What I do:

    1) Load Child Theme last in function.php

    function test_dequeue_styles() {
	// this removes the original style
	wp_dequeue_style( 'start-style' );
	wp_deregister_style( 'start-style' );
}
add_action( 'wp_enqueue_scripts', 'test_dequeue_styles', 20 );

function test_enqueue_styles() {
	// parent style ( this loads the css from the main folder )
	wp_enqueue_style( 'start-parent-style', get_template_directory_uri() .'/style.css' );
}
add_action( 'wp_enqueue_scripts', 'test_enqueue_styles' );

function new_enqueue_styles() {
	// child style ( this loads the css from the child folder after parent-style )
	wp_enqueue_style( 'start-child-style', get_stylesheet_directory_uri() .'/style.css' );
}
add_action( 'wp_enqueue_scripts', 'new_enqueue_styles', 999 );

    2) Modify the color in styles.css (in Child theme)

    .total-comments span:after, span.sticky-post, .nav-previous a:hover, .nav-next a:hover, #commentform input#submit, #pageasyform input[type='submit'], .home_menu_item, .currenttext, .pagination a:hover, .readMore a, .bclwp-subscribe input[type='submit'], .pagination .current, .woocommerce nav.woocommerce-pagination ul li a:focus, .woocommerce nav.woocommerce-pagination ul li a:hover, .woocommerce nav.woocommerce-pagination ul li span.current, .woocommerce-product-pageasy input[type="submit"], .woocommerce a.button, .woocommerce-page a.button, .woocommerce button.button, .woocommerce-page button.button, .woocommerce input.button, .woocommerce-page input.button, .woocommerce #respond input#submit, .woocommerce-page #respond input#submit, .woocommerce #content input.button, .woocommerce-page #content input.button, #sidebars h3.widget-title:after, .postauthor h4:after, .related-posts h3:after, .archive .postsby span:after, .comment-respond h4:after, .single_post header:after, #cancel-comment-reply-link, .upper-widgets-grid h3:after, .site-branding .site-title:after, .thumbnail-post-content .entry-meta:after

{background-color: #d7000a;
}

    I don’t understand why the child theme is not taken into account for this.

    On a similar note is there a way to exactly identify the name/element with Chrome –> inspect (i.e. the line after the posted on) as the above only shows a very long list of elements the color is applied on.

    Appreciate any help.

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

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

  • the line shows red in my browser (chrome).

    try to clear all browser caches…

    Moderator bcworkz

    (@bcworkz)

    It does seem like your browser is using stale CSS. All the same, the order you add action callbacks has nothing to do with the order WP calls them in, nor does the order in which styles are enqueued. To ensure your CSS always loads after the parent’s, specify ['start-parent-style'] as the dependency argument when you enqueue ‘start-child-style’. Then your equivalent rules will override the parent’s.

    There are on occasion one or two stubborn rules where the above doesn’t seem to work. In those cases, adding the rules to the Additional CSS panel of the customizer usually works. If all else fails, add the !important modifier to your problem rule.

    Thread Starter kevinziegler

    (@kevinziegler)

    @bcworkz thanks for the answer. Sorry, I am quite new to PHP. Can you tell me how exactly the code would look like or where to add the dependency argument?
    Thanks a lot (and sorry for being an idiot ;))

    Moderator bcworkz

    (@bcworkz)

    No worries.
    wp_enqueue_style( 'start-child-style', get_stylesheet_directory_uri() .'/style.css', ['start-parent-style']);

    If your PHP does not recognize the ['array element'] syntax, you really should get your host to update. As a workaround use array('start-parent-style') instead.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Child Theme is ignored’ is closed to new replies.