Phlox Tabs
Phlox Tabs Widget allows you to show your content in multiple horizontal tabs to improve the UI and save some space in your website's pages, posts, and widget areas. Importing information inside tabs is simple and it is does not require coding. The content you add into the responsive tabs widget can be texts or multimedia. Also, you are able to add widgets into the tabs, it is specially useful when you want to add some widgets on the sidebar of your website.
Follow below steps to add Phlox Tabs Widget to a widget area or in a page content:
- Go to your WordPress admin panel
- Click on the Appearance on the Dashboard
- Then click on the Widgets
- Find [Phlox] Tabs among the available widgets and add it to your desired Widget Area
Access Tabs Options in Elementor Page Builder
- Go to your WordPress Admin Panel
- Click the Pages on the Dashboard
- Click the Add New
- Navigate to the top left hand of the WordPress text-box and find Edit with Elementor button.
- Check out Elements
- Scroll down to PHLOX - General section
- Choose Tabs
-
Content
Tabs Items
This section lets you add, duplicate, or remove an tab item. After that, you can select the tab item you want and change its Title & Content.Skin
You can add Border to your tabs or you can create them with No Border
-
Style
Title Bar
You can change many options on this section. When you hover over title bar, your Mouse Curser can be Default, Pointer, Zoom, and Help.
Paddings, Margins, and Border Radius can be changed. Also, you can set different paddings and margins on mobile and tablet.
Box Shadow and Border Type of title bar has different settings. This section lets you change these on Normal, Hover, or Selected mode. Width and Color are editable and Background Type can be Classic or Gradient.
Title
You can change the Color and Typography of the title on Normal or Hover.
Content
Many options are available here that let you change Typography, Color, Paddings, Margins, Border Radius, Size and Position of tab content. Besides, you can set a Background for your content.
Check out this article to know more about Advanced tab and start working with Elementor.