Tab content using metafields
Add unique content to tabs and accordions using metafields
To add unique content to your product tabs or accordions, we can use metafields. With metafields, we can easily display unique content and information for all products or only specific products.
Example of unique tab content for one product:
Artist tab - Product 1
Example tab content from another product:
Artist tab - Product 2
Tabs are dynamic when using metafields. Some products may not display the tab entirely:
There are three main easy steps when configuring your product template and products to use metafields.
- 1.Define a product metafield in the Shopify Admin Settings.
- 2.Link the metafield to a product description tab in the Theme Editor.
- 3.Add unique tab content to individual products in the Shopify Admin Product setup.
The first two steps only need to be performed once. The third step is done to any or all your products individually.
All steps are covered in this video:
Tip: Watch the video at 1.2X or 1.5X speed, slow down when needed.
You can use the following reference information to help with the steps covered in the video.
The first step is to create a product metafield under Shopify Admin -> Settings -> Metafields
Create or define a Product metafield for your tab content using Multi-line text as the content type.
Define a Product metafield:
- Provide a Name like Tab Content
- Use the default Namespace and key, no change is required.
- Description is optional
- Choose Multi-line text as the content type
Using the Theme Editor, use the Insert Dynamic Source icon to link the metafield you created with the tab text section in the Product description settings.
Theme Editor -> Default product templateI
- Under Product description in the Default product template, choose a tab.
- Under Tab Text, click on the Insert Dynamic Source icon.
- Choose the metafield you created/defined earlier.
You are now ready to add unique content to any of your products. All content is added in the main Shopify Admin -> Products
Shopify Admin -> Products
Find a product that will have custom tab content and scroll to the very bottom of the product setup. Under Metafields, add your text to the metafield you created:
Repeat this last step for each product in your inventory that requires unique tab information. Leave blank if no information is needed.