Adding categories menu

To add a menu with your store categories to a website where your Ecwid store is added, use the Category Navigation Menu widget. It's a piece of a code that should be pasted to a website source code. If you have many nested categories, the menu will help shoppers quickly find the category they need:


image4.jpg

The menu adjusts to the width of the page it’s been added to. If added to a responsive website, the menu is also responsive and looks great on mobiles:

image1.gif

You can add this menu to your website if you have a custom site or use a site builder or CMS where you can edit the source code of your pages.

For Wordpress users: if you’ve added your Ecwid store to a Wordpress site, the Ecwid plugin has a ready setting for adding a store with category menu.

For Wix users: you can add your store categories to the horizontal menu of Wix site menu following this instruction Adding categories of your Ecwid store on Wix.

Get the code for your category menu

To get the menu widget code for your store:

  1. Go to Ecwid control panel → All Sales Channels → Custom website.
  2. Scroll to the Store extensions section and click Add Category Navigation:

Ecwid_Control_Panel_2019-08-12_16-48-01.jpg

The code will be copied.

Alternatively, you can copy the code for a category menu widget below (just make sure to replace 1003 in the example below with your store ID):

<div id="my-categories-1003"></div>
<div>
<script data-cfasync="false" type="text/javascript" src="https://app.ecwid.com/script.js?1003&data_platform=code" charset="utf-8"></script>
<script type="text/javascript"> xCategoriesV2("id=my-categories-1003"); </script>
</div>

Now you can add the code for your store's category menu to your site.

Add the category menu code to your site

To add the category menu to a site page, you should have access to the source code of that page. The exact steps depend on the site builder or CMS you use for your site, but generally, the steps are as follows:

  1. Log into the backend of your site.
  2. Open a page with your store for editing (in <HTML> mode).
  3. Paste the menu code that you’ve generated earlier to the source code of that page (if it’s a page where you’ve added your store, put the menu code above your store code).
  4. The categories will appear as soon as you save the changes and publish your site.

Alternative widgets for category menu

You can also add a category menu to your website with the help of the Multi-level Illustrated Menu app from Ecwid App Market. This app shows categories in the menu with category images and descriptions. The menu is optimized for any device and you can customize its position as well as the color scheme.

Here's how it looks in Desktop:

image2.gif

On mobiles:

04_iPhone.gif

This app requires payment and subscription to any paid Ecwid plan.

Was this article helpful?

Awesome! Thanks for your feedback!

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

Contact support