# Unique product tabs

With unique product tabs, you can display custom content for each product in your store.&#x20;

The basic steps are:

* Create a product metafield for the tab text.
* Add unique content to individual products in the metafield area.
* in the Product description connect the tab text to the metafield as the dynamic source.

### How to setup

Begin by creating a basic product metafield in your Shopify Settings:

Start in your Shopify Admin -> Settings and choose Metafields from the left panel and then click on **Products** (click images to zoom):

![Create new Product metafield](https://798529998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Frse2xho0gVJCQ27Qc08u%2Fuploads%2Fc2ON7jxNhNfxI3p4QOdF%2FScreen%20Shot%202021-11-19%20at%207.04.54%20PM%20\(1\).png?alt=media\&token=ded139b8-e606-4af6-9467-7df5631a4956) ![Choose Add definition](https://798529998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Frse2xho0gVJCQ27Qc08u%2Fuploads%2FJw9dCj6QvkVADh2kjQpi%2FScreen%20Shot%202021-11-19%20at%207.26.03%20PM%20\(1\).png?alt=media\&token=4279b446-4060-4c41-ae38-1ed389fc302f)

* Provide a **Name** for your metafield. In our example, we'll use ***Water rating***, this will be our tab content. Each watch will have a unique water rating. You can define metafield that relates to your products.&#x20;
* The default Namespace and key can be used. No modifications are needed.&#x20;
* Choose **Text**, **Multi-line text** for the Content type.
* No validation is required.

![Multi-line text is recommended for tab content](https://798529998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Frse2xho0gVJCQ27Qc08u%2Fuploads%2FJEpvPPRN3NJqcMfpHAYB%2FScreen%20Shot%202021-12-30%20at%203.15.06%20PM.png?alt=media\&token=006be646-ba2b-4450-9e38-fbb3788484b9)

**Save** the metafield definition.

### Product setup

{% hint style="success" %}
Now that we've created a product text metafield, we can **easily** add custom tab content to any of our products that require unique information.
{% endhint %}

The next step is performed in the Shopify Admin -> Products. Choose a product and scroll to the bottom where you'll find all the metafields. There will be a new Water rating option where we can add unique details to:

![Metafields are located at the bottom on the product setup pages](https://798529998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Frse2xho0gVJCQ27Qc08u%2Fuploads%2FHDslFFNB8eN8qtjr6dL8%2FKapture%202021-12-30%20at%2015.36.41.gif?alt=media\&token=f97319f9-0add-4491-9f98-9e0eefbd5ac1)

{% hint style="info" %}
Add unique content to products that require that information. For products that don't have any information entered, the tab won't appear when viewing online.
{% endhint %}

### Theme editor setup

The final step is to configure the Product page settings in Story, using the Theme editor. Click on Product description under Product page:

![](https://798529998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Frse2xho0gVJCQ27Qc08u%2Fuploads%2FPuB4uPduM9y0iKYQBQcJ%2FScreen%20Shot%202021-12-30%20at%203.49.56%20PM.png?alt=media\&token=770b68e7-8ac4-4437-b921-57411f6f8db1)

Next, under the **Tab heading**, add a title for the tab. We will use "*Waterproof rating*".&#x20;

In the **Tab text** area, click on the **Insert dynamic source** icon:

![](https://798529998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Frse2xho0gVJCQ27Qc08u%2Fuploads%2F2U0VE3lGNcqamC46Bn2u%2FScreen%20Shot%202021-12-30%20at%203.52.10%20PM.png?alt=media\&token=a7a5f943-0569-4b0f-8d30-746940229c93)

Choose the metafield created, we'll use Water rating:

![](https://798529998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Frse2xho0gVJCQ27Qc08u%2Fuploads%2F4p546UZi2rO28mwfoidZ%2FKapture%202021-12-30%20at%2015.54.04.gif?alt=media\&token=9dda8dcf-e40c-4b13-b6e9-09388ab0f3c4)

Use the **Insert** button at the bottom to connect and **Save** your changes.

### Final result

{% hint style="success" %}
The tab or accordion will only appear on products that have metafield content. Other products won't show a tab. Also, each product that has content populated will be unique.
{% endhint %}

![](https://798529998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Frse2xho0gVJCQ27Qc08u%2Fuploads%2FgnVlARIbITiR4MGdQusq%2FScreen%20Shot%202021-12-30%20at%204.08.05%20PM.png?alt=media\&token=c29c3494-337b-4fee-86f2-7c00336dcd4c)

Experiment with multiple tabs by creating metafields for each one. If you need more than five tabs/accordions, you can create metafields for the Tab title as well. That will allow you to assign a tab title in the product setup.&#x20;
