Product tabs

Organize your product description with easy to use tabs

Story 2.0

Metafields for displaying unique and custom content

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.

Unique content

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.

Video tutorial on how to create metafields and add to your product tabs:

Video from our Pipeline theme using same concepts - Story version coming soon

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.

Tip for editing metafield content

A quick method to modify the metafield content for any product when in the Theme Editor:

Opens the metafield information for current product

Story 1.x

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

Add once to display on all products

Shared content tabs are added in the Theme Editor. Choose Add content and select from:

Text HTML Page

Text, HTML and Page are Shared tab types

Description H6 is for unique content and covered below.

Add Shopify Pages or HTML directly into tabs

Unique Content Tabs

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:

Description H6 activates unique content feature

After adding Description H6, simply add content in your Product Description and use an H6 for the tab title.

Video Tutorial

Learn how to add unique content tabs in Story and how to combine uniquie content tabs with shared tabs:

Tab Position

Tabs can be displayed below or beside the product image:

Accordions

Display tabs as accordions when a large number of tabs are used: