How to remove category icons from the store

Last updated

1. You can hide category icons in your product browser by applying the following code to your CSS theme. You should add the corresponding code to your active CSS theme in your Ecwid Control Panel > Settings > Design. Scroll down to the [Customize the Look of Your Store] section and click the [Create theme] button. Please remember to activate the theme and save the changes after the codes are added.


.ec-store .grid__categories {
display: none;
}

table.ecwid-productBrowser-subcategories-mainTable {
display: none;
}

After you apply it, Ecwid will not show category icons in the product browser at all. So your customers will be able to open categories via the category widget or direct links only.

2. If you want to remove the category icons on the root store page only, apply this code:


div.ecwid-productBrowser-CategoryPage-0 table.ecwid-productBrowser-subcategories-mainTable {
display: none;
}

div.ecwid-productBrowser-CategoryPage-0 .ec-store .grid__categories {
display: none;
}

You can use this code to customize the welcome page of your store, e.g. hide the category icons on the store front home page and add the description to it. Since the description can contain HTML code, images, video, etc, your welcome store page can look very different.

3. If you want to remove icons, but still show category names, apply this code:


table.ecwid-productBrowser-subcategories-mainTable img {
   display: none; 
}

a.grid-category__image {
  display: none;
}

4. If your categories have no category image, you can hide the gift icon by using the following code:


div.ecwid-noimage, div.ecwid-noimage-small { 
display:none;
} 
Was this article helpful?
2 out of 3 found this helpful
Questions?
Get help
  • Presales Chat

    Need help choosing the right Ecwid plan? Our Sales team has the answer you’re looking for.

  • Forums

    Join the Ecwid community. Discuss support topics and store ideas with other Ecwid users.

  • Contact us

    Still have questions about Ecwid? Let us know! We will be glad to help you with your Ecwid store.

  • Status Monitor

    Get real time status updates on Ecwid services here, 24/7