Product tabs
Organize your product description with easy to use tabs
Last updated
Organize your product description with easy to use tabs
Last updated
Product description tabs in Pipeline supports Shopify's Dynamic source feature with Online Store 2.0. Metafields allow you to attach custom content to each product and then display them on the product page.
With Shopify Online Store v2.0 (OS2) and Story 2, you can use metafields to store and display unique content for each tab including the title and tab content.
In this quick video (from our Pipeline theme using the same concepts), we demonstrate how to create a tab called "Ingredients". This tab uses metafields to add unique content for any product. Steps included:
Create a tab in the Theme Editor with the default product template, product description.
Define a product metafield called "Ingredients".
Add the newly defined metafield as a dynamic source.
Add unique content to a product in Product setup.
View the new tab which only appears on products that have content added.
A quick method to modify the metafield content for any product when in the Theme Editor:
Product tabs in Story help you organize product specific, unique product information and also shared content for all your products.
Easily add shared information once into Story's tab blocks to display the same content on all your product pages in one step. No need to repeat that information on all product pages.
Mix unique content tabs and shared common tabs.
Shared content tabs are added in the Theme Editor. Choose Add content and select from:
Text HTML Page
Description H6 is for unique content and covered below.
Unique content specific tabs be created for each individual product. Create as many tabs as you like.
To create unique content specific tabs, add the Description H6 block under content:
After adding Description H6, simply add content in your Product Description and use an H6 for the tab title.
Learn how to add unique content tabs in Story and how to combine uniquie content tabs with shared tabs:
Tabs can be displayed below or beside the product image:
Display tabs as accordions when a large number of tabs are used:
