Tabs Widget

The Tabs Widget allows you to divide your content into tabs, either horizontally or vertically

If you’re using containers, you’ll be working with the new Tabs widget, allowing you to work with nested elements.


Content

  1. Tabs Items: Enter a title and content for each tab
  2. Add Item: Click on the Add Item button to add another tab
  3. Type: Choose Horizontal or Vertical tabs
  4. Position: Choose from Start, Center, End, or Justified

Tip: Items can be moved up or down in the list by simply using the drag and drop method.


Style

Tabs

  1. Border Width: Set the thickness of the border around the tabs
  2. Border Color: Choose a color for the border
  3. Background Color: Choose a background color for the tabs

Title

  1. Title Color: Choose the color for the title of the tabs
  2. Active Color: Choose the color for the title of the tab that is currently selected
  3. Typography: Set the typography options for the title

Content

  1. Color: Choose the color of the content
  2. Typography: Set the typography options for the content

Advanced

Set the Advanced options that are applicable to this widget


How to add a widget inside a Tabs widget

You can insert another element into a tab this way:

  1. Create the element that you want to insert inside a tab and save it as a Global Widget.
  2. Go to your Template Library and copy the shortcode of the relevant global widget.
  3. Within the Tabs widget, click on the Add Item button to create a new tab.
  4. In the text area of the tab, paste the shortcode you previously copied.

Note: Using Elementor template shortcodes within the widget may sometimes work, but it is not a supported feature.

Share it on social networks

Was this article helpful?

Get Started With Elementor Today

Join millions of professionals who use Elementor to build WordPress websites faster and better than ever before

On this page