How do I add custom product page tabs?

You can create tabs in two different ways:

  • Using a Page, shown on *all* product pages
    or
  • Using a Page, shown only on products tagged with a utility tag (requires version 2.1+)

How do I show tabs on all product pages?

(All versions) This is the easiest option to set up and is useful for general product information like shipping and return policies, universal size charts, and anything else that applies to your entire product line.

To set these tabs up, first create a page with your tab content. Then navigate to General Settings > Product Grid > Additional Product Content and choose your page from the dropdown seen there.

How do I show tabs on specific product pages?

(Motion version 2.1+) This is most useful when only certain collections of products require the same tab content. For example, if you have a Shirt size chart that should only be visible on the Shirts collection.

1.  Create your page

Head to the Pages section of the admin and create a Page that contains what will be seen in your tab. The title of your Page will be used as the tab title.

2. Get your page handle

Get the page's handle by clicking "Edit website SEO" near the bottom of the page.

Select the text in the last field after /pages/.

3. Add the utility tag to your product

Navigate to the product you want to add the above page to as a custom tab. Add your utility tag in the format _tab_page-handle.

In this example it would be _tab_shirt-size-chart.

You're all set! That page will now show up as a tab on your product page. By default, any _tab_ tag will be ordered alphabetically. You can customize the order by setting _tab1_shirt-size-chart_tab2_shirt-shipping-information, etc.

 

Note: To add tags quickly for multiple products, select your products and click Edit products. Click Add field and choose Tags. You can now add tags to multiple products from the same page.