Button to specific filter tag

Hello, Anyone know how to create buttons which can open a specific filter tag from the top of my page to the filter section below? My website included 4 tags with 4 different contents inside each of them. And the filter section is in the 4th section of my page. I am willing to create a dropdown menu from the top of my page which contain 4 buttons to open those specific filter tag.

Hey @shermen !
Can you drop your read-only link so we can jump in your Designer to get a better picture of what you are trying to achieve ? :slight_smile:

https://preview.webflow.com/preview/mkt-hk?utm_medium=preview_link&utm_source=designer[…]494daf1091&pageId=6110d53fd005075c8a37334f&workflow=preview

here you go, i havent create the button yet, but I am willing to add the dropdown button at the top of the nav bar with 4 buttons for the Section 2 filters tags. Thank you so much for you help :slight_smile:

Thanks for the link :slight_smile:

If I understand correctly, you want buttons in your menu that link to specific tabs in your tab element featuring the portraits.
I’ve tried to do it in the past and I found one solution (custom code) that worked :

In addition to the solution above, you’ll want to add a code to scroll to the Tab element when a user clicks on the menu item.

Here is a demo of how it would work. If you click on Tab 1 and Tab 2 of the menu, it should take you to the desired tab on the other page, with the scroll to the right element.
And the only-read link so you can check the custom code in the page setting of tab.
(The only issue with it is that if you click on a menu item with the tab already active, it won’t scroll down. You’d have to play with the code eventually).

Hope it helps you achieve what you want !
Let us know if you need help implementing all of that :slight_smile:

Nice. I will go through all the posts later and see if I success or not. Let you all know later, Thank you for your help :slight_smile:

@jptrinh I added the link to each button. But the filter section is further down on my page, how can I make it scroll ?

If you look into the custom code I made in my example, I added these lines when a user clicks.
You just need to add an id for the section you want to scroll to (in the example : the id is tab.

$([document.documentElement, document.body]).animate({
    scrollTop: $("#tab").offset().top
    }, 0);

Then, it should work well.

Hi, @jptrinh I have tried to add the code that you mentioned in the custom code part. I only get the link to access to the specific tab but I couldn’t do it with the menu bar. Even I have added the URL to the dropdown menu on the top my page.

read-only-link

Thank you so much for your help :blush:

Hello again @shermen :slight_smile:
I am not sure I can see the problem. I feel like you set it up correctly.
When I go to the link that should take me to the tab 1 with the anchor, it works well. Same with the others tabs.

Have you tried it in the live published site ? (I see that the dropdrown menu is not in the prod version)

@jptrinh yes, I have published the site. But still it doesn’t work. Here is the webflow link that you can try and see. hkdse-regular-class

Thank you again :slight_smile:

Hello
I tried to see what causes it but I got no clue :frowning:
The only thing that I noticed is that only the third tab works when clicking in the menu but not the others…
If you can’t find whats the problem, maybe you can go from there. Try to duplicate the third tab and/or menu to see if it works

@jptrinh Let me try to duplicate the third tab and see what will happen. Let you know the result later. Thank you so much :wink: