Skip to main content

Product tabs or accordions are not showing

If you have set up Protabs but tabs or accordions are not showing on your product page, check the app embed first. If it is already enabled, add the wrapper below to help Protabs identify your product description.

1. Check the app embed​

  1. Open Protabs → Product Tabs.
  2. Click Verify status.
  3. If you see App embed is required, click Activate app embed.
  4. Enable Protabs in the theme editor and click Save.

Make sure the app embed is enabled on the theme you are testing.

Refresh the product page. If tabs or accordions still do not appear, continue below.

2. Add the product description wrapper​

Wrap your existing product description in a <div> with the class product-tab-description.

  1. In your Shopify admin, go to Products and open the affected product.
  2. In Description, click Show HTML (<>).
  3. Add this opening tag before all existing description content:
<div class="product-tab-description"></div>
  1. Add this closing tag after all existing description content:
 </div>
  1. Keep your existing content between the two tags and click Save.

For example, if your description currently looks like this:

<p>A comfortable everyday T-shirt.</p>

<h5>Product details</h5>
<p>Regular fit with short sleeves.</p>

<h5>Materials</h5>
<p>100% cotton.</p>

Update it to:

<div class="product-tab-description">
  <p>A comfortable everyday T-shirt.</p>

  <h5>Product details</h5>
  <p>Regular fit with short sleeves.</p>

  <h5>Materials</h5>
  <p>100% cotton.</p>
</div>
important

Keep your own product description. The text above is only an example. You only need to add the opening and closing tags around your existing HTML.

note

Add the tags in HTML view so Shopify treats them as code. If the wrapper is already present, do not add it again.

This change applies to the product you edited. Repeat it for other affected products as needed.

3. Check the storefront​

Refresh the affected product page and check whether tabs or accordions now appear.

If only the default tab appears, make sure the headings in your description match the Heading selector in Protabs.

For example, if you selected Heading 5, your section titles must use Heading 5 (<h5>). Without matching headings, the full description appears under the default tab.

For complete setup instructions, see Set up product tabs and accordions.

Still not showing?​

Make sure your product description contains content and is displayed by your theme. If your theme does not render the description, the wrapper alone will not make it appear.

Contact [email protected] with:

  • Your store URL and the affected product page.
  • Your theme name.
  • Screenshots of your Protabs settings and the product description in HTML view.

Our support team can review the setup and help you with the next steps.