This guide will help you create unique tabs on your product page so that you can add unique details for each product with the use of metafields.
In this section you will learn how to:
- Add code that will enable unique product tabs
- Setup unique product tabs
1. Add code that will enable unique product tabs
From the Shopify Admin:
- Click "Online Store"
- Next to your copy of Loft, click "Actions"
- Click "Edit code"
- In the left sidebar, scroll down to "Snippets" and click to open
- Click the file called "product-description.liquid"
- Select all the text and replace it with the contents of this file here
2. Setup unique product tabs
- Once the code from step 1 has been added you will need to install a metafields editor. We suggest installing the ShopifyFD Dashboard Tool chrome extension but you can find more on the Shopify app store here
- The metafields you'll want to use on the products are listed below:
- Now, if the product has a specific metafield, that content is what shows in the respected tab. If it doesn't, then the tab will just show the content setup in the section settings
- Add the metafields to your product by going to Products->The product that you want to have unique tabs
- Load ShopifyFD Dashboard Tool by clicking on its icon in the Chrome menu bar ->
- Create the metafields by adding their info. (i.e. For tab2 you have to add Namespace->tab2, Value->content, Content->The content that you want to be displayed on the related product)
- Click "Save" on the metafields editor
- Click "Save" on the product editor
- The content has now been added to your product's tab
- In order to edit the content of the tab, as you've already created the metafield for this specific product, you can just select the metafield from the dropdown menu after loading the ShopifyFD Dashboard Tool extension
- For a third tab, follow the steps above and replace the number 2 with 3