Search icon disappeared in child theme

Hey there aharmer,

Hope you’re well today!

It appears that the image is not being properly displayed. When inspected it shows the image as 1×1.

Could you please check if the image is actually good in images/icons/1x/spyglass-d.png.

Best regards,
Bojan

Thanks for the reply Bojan.

I had a look at the file and it is 20×20 px.

Interestingly, when I click on the Appearance>Customise tab in wp-admin and get the site preview, the icon does show, just not in the published version.

Hey again aharmer,

That’s weird. Not sure if this is going to help but you could try uploading the spyglass image from freshly downloaded theme to your media library and then try adding the following CSS code in the style.css file of your child theme.

body .main-menu a.search-toggle {
background: url(your_Image_URL) no-repeat center;
}

Hope this helps ??

Cheers,
Bojan

OK, I already have that code in my stylesheet.

Is a possible the problem that I just copied the entire style.css contents to my child theme css, instead of only the including the changes I wanted?

Cheers.

Is a possible the problem that I just copied the entire style.css contents to my child theme css, instead of only the including the changes I wanted?

Yes. Your theme sets the path for the search icon relative to the location of the stylesheet, so the browser looks for the search icon in your child theme’s folder and doesn’t find it. You should properly enqueue the parent theme’s stylesheet as detailed in the Codex: https://codex.www.ads-software.com/Child_Themes

Thanks for the reply, but I’m afraid that hasn’t solved the issue. I now have only the css edits included in the child style.css file, and have added lines below to my functions.php file, but no change.

add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}

Any other ideas? I’m at a loss.

When I look at your site (10:27pm, Mountain time), I still see the entire parent theme’s stylesheet in your child theme’s stylesheet. Are you using a caching plugin or is your hosting provider caching your site?

My site seems to be working fine now. My hosting provider does cache my site, but I had tried flushing the cache several times at the time of my last posting here without effect. When I look at my site now several hours later everything seems fine. I wonder if there is some lag between flushing the cache and it actually taking effect.

Thanks everyone for your help, it is much appreciated.