Introducing the Tabs Widget
Following our recent release of the Accordion widget, we’re really pleased to announce our new Tabs widget. Tabs offer a great way to organise and structure content in a small amount of space. Perfect for listing your services, products, page sections or any other content that has a horizontal structure to it.
The Tabs widget is included in the Widgets Bundle plugin release version 1.11.0. SiteOrigin Widgets can be inserted into any page using SiteOrigin Page Builder or any of the other Page Builders that we support. You can also insert widgets into theme widget areas.
As always, this is a completely free addon. All you need to do is update your copy of Widgets Bundle, then navigate to PluginsSiteOrigin Widgets in your WordPress admin, search for and activate the Tabs widget.
If you need a hand getting started, please, see the Tabs widget documentation.
Extra Options for SiteOrigin Premium Users
SiteOrigin Premium adds awesome functionality and additional features across our range of plugins and themes. The Tabs addon in SiteOrigin Premium adds a host of extra settings and features. The two you might find most useful are:
Preset Designs
To make the most of the extra settings and save you time, the Presets setting lets you choose from four unique designs. All the designs use neutral colours making it easy to adapt to your website colour scheme.
View a demo of the preset tab designs.
Layout Builder
The free Tab widget lets you add standard TinyMCE text content, but in the premium addon, we’re giving you the power to create tab content using a layout field. This means you can fill your tabs with complex widgets and Page Builder style layouts (rows and columns).
If you aren’t a SiteOrigin Premium member yet, be sure to sign up. It’s a cost-effective way to build your sites faster and more professionally. We’re introducing more addons all the time, so the longer you’re a member, the more valuable it becomes.
Very nice
but why do you call “Rounded 01 Preset Design” with a small rounding for the same
as the other one with larger rounding “Rounded 01 Preset Design”
Thanks Lars. That’s a mistake. I’ve fixed it now. Appreciate you letting us know :) The demo is here for the presets in Premium: http://demo.siteorigin.com/premium/tabs-widget/.
Do you know there is free plugin “Tabs Widget for Page Builder” by ProteusThemes with power to create tab content using a layout field?
https://wordpress.org/plugins/tabs-widget-for-page-builder/
Therefore, the Premium is not so tempting.
That’s a great option for users that would like to stick with free, thanks for sharing. In addition to creating new features to attract users to SiteOrigin Premium we’re also looking to continually add value for our existing subscribers :)
Great work, very nice!!
Thanks siteorigin !
Thanks :) Glad to hear you like the new widget.
When I tried this widget all the tabs stayed open. Usually on a tabbed page the existing open tab will close when you open a new tab. So only one tab is open for reading at a time. Is this something you can fix for us. I am a premium subscriber. Did I miss a setting or do something wrong.
Hi Brian
Thanks for reaching out. That sounds like an error. Please, reach out to us on email, [email protected]. Alex will assist as soon as possible. Please, include a link to the page so we can view the problem. If you don’t have a page with the tabs widget showing, please, create a demo page so we can see the issue in action.
Thanks again :)
This is one feature I have been missing in SiteOrigin page builder. Great work.
Thanks Collins, glad it helped.
I would like to link to Youtube on my WordPress and Siteorigin.
21,660 views
This widget seems so helpful, Its a great joy to work with it. I tried to set everything up as it was written.
Glad to hear you’ve been building with the tabs widget :)
Is it possible to have the tabs displayed vertically? Is there any way to achieve that?
Hi Seyi, thanks for your interest. Unfortunately, it isn’t possible to display vertical tabs with the Tabs widget at the moment. Sorry we can’t help with this request.
I am very happy that you finally inculde this feature, bcs I had a lot of struggles always with tabs and with siteorigin. And I was trying a lot of different solutions but nothing was exactly good, but this one loks nice. I am already going to try it now.
Hi Peter. Super, glad the widget is something you can make use of :) Hope it helps.
Hello,
I would like to know how to do if i don’t want this blue shadow on the box ? The same as this one when i’m writing now…
Thank you for your answer
Hi Bruno. The blue outline is an accessibility feature added by all browsers. For possible solutions, you can try taking a look at topics on Stack Overflow: https://stackoverflow.com/questions/20340138/remove-blue-border-from-css-custom-styled-button-in-chrome.
Hi Andrew,
Thank you
For sure :) All the best.
I am new at this, but can’t seem to find how to add shortcodes to the tabs? I have a team site I want to build and the shortcodes only print the shortcode text.
using the forum I found the solution. should have looked there first. the answer is by Srikanth Kamath here
Thread: WordPress Shortcode [ ] where to put in Page builder
Hi Timothy
Thanks for reaching out.
It isn’t possible to make use of shortcodes in the Text field. The Tabs addon in SiteOrigin Premium offers a Layout Builder option which is an instance of Page Builder. Within the Layout Builder, it’s possible to insert a SiteOrigin Editor widget which accepts shortcodes.
Tabs widget documentation: Page: Tabs
Tabs premium addon documentation: Page: Tabs
SiteOrigin Premium info: Download: SiteOrigin Premium
If I want my tabs to display a photo or something like that how do I make it fill the entire tab and not have a border around it?
Hi Rex
The SiteOrigin Premium Tabs Addon offers padding settings for the panel Page: Tabs. You could set left and right padding to zero. You might then need to use the Layout Builder in each tab panel to add padding back for the rest of your content.
Hi,
Is there anyway to center-align the tabs?
Hi Max, thanks for your comment. The Tabs alignment setting is available as part of SiteOrigin Premium. The available options are left, center, or right
This was great. Used the widget and loved it. Thanks!
Hi Tony, thanks for posting. We’re glad to hear the Tabs Widget was helpful.
How would you compare you plugin overall to Elementor? Just wondering. Thanks
Hi Tony. Thanks for posting your question. Usually don’t offer plugin comparisons. If there are any SiteOrigin specific queries or requests you have, please, let us know. We’d be happy to lend a hand.