There’s a free update available for Tab Anything. It’s new features so I suppose it’s a big deal.
New in v1.3
Full width for vertical tabs was in my original build and didn’t make it to the last update. It’s back.
Tab Anything 1.3 brings back in-app updates. After installing v1.3 any updates I release will trigger a notification in Blocs and you can apply the update using the extension manager.
I’ve given complete padding control for Tabs to the designer. This applies to both horizontal and vertical layouts. This screenshot provided by @chicuelo has been recreated using Tab Anything. Original
I have two versions and now a third! LOL Is this one also a totally separate bric? Can use all three or should I delete version 1, 2, and then install.
One final question, will using version three on my existing project work or will I have to re-do the tabs?
Thanks for all that you do, it’s greatly appreciated.
You can delete all previous versions. and now with in-app updates it’s going to be much simpler going forward.
The existing projects should be okay, but here are a couple edge cases.
Someone is already using custom classes. might be affected.
“Increase Width” setting has been removed in favor of this new approach. It should only need adjustment though if you start making edits to the bric. Even so it would be a minor adjustment make them wider again with left and right padding option. There’s also a reset button!
No problem, it overwrote the last version and all my tabs seem to be ok. I was worried as I have a fairly large menu using tabs. The padding controls are a great addition along with vertical feature.
This is such a cool bric, do you know how long it would take to build something like this on a page using the default tabs in Blocs, a long time.
I really appreciate your attention to detail, in my opinion that’s what makes a great add-on.
Folks I don’t get it.
I spent a hard time trying to achieve something like that with no luck at all.
Can you use the tab-IDs only for blocs or is it possible to give them to paragraphs, images etc.?
Hi Bootsie, it’s fairly easy once you get the hang of it. I start by adding a new bloc, you do not need to add a new Bloc for each tab. I add the tabs anywhere bric last.
I suggest just starting a simple test Bloc to get the feel of using Tabs. Just add an 8 column bloc and in the column add a DIV, give the first DIV an ID name tab1-1. Add another Div below tab-1 and name this one tab1-2. Now add a third DIV ID tab1-3. You now have three tabs setup. Now add a fourth DIV under tab 3 DIV. In the fourth DIV add the tabs-anything brick. It does not require and ID
You now have your structure setup. Add your content inside the first three DIVs. Maybe just add a header and paragraph bric to all three DIVs to see how it works.
Once you have that all setup, click in the tab anything area (div 4), and tab anything will show in the right sidebar. This is where you can name each tab and set the style of the tabs.
@Whittfield I do have a question about Tab Anything. When I place a default Blocs tabs on a page the tabs are contained by the size of the column. If the content is bigger than the column it will wrap and some of the labels will dropdown.
With Tab Anything if the labels are longer than the column they will go outside of the container? Is there a reason for this?
Here’s a link to a calendar I’ve built using default Blocs to show you what I’m talking about. https://bcrhm.org/events.html
I’m not asking for you to change anything I was just trying to recreate this using Tabs Anything.
There’s a few of features that require this inline approach, and wrapping didn’t seem so practical until now
I’ll assess it, but can’t promise anything. If it does pan out, there will likely be a several exceptions and those will need to be handled in an elegant way.
I came up with some css that seems to work well enough, but it’s certainly not tested well enough to put directly into the bric yet but looks promising (the many exceptions I mentioned).
This bric is used for for testing ideas that might make their way into the Tab Anything. These experiments can be based in either css, javascript or html. A short desc. of what’s included is listed in the sidebar.
.
This is NOT for production sites, especially unless you know what you’re doing. It’s also not a promise to include a feature in upcoming releases.
I’ve added to Tab Lab the ability to force a consistent width of tabs. While I prefer to use the full-width feature to accomplish this, when you use the “wrap” feature this is super useful to get perfect grids.
Add a special class to a Tab Anything instance. The class should be formatted as “w-100” (you can increment/decrement the number by 10).
