Trigger Dropdown menu from button in header


I have two buttons in my header using the header builder. I’d like to trigger a dropdown menu from those buttons. How do I do this?

mdp: E-MM

Here is the code I used to have the two buttons:

[button href="/communaute/" style="padding-top:2px; padding-bottom:2px; margin-bottom:5px;"]COMMUNAUTÉ[/button]<br>
[button href="/createurs/"  style="padding-top:2px; padding-bottom:2px; padding-left:30px; padding-right:31px;"]CRÉATEURS[/button]

Thanks for your help!

Hi There,

You can use a Inline menu element and assign a menu with just 1 parent link and style the menu top link to look like a button.

Hope it helps

Thank you for the information. One question though: How do I “style the menu top link to look like a button”?

Moreover, how can I manage to have to button vertically aligned?


Hi there,

You can add x-btn class to your button’s class attribute. But I’m not sure why you’re doing that, you’re in pro header builder and adding a button element should do.


Thanks. Please see my first post in this topic to understand what I want to achieve. The buttons should trigger a dropdownmenu and should be vertically aligned, which is why is is slightly more complicated and I can’t simply use a button element.

I did not manage to make it work so far and your help would be greatly appreciated.


Hi There,

Please provide your URL and let us know which links you want to style as a button.



I’d like to make the two buttons on the right side of the header with a dropdown menu.

(Pwd: E-MM)

Thanks for your help!

Hi there,

Please kindly add a navigation collapse element to the header. Then go to the Toggle tab of the options of that element:

Set the width and height of the toggle elements to look like a button:

Set the Border radius option to 0:

If you are interested add a solid border to the button.

Enable the text of the button and add whatever you want as the button text:

Disable the graphics setup:

Now you will have a navigation collapse element that the toggle of that element will look like a button:

Thank you.

Thank you very much. One question though: how can I have two such buttons that are vertically aligned?
(As you can see here: on the right side of the header (Pwd: E-MM))

Hi there,

Go to the Container which contains the buttons and in the Flex option set it to be column based, and space between:

I suggest that you take a look at our flex tutorials which will help you grasp an idea of how the layout works:

Thank you.

Thank you for the awesome support!

Glad we could help.


This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.