fbpx

Need Help?

Here are some good places you cant start.

Whats New?

Get updated about all the good stuff!

wordpress-black-friday-deals
toggle-button-for-elementor
elementor-widget-library

Content Tabs for Elementor

You can display your website content in an interactive content tabs widget. Content tabs can even be used to show different content in each tab. You can change the layout of widget either horizontal or vertical. You can choose template as content to showcase in tabs. This widget also supports remote connection and sync widget.

 

Let’s look at each of the options in the “Content Tabs Widget” below.

Install Content Tabs Widget for Elementor #

This widget requires Unlimited Elements Free version installed and activated on your WordPress website.

  1. Go to Unlimited Elements Widget Library
  2. Search in the search bar for “Content Tabs”
  3. Hover over the widget in the search results and click install
  4. Add your “Content Tabs” widget to any Elementor Page

General Settings #

1

Layout

Select the layout you want to display.

  • Horizontal
  • Vertical
2

Alignment

Select alignment of the content tab from the given options.

  • Left
  • Center
  • Right
3

Start Collapsed

Content tabs will show as collapsed in starting.

4

Accordion Breakpoint

By choosing yes, it will turn tabs into accordion under a certain screen resolution.

5

Breakpoint

Set the screen resolution breakpoint when tabs become accordion.

6

Accordion Expand Icon

Choose an icon for expanded accordion.

7

Accordion Collapse icon

Choose an icon for collapsed accordion.

8

Set URL Hash

Allow to come back to the active tab by url.

Connected Widgets Settings #

1

Enable Remote Connection

This enables the remote connection functionality for this widget.
2

Visit Name for Connection

Provide a name for the connection that other widgets will use to connect and control this widget.

3

Sync

You can connect two item-based widgets and sync them.
4

Sync Group

Choose the same group for two or more item-based widgets so they can sync together.

Items Settings #

Manage the tabs of the content tabs using the repeater field.

  • Add new items
  • Duplicate items
  • Delete items
  • Reorder Items
  • Edit Items
1

Tab Title

Set a Title for your tab.

2

Content Type

Choose any of the given content sources

  • Content

         Type any custom content for your slide.

  • Template

         Choose any of the premade templates to show in your slide.

  • Element Id

          Type the element id to display.

3

Tab ID

Type the tab id that works with 'Set Url Hash'.

Content Tabs Widget Styling #

Every aspect of the widget’s design can be controlled through different styling options. Choose colors that complement the style of your website. You can modify the text, icons, fonts, and layout to make the widget look and work the way you want.

Tabs Container Styling #

Set the tabs container radius, padding, and border.

Tabs Bar Styling #

Set the tab bar background, padding, radius, alignment, and border.

Tabs Item Styling #

Style the tab item typography, radius, padding, margin, background, color and border.

Tab Item Hover Styling #

You can style the tab hover background, color, and border.

Tab Item Active Styling #

In this section, you can set the background color, border, padding and box shadow.

Content Styling #

Style the content background, padding, spacing, radius, color, typography and border.

Accordion Title (Responsive) Styling #

You can style the accordion title background, and text color in normal and active form.

Usage Examples #

Here are some live use cases for the Content Tabs widget.

Example of Content Tabs widget synced with Content Carousel and controlled by Remote Bullets.

Video Overview #

Download is just a click away

Get instant access to tons of Elementor goodies, completely FREE!

Hurray!

You got FREE access to the worlds leading widgets for Elementor page builder!