New Bric: Tab Anything Pro

It’s finally here. This is a “soft launch”, please don’t bother asking about video’s and that stuff. I have more to do, this is a notice and anyone comfortable enough to dive in can do so. Otherwise, thanks for your patience.

Tab Anything Pro

It’s the answer to all your visibility control issues. Tab Anything is a very powerful feature-rich Tab UI with orientation, transition, autoplay, a responsive dropdown and much more. Well, let’s turn things up a notch.

PRO ONLY Features
  • Dynamically load blocs from any page on your site (Ajax).
  • Preload/cache images from those pages.
  • Using any link or button to control Tab Anything.
  • Using any link or button to control “Previous and Next” behavior.
  • New “Material” style setting.

View Tab Anything docs
View Tab Anything Pro docs

Standard vs Pro version

Standard is super powerful, probably enough for many of you. Read carefully the features in the list above. If you do not need these capabilities or if you’re not sure about them, then maybe the best route is to upgrade later.

Screen Shot 2021-03-03 at 6.06.58 PM

Upgrading to Pro

If you already own Tab Anything, you can upgrade and save some money. To upgrade, follow this link and purchase the special “upgrade product”.

:beginner:

IMPORTANT! This special product does NOT contain your file!!
Your qualifying product (standard version) has to first be verified. Then the products in your Gumroad library will be updated. Transactions should be quick, but please be a little patience, I live in CST timezone. :wink:

Purchase an upgrade to Pro here.

Use Cases

  • Elaborate “hero sliders” with multi-columns and other brics inserted.
  • An “alternate product” viewer for ecommerce pages.
  • Unique mixed media galleries
  • Basic filtering of products, services, articles, images etc.
  • Perfect for single page sites and landing pages.
  • Easily scroll to a section and select any tab simultaneously (Pro only)
  • Make slider controls from links in a paragraph! (Pro only)
  • Preload and cache images from other pages for your tabs. (Pro only)


:beginner:

Tab Anything 1.5 standard version free update

Available now, download it from your Gumroad.com account. Here’s what’s new.

  • Hover BG Color
  • Hover Text Color
  • Hover Indent
  • Selected Indent


Tab Anything Documentation

Tab Anything docs
Tab Anything Pro docs

10 Likes

Congratulations on the launch! Sounds very interesting! :clap:

1 Like

Awesome release @Whittfield. A great product, just keeps getting better.

I am looking forward to exploring the different ways I can use this :wink:

1 Like

Thanks buddy, appreciate it!

I think it’s worth pointing this out, you might want to give it a try. I think it’s going to be popular.

  1. Setup a link in your navigation to scroll to a bloc that has Tab Anything Pro.
  2. Next make that same link select whatever tab you want to be visible!
2 Likes

For sure, basing it off Tab Anything Standard. :smiley:

Hats off to @Whittfield!
I have been privileged to run Tab Anything Pro earlier and it blowed my mind! The Pro version literally Tabs Anything!! If you’re looking for unlimited possibilities: Get it!

2 Likes

I’ve purchased the Pro version gladly. Please reply back with instruction how to upgrade. I have a new key, how do I enter it?

Done. Just refresh your Gumroad library and you’ll see the PRO version.

Thanks for the support!

Found it, thank you

1 Like

Great version! Already purchased it. Now the possibilities are limitless. I made a dropdown menu interactive with different sections of the site. Must have bric

2 Likes

Hi all,

I’m considering the pro version of this stunning bric, can any users of the pro version please show any examples if possible?
Many Thanks

A site I uploaded recently was showcased with tab anything pro. http://irenebermejo.com
you will find a mega menu working directly with tab anything, and 4 sections with tab anything.

I highly recommend you to purchase it

6 Likes

Kinda off-topic but very clean design!

1 Like

Brilliant! I’ll jump in my Mac when I’m back later from our walk.

Looks great from the image.

Thanks

1 Like

Hi @Whittfield, congratulations, really good stuff. I am interested in this Bric.

Thank you @chicuelo, lovely design. helped me to understand what Tab Anything Pro can do.

3 Likes

Nico:

I know I have said it before but I LOVE the design you created.
I will have to sit down and spend some time playing around with tab anything, try and recreate that.

Very nice…

Rich

3 Likes

Just had a look, - and great website!

Amazing work.

1 Like

I recently purchased Tab Anything Pro and plan on using it in my next website build. Forgive me if this question is a bit basic but it is unclear to me how the “focus” of the tab is controlled. By that I mean, can (and if so how) do I control the placement of focus of the tab?

What I am hoping to do is display a product with multiple configurable options. I’d like the end user to be able select from multiple tabs and see results in the focus “window”. Basically like a filtering configurator. I’d like to be able to show various options (like select from different colors of the Product, but also select additional add-on options). I know I can deal with the different add-on options by creating additional instances of Tab Anything but it isn’t clear to me how to control where the “focus” appears. The documentation also states a limit of 25 tabs per instance of Tab Anything. Assuming that indeed is the case, I will need to figure out away of overcoming that limitation. For instance, our Product is available in more than 25 colors.

Any help or guidance in dealing with these issues would be greatly appreciated.

Hi!

the “focus” tab you call it can any div you place on the stage and give it the proper ID. Each div gets assigned to a link/tab/button (whatever you want to call it).

With Tab Anything Pro, you can make any link in Blocs control a different “focus” elements as you say. just give the link the proper attribute using Blocs.

It’s all in the docs, exactly how to name the ID’s and what values to give the attributes.

Tab Anything docs
Tab Anything PRO docs

I hope you don’t have many products because the way your are going about this is kinda painful to do in a static site at scale. A new image for every color and every attribute is going to get heavy and a pain to manage as you scale it (if that’s a goal).

I recommend thinking outside the box. I would make images that have all the colors lined up nicely where people can see the range of colors at once. Less to maintain and still a great user experience. I love static sites but you’ve got to plan properly.

Use the product switcher for things like alternate image angles etc. Put things like the alternate colors in a modal or carousel.

Here’s an example of Tab Anything used several different ways in an Online Shop demo. Note there’s one feature in this example that isn’t in any version of Tab Anything yet. (dropdown menu not just for mobile anymore.)

https://blochead.dev/tab-anything-demo/#online-shop

If you do decide to put an image up for each color, you can use links with pro, so you technically don’t have a limit to the number of Tabs you can have.

Hope this helps!

1 Like