Managing Store Categories

One of the first steps in creating a great user experience for your shop customers is setting up product categories. Creating an effective category structure will help your customers easily find the products they're looking for. An effective category structure can also increase sales by way of related products!

Categories of the first level are referred to as 'top level' or 'root' categories. You can also create categories of the second, third, etc. level within your root category. These are referred to as 'subcategories.'

 

Creating categories and subcategories

To begin creating new categories in your store, click Shop App from your Marketing 360 dashboard or from the App Menu in the top right corner of the page.

To create a new root category:

1. From your Shop App dashboard, click > Catalog > Categories.
2. Click + Add Root Category.
3. Enter a category name.
4. Click Choose file to upload an image for your category.
5. Enter the description (optional).
6. Click Save.

Lets take a look at an example:

 

To create a new subcategory:

To create a new sub-category, follow the same process from above, but select + Add Subcategory instead.

1. From your Control Panel, click 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.
4. Enter the Name of your category.
5. Click Choose file to upload an image for your category.
6. Enter the description (optional).
7. Click Save.

 

Assigning products to categories

You can assign products to multiple categories at once. For example, an item that belongs to the Accessories category can be on sale and belong to the Sunglasses category as well.

To begin creating new products in your store, click Shop App from your Marketing 360 dashboard or from the App Menu in the top right corner of the page.

 

To assign a product to a category:

1. From your Shop App dashboard, click 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.
5. Select multiple items in the list, then click Add products to add items in bulk or Click the + icon to the right of the product name to assign products one by one.

Lets take a look at an example

 

You can also assign products to categories and move them from one category to another when you edit the product:

1. From your Shop App dashboard, click Catalog > Products.
2. Click the product name to edit its details.
3. In the Categories section near the bottom of the page, click Change Categories.
4. Select the category to which you want to assign the product and click Ok.
5. Click Save.

Lets take a look at an example

 

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

To rearrange many products, it’s best to import them with new parameters. Please refer to the articles about exporting and importing your products.

 

Sorting products in categories

You can sort the products automatically for your customers by date added, by price or by name. You can also set a custom order of products within a category and sort the products manually.

 

Adding categories to your website

To add categories to your website, you will first need to embed your entire storefront on your website. Once your store is embedded, you will want to open each category to find its Category ID from the URL at the top of the page.

Follow these steps to embed your store on your website.
Tip: If you don't want to publish your entire storefront on one page, then you don't have to click PUBLISH. You can find the Category IDs in the "preview" window and then remove the embed code.

 

Embedding categories on your website

After your store is embedded on your website:

1. Click Design this page on the top-right corner of the page, then select the "eyeball" icon at the top of the design preview window. This will open a "preview" of the page in a new tab.
   
2. On the preview page, you will see your store appear on the page. Navigate to the category you'd like to embed on the site - highlight and copy the numerical string that follows the /c/ in the URL. That is your Category ID; save it to a clipboard for the next step.
   Note: If you'd like to embed multiple categories, then you should grab their respective Category IDs at this time.
   
3. Return to the HTML Block and remove the code you entered in Step 5 above. Replace it with the code below:
   

   <!--PRODUCT GRID-->
   <div>
   <script type='text/javascript' data-cfasync="false" src='https://app.shop.websites360.com/script.js?xxxxxxxx'></script>
   <script type='text/javascript'>
   xProductBrowser(
   "id=my-store-xxxxxxxx","defaultCategoryId=yyyyyyyy",
   "views=grid(5,3)"
   );
   </script>
   </div>

4. Replace 'xxxxxxxx' with your Store ID. Pro Tip: Use the Find & Replace feature! 
   Click here to learn how to find your Store ID.
5. Replace 'yyyyyyyy' with the desired Category ID. 
6. Click Save on the HTML block.

Click Publish at the top of the page to take your store live!

 

Linking to categories in your navigation menu

You can generate direct links to your store categories on your website. You may wish to link to your store categories on a dropdown menu on your website's top navigation, or perhaps on a linked image on your home page.

To grab the URL for your store categories, visit your live website and navigate to the desired category page. Copy the full URL in the address bar. See the screenshot below for reference.

Remember! If you ever change the Primary URL for your website, then you should also update the URL wherever you link to your store categories.

If you use Websites 360 for your website, then you may wish to link your store categories to your website's top navigation. To do this, you will want to create a Navigation Item that links to each category.

After you've followed the steps to create a Navigation Item, navigate to the Content panel and find the Navigation Item that you will be adding the link. Paste the URL in the Link field.