How to Use the Tabs Block?

How to Use the Tabs Block

The Tabs block helps you organize product information into clean, easy-to-read panels—such as Details, Product Care, Shipping, or any custom tab you want. It keeps your product pages tidy and helps customers quickly find the information they need.

1. What is Tabs Block?

The Tabs block is a simple but powerful tool that keeps your product details organized and easy to navigate. Instead of filling your product page with long descriptions or large blocks of text, you can neatly arrange everything inside individual tabs.

This helps your product page:

Feel lighter and cleaner

Load faster

Stay easy to browse

Provide important info without overwhelming customers

Key Features & Placement

Setting	Description
Location	The Tabs block can be added inside product-related sections or product blocks. It works as a content container within your main product layout.
Styles	On Desktop, the block displays as horizontal tabs. On Mobile, it becomes collapsible accordions for easier navigation.
Content	The Tabs block acts as a container for smaller content blocks like Product Description, Reviews, Custom Pages, or Specifications.

2. How to Use the Specifications Tab & Custom Tabs

Specifications Tab

The Specifications Tab displays structured product attributes (e.g. size, material, weight) in a clean table layout. It’s ideal for technical or factual product information.

Settings

Setting	Config	What it does	How it works	Results
Show specifications		Shows or hides the Specifications tab	Disable this if your product doesn’t use specification data
Title		Text shown in the tab header	Example: Specifications, Product Details
Metafields		Defines where data comes from	Pulls data from product metafields or static content
Show empty fields		Displays empty attributes	When disabled, only filled fields appear. When enabled, you will have a configuration for Text to use for empty fields.
Content height		Controls visible content height	Long lists can be collapsed
Read more label		Text for expanding content	Example: Read more
See less label		Text for collapsing content	Example: See less

Custom Tabs (Custom Tab 1 & 2)

Custom Tabs let you add flexible, text-based content that doesn’t rely on product data. Both tabs work the same way. This tab is ideal for policies, guides, FAQs, or brand messaging.

Settings

Setting	Config	What it does	How it works	Result
Show custom tab		Shows or hides the tab	Disable unused tabs to reduce clutter
Tab title		Name of the tab	Example: Shipping & Returns, Product Care
Content		Main tab content	Rich text editor (text, lists, links, tables)
Content height		Limits visible content	Helps keep long content compact
Read more label		Expand button text	Example: Read more
See less label		Collapse button text	Example: See less

If you encounter any issues during the setup process, don’t hesitate to access Omni Themes Support or email us at otsection@omnithemes.com. Our team is always happy to help.