Tab Element

Tabs help display related content in a structured way, letting users switch between sections easily without scrolling.

In ZenBasket Builder, use the Tab element to organize information neatly within a single section for a clean and user-friendly layout.

Adding the Tab Element

To add the Tab element to your layout:

1. Go to the left tools panel and click Add Element.

2. Under Advanced elements, find the Switchable Panels element.

3. Click and drag the Tab element into your layout and drop it in the desired position.

   

By default, the Tab element extends across the full width of the section. You can drag and resize the Tab element as needed and reposition it anywhere within your layout.

Customizing the Tab Element

On the right tools panel, click Properties.

1. Under Effects & Animations, set the desired Effect and choose an Animation action for the Tab element.

2. To remove the Tab element, click the Delete Element button.

   

Click on the Configuration option.

Under Tab Settings, you can:

1. Set the Default Tab to decide which tab appears first when the page loads.

2. Manage Tabs Data, where you can adjust the Content Alignment, edit the Header and Content

3. Use the Add icon and Delete icon to add or remove tabs as needed.

   

Under the Tab Header section, you can adjust the appearance and alignment of your tabs.

1. Set the Header Alignment.

2. Enable or disable the Bottom Border.

3. Customize colors for the Active Tab Border, Active Tab BG, Active Tab Label, Active Tab Label Hover, Active Tab BG Hover, Tab Border, Tab Label Hover, Tab BG Hover, Bottom Border.

4. Adjust Tab Border, Border Height, and Title and Content Gap to control spacing and layout.

   

FAQ