TABs – Aside style not optimized for mobile

[mrkenobi]

Hello. I am using woodmart tabs element within Wp bakery.
It looks like this in the backend: https://prnt.sc/yE5kbOLnxBAc

and it looks like this on Desktop on frontend: https://prnt.sc/8t4ZyJyJ4WID

The problem is how it looks on mobile version:
https://prnt.sc/WeiT4-LjkMJ0

As you see, I have 10 tabs, which is why I use ‘aside’ style. But, the Aside style is not optimized for mobile view.
There is a horizontal ‘scrollbar’. This is not recommended for mobile view + it hurts SEO score.

Can you please help me adjust it?
To replicate, just create woodmart ‘aside’ style TABs element with wp bakery, then add at least 5 tabs.

I would like it to work like this; https://prnt.sc/4Y8dlw9bilfv
It is on Avada website.

• This topic was modified 7 months, 1 week ago by mrkenobi.

Hello,

Our Tabs element appears as traditional tabs on mobile, not as accordions, and changing this layout with simple custom code alone is not feasible. However, it is possible to customize certain aspects of the Tabs element on mobile, such as:
• Removing horizontal scrolling for tab headings.
• Stacking tab headings vertically, with or without line breaks.

If you need this customization, let us know, and we will prepare a custom CSS code for you.

Kind Regards

[Author]

Posts