Webstudio
Log in

Join the Webstudio community

Updated last week

a link in menu to a specific tab on another page

MMihu
·
Hello,
I have a radix Tabs component with 2 tabs and I don't know how to set up a link in menu so it opens that page and that specific tab.
Tried with some custom js that adds hash of the tab to the address but can't make it work other way around meaning that it always open on the first Tab1 not Tab2.
Any idea how to achieve it? What is the best way to create a link to specific tab?
https://tabstest-fujuv.wstd.io/#tab1
admin link: https://p-3ff1cda8-a86f-4584-884b-7a618ee17aed.apps.webstudio.is/?authToken=b7a035cc-acf8-4fe1-b9ed-ea4a4c985df3&mode=design
M
M
O
9 comments
MMikeoxygen
do you a ref site or some ypu are trying to create
MMikeoxygen
i don't really understand what you are trying to do.
MMihu
I am trying to build a link/button in the nav menu that after user clikcs it a page with tabs opens but with the specifc tab not the default one. In another words I want to create links to specific tabs. This test site is just to figure out how to do a link to tab2
MMihu
OK solved it - https://tabstest-2-g1blu.wstd.io/
OOleg Isonen
if its a link, you can use system.query and set the active tab using query params, without custom js
MMihu
somehow I managed to create links in the nav menu that use params but still I need custom js on the page with tabs so it works.
Is this Oleg what you had in mind ?
works on published - https://tabstest-2-t0hq1.wstd.io/
custom js doesn't work on preview in builder:
https://p-cad6a6b8-c0a8-4433-9946-3a6c7983b796.apps.webstudio.is/?authToken=c62ae74a-064e-4e03-a147-5c9db0b647b7&mode=preview
OOleg Isonen
https://share.descript.com/view/ZpPm2vFaJtK
MMihu
Awesome! Thank You very much Oleg, this is so good :), please consider adding it to the documentation.
OOleg Isonen
I guess this could be a separate page something like "driving states with query parameters" and potentially even a short video
Add a reply
Sign up and join the conversation on Discord