Hide Category Images

Hi, I would like to hide my category images and just show the category names. I know how to remove the images, but the placeholder is still there taking up space. I’ve tried some CSS snippets and they are not working. Any ideas?

Hello,

Please insert the credentials into the Private content below the message area as well as the page where you show the categories.

Best Regards

It’s a generic question that probably pertains to WooCommerce more than you, I was just hoping you would know how it’s done. I just want to hide the category images (i.e. image placeholders) on the category pages so that my main categories for WooCommerce just show a text link to sub-categories instead of a big old empty box about the text. I actually can’t believe it’s not just an option in the WooCommrce categories section. I’ve tried a few scripts that are supposed to do that for me, but it’s not working for some reason. Once I get back to my desk, I’ll get you login info just in case that will help you.

Hello,

There is no option to hide the product category image, I need to give you custom CSS. That is why I ask for URL, if your site is under construction, I will also need site admin access. Please insert the credentials into the Private content below the message area.

Best Regards

The site information, username, and password is in the hidden area below. Please note that it is in a staging area right now and I do have a “code snippets” plug-in installed to add CSS, PHP, etc. but I wasn’t sure where to put it (entire site, front end, back end) but when I tried “entire site” some commonly used code snippets did not work to hide the category images. I also backed up the site at the time of this reply, just in case. I would like to add the code in code snippets or at least know where or how you placed it and what you do, if possible so that I can use it if/when I upgrade my theme. Thank you so much for your time and assistance.

Hello,

All your custom CSS should be added to the Theme Settings > Custom CSS;

JS code is added to the Theme Settings > Custom JS;

If you add any PHP customization you would better add all the code to the child theme, I see you have already installed and actviated.

In this case, all your customizations would not be lost at each update, in any case, we recommend making the full backup of all the sites.

I have viewed the home page and show page and cannot figure out which images you want to hide, please give the page URL and screen I will give you custom CSS.

Best Regards

Hi, I added it, but it didn’t work for some reason. It’s the pages such as this one https://staging.lonepinetechnology.com/product-category/satellite-dish-heaters/ that has the large box placeholders for sub-categories. I’d rather just have it list the sub-category names. It’s actually on any category page that has subcategories. Thanks for your time.

Hello,

Please select “Alternative” in the Theme Settings > Product Archives > Categories styles, I will be able to give CSS.

Best Regards

Found it and done!

Hello,

That is fine!

If you have any questions please feel free to contact us.

Best Regards

Did you send me the CSS already or do it or ? Thanks much!

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

.cat-design-alt.categories-with-shadow .category-image-wrapp {
   display:none;
}

Best Regards

So, that Code also hid the contents so that you have to click on 4 products before you can see the 4 products in that category. I just want to hide the Big empty icons for the sub-categories. If you check out https://staging.lonepinetechnology.com/product-category/satellite-dish-heaters/hotshot/ you will see what it did but I’m hoping there’s a way to just elimate the big white box placeholders for the sub-category images, not the images of the products themselves under there. People won’t see anything in those categories and will probably go away instead of clicking on “4 Products” in order to see them as in this case.

Attachments:

You must be logged in to view attached files.

Hello,

Please remove the CSS I have given you.

Please insert the credentials into the Private content below the message area and provide the screen with what you want to hide.

Best Regards

I think I need to remove the other CSS I tried first because now my two products that were just under the Hot Shot Category itself are not showing up in there. They are gone now, and it just shows the link to the Hot Shot Components when there are also two items that are supposed to be shown under Hot Shot and the Hot Shot Components is supposed to show it’s one items. I want to have products under Hot Shot and also products under Hot Shot Components.

I removed your CSS but there is something in there that seems to be messing me up now, but I can’t find it. I’m thinking the last CSS code that I tried to use is messing me up? Access info is in the private area. The attached image shows what I want to hide. Thank you for your time.

Attachments:

You must be logged in to view attached files.

Side note I tried the Storefront theme to see what’s going on and my images under main categories that have sub-categories have disappeared somehow. I used to have 2 products under here https://staging.lonepinetechnology.com/product-category/satellite-dish-heaters/hotshot/ but now it only shows the sub-category and sub-category placeholder for some reason. I simply didn’t want to see the sub-category image placeholders, I didn’t want my products to disappear. Any idea on that? It’s the same with any theme I use. I don’t remember changing any woocommerce settings like that. Thanks for your time. Login info is in the private area of my last comment.

Hello,

You need to delete the placeholder image in the Theme Settings > Performance > Lazy loading > find the option “Upload custom placeholder” image and remove the image.

Best Regards

[Author]

Posts