New Feature: Tabs with no Code

Show and tell
, , ,
1

Our team just released a highly requested feature for Editor X, Tabs .

With this feature, you can do the following:

  • Showcase different content and information to make it easier to access your news and content.

  • Personalize and customize the design to match the design of your site

  • Add interactivity to your site to keep users engaged\

Below I’ll show how you add the component, add more tabs and customize the design on all breakpoints and to fit your needs.

13 Likes
2

Can you add repeaters or layouters in tabs?

3

Yes you can. You can even both in the same tab.

1917×972 73.8 KB

4

Thank you so much, Team!! :smiley:

5

Amazing! Thank you! Just what I needed.

6

Thanks for this feature, Please add dynamic product page feature. we need that the most

7

Thanks for feedback!

8

Much Appreciated!! Great addition.

9

Could you give the ability to add this element within a Program?

10

At first experiment it doesn’t seem like you can place a gallery in each tab and connect one data set to each gallery and use filters to change the images displayed in the galleries. The changes are universal on all tabs. So i guess you need to create different datasets for each category? What can’t you duplicate CMS collections???

Also, does anyone know the SEO impact of having content in tabs on one page rather than having that content on separate pages with their own SEO setup?

We currently have these categories as buttons that link to their own page:

If we change that to tabs like this, i wonder how much we lose on the SEO side?

1 Like
11

Thank you very much for this great feature. Would there be any way for you to add an extra feature to the tab such as adding an icon to improve the UI ?

12

Hey @ryanbrenner512 Are you referring to an API? If so then it’s available as well here - https://www.wix.com/velo/reference/$w/tabs

13

Hey @flood-jesse , Galleries should work inside Tabs same as usual container. The elements inside each tab are no connected (appose to a repeater component for example).
As for SEO, currenrly only the first tab is crawlable by google bots .

14

Thanks for the feedback @philippe ! We will make sure to consider this feature for the future versions of the component

15

When using Velo to hide a tab, it just hides the contents in the container, but does not hide the tab itself. It would be great to have an option to hide a tab in the tabs container(so that there would be no option for the tab to be selected or seen) and the contents container, so, for example - depending on the contents you would want to display in a dynamic page, you’d show only the tabs related to the current content in the dynamic page.

16

I have had this on my site for about 6 months now:: with A short code for open and close. and i can do as many as i want on a page with no restrictions on both. But i called it Drawers! not Tabs lol.
first ADD a Multistate box call it what you want “replace with object ID of trigger”
then set each state naming the states as you wish “replace with the State ID desired”
then make your buttons. label them as needed “replace with object ID of trigger”
then add this code and update the names as i have mentioned. you can trigger mutiple boxes too so you can then have seperate say menus for each type of box content displayed.
////////////////--------COLLAPSIBLE Box CODE - START -------////////////

// Machine Videos
$w ( ‘#replace with object ID of trigger’ ). onClick (() => {
$w ( ‘#replace with ID of the Multistate Box’ ). changeState ( “replace with the State ID desired” );
})
// Machine Videos Close
$w ( ‘#creplace with the object ID for trigger close Box’ ). onClick (() => {
$w ( ‘#replace with the Same ID of the Multistate Box’ ). changeState ( “replace with the cloded state ID og the Multistatebox” );
})

works on EDITOR and EDITOR-X. on huge note! put all content inside each drawer on its own dataset. and set to load after page loads. then it doesnt effect the page speed: ENJOY my friends. hope it helps.
ps
been trying to get into my editor x account. but cant seem too

17

thank you for sharing!

can not locate Wix account associated with email on Forum profile
can you share some site link from the account you have access issues?

18

you can use my code above to do this. i do it in two differnt ways. 1 “use two differnt boxes, one for buttons and one for content. and call a line of trigger for each”. 2 "use one box. and put the buttons in the box. and put a coppy of the buttons on each box. in same place. then you can do whatever you want in each button set.

19

and example of all this is this : https://popperportal.wixsite.com/popperpinballclub/vpx-tables-1/adventures-of-rocky-and-bullwinkle-and-friends-(data-east-1993)

here if you hit Blog or score or flyer and such, you open boxes “drawers”
hope any of that helps anyones or Wix’s further development. Love is key. I thank wix for this wonderful platform

20

i also have a way of runing cache on a page per page basis that has really sped up my site after first landing. if youd like i can share a few out of the box things ive figured out. and if i had to ask for a feature. I’d say. in editor and editor X. ADD the ability to switch all instant “popup” menus, to having to press option key to trigger them. instead of mouse over. as i know how much the mouseover features tax my pages. id say that will solve the sluggishness of your editors:). hope all this helpes. and than you for the wonderful programs.