Product categories

Categories are groups of products that you wish to show on the same page in your store (for example, Women's Fashion, Men's Clothing). They help customers to faster navigate through the store and find the products they need. The same product can belong to multiple categories at the same time. Read more about how to manage the categories in your store.

Creating categories and subcategories

The products from one category are listed on a separate page in the storefront. This page can have a description and a featured image. When adding an image, make sure that it represents well the content of the category.

Use the description to tell your customers what they will find in this category and what are the best things about the products there. Try not to make the description too long.

Find out how to add a welcome text to your store with the help of a category description.

See a video on how to add your first category:

In Ecwid you can create a complex category structure with several levels. Categories of the first level are referred to as root categories. These are the categories your customers see in main navigation. You can also create categories of the second, third, etc. level within your root category. They are referred to as subcategories or child categories.

Clear and concise category structure makes your store’s navigation intuitive. This allows your customers to find easily what they are looking for. That’s why we recommend planning your category structure before adding products.

Customers can navigate your categories and subcategories with the help of breadcrumbs – special links that show the path to the page they are currently viewing.

Here are the steps to create a new category of the first level:

  1. Go to your Ecwid Control Panel → Catalog → Categories.
  2. Click Add Root Category:

Add root category

  1. Enter the Name of your category:

Enter category name

You can edit the name of a category anytime later. To do it, just change the text in the Name field and save changes.
  1. Click Choose file to upload an image for your category. You can upload an image that represents your category or an image of a product from the category:

Upload category image

  1. Enter the description. You can describe what kind of products are in that category, or just leave it blank:

Enter category description

  1. Click Save.

To create a new subcategory:

  1. Go to Ecwid Control Panel → Catalog → Categories.
  2. Select the category into which you want to add a subcategory from the category tree on the left.
  3. Click Add Subcategory:

Add subcategory

  1. Enter the Name of your category:

Enter subcategory name

  1. Click Choose file to upload an image for your category. You can upload an image that represents your whole category or an image of a product from the category:

Upload subcategory image

  1. Enter the description. You can describe what products are in that category, or just leave it blank:

Enter subcategory description

  1. Click Save.

Assigning products to categories

In Ecwid a product must belong to at least one category. So, when you add products without assigning them to any of your own categories, they are automatically assigned to the Store Front page category and appear as featured products on your storefront.

To show products in your own categories, you should assign them to these categories. You can add products to multiple categories at once. For example, an item that belongs to the Shoes category can be on sale and belong to the Sale items category as well.

To assign a product to a category:

  1. Go to Ecwid Control Panel → Catalog → Categories.
  2. Select the category to which you want to assign a product from the category tree on the left.
  3. Switch to the Category products tab.
  4. Click Assign Products to Category:

Category products tab

  1. Select the necessary items in the list. You can filter the products by SKU and Name.
  2. Click Add products to assign items in bulk (or click the Plus icon to assign products one by one):

Assign products to category

Besides making such changes on the category level, you can also assign a product to categories (or move a product from one category to another) right in the product's editing page:

  1. Go to Ecwid Control Panel → Catalog → Products.
  2. Open the product in editing mode.
  3. In the Categories section at the page bottom click Change Categories:

Change categories

  1. Select the category to which you want to assign the product and click Ok:

Select category

  1. Click Save.

You can see how many products are assigned to this or that category in the category tree in Ecwid Control Panel → Catalog → Categories:

Ecwid_Control_Panel_2019-10-18_16-41-29.png

Note that it may take several minutes for the numbers to update in the category tree after you make changes in your catalog structure.

Moving products from one category to another

You may need to rearrange products in your store and move them to another category. You can do this by exporting the products and importing them to a new category or by editing the categories manually.

Exporting the products and re-importing them to a new category

To rearrange many products, it’s best to import them with new parameters. You need to export the products you want to change, edit them in a spreadsheet and then re-upload them to your store using the import feature. Please refer to the articles about exporting and importing your products.

Editing the categories manually

Here are the steps to rearrange the products manually:

  1. Go to Ecwid Control Panel → Catalog → Categories.
  2. Find the desired category in the left panel and click it..
  3. Open the Category products tab:

category_products__1_.png

  1. Click Remove All. They are now uncategorized and will be listed on the storefront page much like featured products.
  2. Open the category where you want to move the products.
  3. Open the Category products tab.
  4. Click Assign Products to Category.
  5. In the popup, select the products to add.
  6. Click Add products:

add_products_to_category__1_.png

  1. These products are now listed under the desired category.

Sorting products in categories

You can choose in what order to show the products in the storefront to your customers. Products can be automatically sorted by date added, by price or by name. Or you can set a custom order of products within a category and arrange the products manually in the desired way.

For detailed instructions, please visit Sorting products.

 

Changing categories order

If you wish to show some categories first, you can easily change the order of categories and subcategories:

  1. Go to your Ecwid Control Panel → Catalog → Categories.
  2. Drag and drop categories in the category tree:

Drag and drop categories to sort

Disabling and deleting categories

If you wish to remove a category from your store, you can disable it or delete permanently.

Disabling a category

When you disable a category, it stops showing in your store. At the same time, you can see it in your Ecwid Control Panel and enable it back if needed.

To disable a category:

  1. Go to your Ecwid Control Panel → Catalog → Categories.
  2. Select the category you want to disable.
  3. Click Disable:

Disable a category

The enabled products from a disabled category will not show in the storefront navigation, but will still be available by a direct link and in the search results.

Deleting a category

If you wish to remove a category completely, you can delete it:

  1. Go to your Ecwid Control Panel → Catalog → Categories.
  2. Select the category that you want to remove in the category tree on the left.
  3. Click Delete category:

Delete category

The products that were assigned to the deleted category will not be deleted. They will be moved to the Store Front page category.

Hiding category images

When you add a category in your store, you can upload a category image to illustrate what it’s about. For categories with no images Ecwid shows a gradient as a placeholder image in the storefront:

placeholder gradient images

You can upload your own category image instead of a default gradient image at any time later.

In case you want to show only category names, you can hide the placeholder images while keeping the clickable category titles with the help of a ready CSS code added to your store theme.

Hide category images

To display only category names without images across the store:

  1. Go to Ecwid control panel → Design page;
  2. Сhoose Display category name below the image option in the Category name position section;
  3. Click Create Theme (or Edit Theme) and add these CSS codes to your store theme:

.ec-size .ec-store .grid__categories--appearance-below .grid-category__image {
display: none;
}

.ec-size .ec-store .grid-category__image,
.ec-size .ec-store .grid-category__spacer {
display: none;
}
  1. Save the changes.

Hide category images and titles

As a design choice, you may want to hide the category cards completely in your store and add the horizontal category widget to your website so that customers can use it for navigation through your catalog.

To hide the category cards completely in the store:

  1. Go to your Ecwid control panel → Design;
  2. Click Create Theme (or Edit Theme);
  3. Add this CSS code to your theme

.ec-size .ec-store .grid__categories {
display: none;
}
  1. Save the changes.
If you are using Ecwid Instant Site, you already have a horizontal category menu in your store. It is formed automatically and shows the root categories: horizontal menu in instant site

Since only root categories are displayed in the horizontal category menu in Instant Site, we do not recommend to hide the category cards completely in your store there, if you have subcategories. Instead of this, you may want to hide category cards from your store front page only and keep them in your category pages. Thus customers can see subcategories when they enter your category pages.

Hide category cards in store front page

If you want to have a more compact view for your first store page (for example, to display only horizontal menu and featured products there), you can hide the category cards from the store front page. At the same time, you can keep category cards in your category pages so that customers can see subcategories there, if any.

To hide the category cards in the store front page only:

  1. Go to Ecwid control panel → Design page;
  2. Click Create Theme (or Edit Theme)
  3. Copy this code:

.ec-size .ec-store.ec-store__category-page--0 .ec-grid .grid__categories {
display: none;
}
  1. Add it to your store theme.
  2. Save the changes.

Related articles

Hidden products and categories
Adding horizontal categories menu
Category displayed to first-time visitors
Customizing category pages

Was this article helpful?

Awesome! Thanks for your feedback!

Sorry about that! We are here to assist you by email or chat.

Contact support