This tool can really help take your Blocs website to the next level. Tab Anything is a special button-group that behaves like tabs or even a slider. It’s designer friendly, allowing you to style the button group as pagination dots, labels or even images. Tab Anything supports both vertical and horizontal orientation. It capable of slide and fade transitions, an optional responsive mobile dropdown button and much more. You can “tab” literally anything, including entire blocs sections themselves!
It’s a button-group that behaves like both tabs and a slider. It’s designer-friendly and supports vertical orientation, slide and fade transitions, an optional responsive mobile dropdown button and more.
Tabs are UI components that help organize content and help reduce the need to scroll the web page.
Button Groups are useful indicators that actions of each button are related.
Tab Anything is a button-group that behaves like tabs. or It has some unexpected features.
It as easy as assigning a class to the target elements you want as tabs. The naming convention for the classes is simple and it’s documented right inside the UI. See documentation here (pdf)
Pricing tables with switchable behavior (ex. monthly, quarterly, yearly)
Elaborate hero sliders with columns, other brics and more!
Alternate product views
Pagination for any elements
Unique mixed media galleries
Horizontal, vertical and new* rotated label orientations
New* Filter mode reserves the first tab to show all tab content.
Optional dropdown at smaller screen widths
Choose from Text, Bullets or Bars, Images or Images w/Text as nav style presets.
Generous additional control over styles.
Directional slide & fade transitions for the target elements
Yes you’ll understand why when you use it. It’s a Button Group. It’s meant to extend the button group to new levels. It also has to always be responsively sound. You can only fit so many items horizontally anyway.
Believe me when I say if it where unlimited it actually wouldn’t be a button group. You be tempted to use it wrongly and things would be a mess, trust me. You need this limitation in your life It saves you from many things you shouldn’t be doing with this tool.
Also, Things also get very difficult to manage for the user, once you get past three targets. Remember each of these items has to be on the page in Blocs. It’s like I mentioned before, some limitations are good for you.
Now if you need a traditional tab system like what Blocs has use that too and reach for Tab Anything for things that really make sense not to be a long list. From a UX perspective, lot’s of tabs would be more for text-heavy content and things that you don’t really need each tab to be seen or clicked.
This is a more impactful type of tool. It all but demands that you click or see the content. It’s just not the same thing!
@RobertPetras I agree this would be useful and I’m waiting to see that as well. The one time I tried to implement tabs in Blocs it seemed fiddly, so I avoided them after that. Hopefully this offers a more user friendly solution, much like Card Designer.
Something I like about @Whittfield brics is that they see frequent updates with ongoing development, while any bugs or glitches are not just ignored. I build sites for clients, so I need to have confidence that a custom bric will work as advertised and is supported by the developer before I’ll use it on a website.
I have just updated the original post above with a demo video. This is only the beginning in terms of videos for this and other brics. Also, I’ll continue to improve on this video over time, it’s very much a work in progress. Thanks for your patience, and to the early adopters who jumped right in!
A question was asked about why I used ID’s. I used them because they should be unique and Blocs will warn if you try to use them multiple times. I’m leveraging this behavior as a feature in Tab Anything