How to use Tab Widget in BOWWE?
BOWWE tutorials
Welcome to our collection of online lessons. We’ve created these to help you learn the best practices and get the most out of BOWWE. Come back here whenever you want!

How to use Tab Widget in BOWWE?

Tab widgets are a great way to organize and display content on a webpage, providing users with an efficient and user-friendly way to navigate between different sections of a website. In this tutorial, we'll explore the benefits of using tab widgets, and walk you through the process of adding a tab widget to your website.

How tabs can look like on your website?

Benefits of using Tabs on your website

Efficient use of space

A tab widget allows for the efficient use of space on a website, making it possible to display a large amount of content in a compact and organized format.

Simple navigation

Tabs make it easy for users to find and access the information they are looking for, by providing a clear and intuitive way to navigate between different sections of a webpage.

Improved user experience

Tab widgets can improve the user experience by reducing clutter and organizing content in a logical and user-friendly way, making it easier for users to understand and interact with the website.

Increased engagement

Tab widgets can help to increase engagement by encouraging users to explore different sections of a website and interact with more content.

How to add and customize Tab Widget in BOWWE?

1

Open BOWWE Builder.

2

Go to the Creator in left side panel and select Tab from Main Widgets

3

Drag and drop it on your website

Learn more

If you are struggling with positioning your widget on a website read our previous tutorial.

Position property - positioning elements on the page

4
Select Widget Settings to add and edit new tabs.
5

Edit widget’s design in Widget Styles. Select a Single tab and adjust its appearance when it's closed or open.

 

Basic tab: Adjustments made here will apply to the tab when it is not open.

Active tab: Design created in Active tab will appear when you click on the tab.

6

Customize content of each tab by adding new widgets like text, images or video.

7

Save to complete.

What is an Active Tab?

When you enter Widget Settings, you’ll notice a checkbox titled “Active Tab”. This option adds an index at the end of the URL allowing you to share a link with a particular, opened active tab that will be changed accordingly to the index specified in URL.

 

Here’s an example of the active tab id added to the link:

 

domainname.bowwe-site.com/#tab-id1234567

 

Each tab receives a specified ID and will be implemented as soon as you check the box, it’s that easy.

Congratulations!

Now you know how to create Tabs on your website