Collection page: Add custom tag groups for filtering
From version 4.4.0 onwards the Venue theme has the ability to create custom tags/tag groups. These tag groups are a powerful way to help your customers filter and find suitable products to buy.
Why use tag groups?
Tag groups are a more efficient way of organising your product tags. If you were selling smartphone covers you might want to set up some custom tag groups for Manufacturer, Color, Material. You can then display these tag groups with headings in the sidebar filter (or filter drawer) of your collection pages. The power of tags as opposed to collections/menus is that your customer can combine several tags at the same time. So they might use the tags to filter down to 'Samsung + Black + Silicone' which you can't do as easily with menus.
If you used the standard tags method then Samsung, Black, Silicone would be all mixed up with the other colors, manufacturers and materials you offer in one big group of tags on your store which is much harder to navigate for your customer.
There are two steps to displaying tags:
- Create some tags groups for your products. You do this in the Shopify admin.
- Enable the sidebar filters in your collection pages. You do this in the Shopify theme editor.
1. Creating tag groups
Creating these tag groups in your product is almost identical to the way you add standard tags to product but you must use a particular format that utilises underscores.
If for example you had a smartphone cover business some of the tags you would use, in the correct format would be Manufacturer_Samsung, Color_Black, and Material_Silicon. The left side of the underscore is the tag group name (and used as the heading above the tags), and the right side is the tag for the product.
Spaces can be included on either side of the underscore.
2. Display the tag groups in your store
Typically you would display these groups in the filter sidebar or filter drawer on your collection pages.
- Log in your Shopify store admin
- Click on Online Store then Themes in the side menu to get to the themes area of your admin.
- Click the Customize button next to your active theme to go to the theme editor.
- Once the editor is open navigate to any collection page. You can use the dropdown at the top of the screen as a shortcut.
- Once you are viewing a collection page click on the 'Collection page' section on the left of the editor.
- Once this section is open look for the ''Filters' section and make sure the 'Enable filters' checkbox is checked and active.
- You can then decide if to wish to display your filters as a sidebar or a slide out drawer on desktop. Mobile width always uses a drawer design.
- Next you need to add some content (menus and tags) to your sidebar/drawer filter by clicking on the 'Add content' link in the content section below the main filter settings.
- If you are using these Tag Groups we'd recommend you don't use the 'All tags' option as the tags with underscores will look a little messy and confusing for the customer.
- Select 'Tag groups' - this will add all of the tag groups you have set up to your filter.
- Remember to save and then check your work on your live store.
Note: Groups are ordered alphabetically, and so are the tags listed inside the groups. A Shopify expert can help you customize the order