1. Home
  2. Docs
  3. Xpro Addons For Beaver Builder
  4. Modules
  5. Tabs

Tabs

Introduction

How to add vertical layout supported for the responsive devices in Tabs Module?

Yes, our Tabs Module for Beaver Builder is supported for all devices including mobile devices as well. You just need to do a few settings to display tabs on mobile devices:
Step 1: Open the Tabs module setting in the Xpro Content Module section.
Step 2: Drag and drop the Tabs module from the Xpro Content area.
Step 3: Go to the General Tab, set the position to Vertical and Mobile Responsive option to Mobile Only for mobile devices in the General section.

Step 4: Select the other styles for Tabs in the General section of your own choice like Layout for Vertical Style, Animation Style and Tab Responsive Layout to Accordion or Dropdown.

Step 5: Click the Save button once you are done with all the changes and refresh your page. Your Tabs on mobile devices will look like this.

How I can change Tabs’ vertical layout to a dropdown in responsive devices?

Tabs vertical layout can be changed into a dropdown in responsive devices with a few steps to follow:

Step 1: Open the Tabs module setting in the Xpro Content Module section.
Step 2: Drag and drop the Tabs module from the Xpro Content area.
Step 3: Go to the General Tab, set the position to Vertical and select the Vertical Layout Style and Animation style in General Section.

Step 4: Finally, go to the Tab Responsive Layout and select the Dropdown option. Now, Click the Save changes button.

How I can change Tabs vertical layout to Accordion in responsive devices?

Tabs vertical layout can be changed into Accordion in responsive devices with a few steps to follow:
Step 1: Open the Tabs module setting in the Xpro Content Module section.
Step 2: Drag and drop the Tabs module from the Xpro Content area.
Step 3: Go to the General Tab, set the position to Vertical and select the Vertical Layout Style and Animation style in General Section.

Step 4: Finally, go to the Tab Responsive Layout and select the Accordion option. Now, Click the Save changes button.

Was this article helpful to you? Yes No

How can we help?