How to Display Product based on the Tag?

The J2store development team has brought to us a new type of menu item which allows you to create products’ tags. This feature is available from version 3.2.25 of J2Store.

Initially, Product list layout has displayed products based on categories in the previous version, but from J2store 3.2.25 version, you can display products based on tags.

When you add a tag to 2 or more products from the backend, the products listed below that specific tags will be shown in frontend when customers choose the menu.

Product tag layout and product list layout has the main difference which is we use tags to filter articles in latter, while we use categories to filter in the former.

 Joomla has provided the tags which help you organize content flexibly. When you tag an item to a particular tag and browse to the link of the tag, you will see a list of items tagged with that tag.

Overview

• Before you create a menu of a type of product tag, It is important to create a product tag first
• Create an article then add a tag
• Create a menu item of the Product tags type then choose the tag acting as the filter to show the products

There is no option for filtering products based on categories because there is no category involved here. Therefore, that parameter has been deleted.

Creating a tag

Please follow the steps below to create a tag

Step 1: Access Components > Tags

Step 2: Choose New to create a new tag

Step 3: Type in the tag title, description, and choose parent tag (if it has) according to the requirements

Step 4: Add the tag note, stop user groups and choose which language will be applied for the tag.

How to add a tag to product?

When you have created a tag, the second task is adding it to products. Please follow the instructions below:

Step 1: Access Content > Product article

Step 2: find the tab Content, in the Tags column having the tag which can be added

How to create a menu for the type product tag

After creating tag and adding it to the article of products, you will need to create a menu item of type Product Tags

Step 1: Access Menus > Menu Items > New

Step 2: Set menu title and menu item type need to be “J2Store product tag layout”.

Step 3: Choose tag for menu item. Only choose the tag associated with menu item

Step 4: (additional) choose Common options tab > set Sub-template to tag_bootstrap3, which allows you to display tags on the layout different with the default one.

Step 5: choose sub tag level until there are products displaying under tab “Item view in Category listings” in  “Sub Tag level” option.

Besides, the image below shows other options which can be picked when it comes to Product Tag layout.

Sub-tag level can be chosen in case you have tags including parents like below:

As the result, you will see how the frontend displays:

That’s it! If you have any problem or question, please feel free to let us know by leaving a comment below, we will reply as soon as possible!

Image Credit: J2store