SectionAI is free + 20K tokens if you're a The4 customer, Free plan is available Install App  

Header background

Gecko - Tabs collection

Annie

Written by Annie

Last updated

594 views

On this page


This section lets you create tabs to switch between different collections. It makes your store professional and flexible.

From Theme Section Sidebar > Add section > Tabs collection

1. Tab item

Click on Tabs collection > Add tab item. Each tab item is present for a tab. You are able to config many options for each tab.

  • Tab title: Show the title of tab item

  • Enter a icon name on tab title: Show icon in front of tab title.

  • Collection: You can choose the collection to show product.

12.gif

1.1. Product item design

  • Design: you can choose the design for product items. You can check this video:

  • Show product vendors, Show product countdown

14.webp
  • OPTIONS IMAGE PRODUCTS: you can change Image ratio, Image size, Image position.

  • Product content align: set text align for text content of product.

15.gif
  • Quantity of product to show and Space between items:

18.png

1.2. BOX OPTIONS

  • CAROUSEL LAYOUT: You can choose layout Carousel, customize for prev next button, page dots.

16.webp
  • GRID OR MASONRY LAYOUT: You can choose Pagination style, progress bar, icon and button design.

17.webp

2. Tabs collection setting

2.1. HEADING OPTIONS

You can change: design, align, content, icon, subheading and space bottom in this setting for heading.

21.gif

2.2. GENERAL OPTIONS

  • Tab design: we have 7 design for tab as the video below.

  • Tabs item border: choose border for tab items. There are 4 options: none, solid, dashes, dotted.

  • Customize color for item, background, border. Only working with design has border and background.

  • Space between items, Tabs List Position, Tabs list margin bottom:

Here is an example for customizing tab items:

23.webp

2.3. DESIGN OPTIONS

Please follow this guideline to config Layout, Background, Margin/Padding for the section.

🎁 Exclusive Deals for The4 Customers

SectionAI

🤖 SectionAI – Build Sections with AI

Generate Shopify sections from text or wireframes.
The4 users get +20,000 bonus tokens when verifying their theme license.

  • ✅ No-code section builder
  • ✅ Works with your The4 theme
  • ✅ Build FAQs, banners, product grids & more
🚀 Try Free – Claim Tokens
EComposer

🎉 EComposer – Free 6-Month Plan

Build landing pages, sales funnels, and more with drag & drop.
The4 users get 6 months free (save $114).

  • ✅ 100+ templates ready to use
  • ✅ Build any Shopify page
  • ✅ No coding required
🔓 Get 6 Months Free

Enjoy a free 3-day trial. Then get your first month for $1. Try Now

We uses cookies to ensure you get the best experience on our website.