Hyper Theme
Hyper Theme
Theme Sections

Tabs content

2 min read
image

The Tabs content section lets merchants present essential info—like specifications, brand story, shipping policies, and more—in a clean, collapsible tab format. This improves user experience and keeps your pages streamlined.

How to add a Tabs content section to your Shopify store

Steps

  1. In the theme editor (Customize), click Add section.
  2. Locate Tabs content.
  3. Make necessary changes.
  4. Save.

How to edit a Tabs content

Section settings

Color scheme

Select a color scheme that matches your aesthetic.

🎨 Learn how to set up your Color schemes:

Colors

Tab settings

  • Tab navigation style:

Headings are cleaner for simple layouts, while Buttons add more visual weight for a more interactive look.

image
image
  • Text alignment: Align your tab content to the left, center, or right.
image
image
image

Block settings

Available blocks:

Image with text

Combine a heading, paragraph, and image—great for product specs or storytelling.

image

Choose Desktop image position as Left/Right based on visual flow.

On mobile, the image and content are vertically stacked by default.

Tab

Showcase content using Rich text editor, Custom liquid, or pull a page's content.

image
image

A great space for additional highlights, icons, or CTAs that complement the main tab content.

image

✅ Notes:

  • You can only add one sidebar block per Tabs content section.

  • The Sidebar block is not scroll-sticky, so keep it simple and concise.

  • On mobile view, the Sidebar block shows at the end of the section.

  • Position: Place the Sidebar at the Right/Left of the section.
image
image
  • Content: Add a Heading and Description to the Sidebar.
image
  • Icon with text:

You can add up to 3 icon + text rows.

Each one includes:

  • Icon from the built-in library (like Heart or Truck)
  • Custom Image if you prefer using branded icons
  • Width and Color to control icon size and match your branding
  • Heading for the text that appears next to the icon
image
  • Button: Optional call-to-action with label text. Good for linking to another section or page.
image
Last updated