Content processing

Tabs can not be created from headings if the headings are nested inside of other HTML elements. If a tab were to be created from a nested heading, the HTML structure of the page would be invalid and the page layout could break.

Nested headings can be unknowingly created by Shopify's rich text editor, but they can also be included with content that's pasted into the editor.

Content processing removes invalid and unnecessary HTML tags that can prevent tabs from being created from headings.

Content processing does not change the source content

Content processing reads the source content and makes adjustments when the page loads. The source content is not changed or affected in any way.

The heading is nested inside of another element

In the image above, the <h3> (Heading 3) element is nested inside of the <div> element. Without content processing, a tab will not be created from the heading.

The heading is not nested inside of another element

In the image above, the <h3> (Heading 3) element is not nested inside of any other elements. No content processing is needed to create a tab from the heading.

Remove HTML tags that will prevent tabs from showing

You can select a content processing option from the Settings > General page in the app.

The content processing settings panel from the
'Settings > General' page in the app — The content processing settings panel from the 'Settings > General' page in the app

The Remove HTML tags that will prevent tabs from showing options control how the app processes source content.

The options are:

Don't remove tags — Use the exact source content. Tabs will not be created from headings that are nested inside of other HTML elements.
Remove common tags — Remove <div>, <span>, <section>, and <article> tags that wrap headings used for tabs.

If tab content doesn't look as expected, select the Don't remove tags option and then use Shopify's rich text editor to edit the product description HTML and manually move the headings outside of their wrapping elements.
Remove all tags — Remove all HTML tags that wrap headings used for tabs.

If tab content doesn't look as expected, select the Don't remove tags option and then use Shopify's rich text editor to edit the product description HTML and manually move the headings outside of their wrapping elements.