Menu

The Menu component adds drop down navigation.

{% embed '@forumify/components/menu.html.twig' with {
    placement: '...',
    hideAdornment: true/false,
    buttonClass: '...'
} &}
    {% block button_text %}...{% endblock %}
    {% block menu_items %}
        ...
    {% endblock %}
{% endembed %}

This component utilises the twig embed tag which allows you to include another template's contents. Learn more about twig embed here

The intended structure for the menu component can be seen in the below example:

{% embed '@Forumify/components/menu.html.twig' with {
    placement: 'bottom-end',
    hideAdornment: false,
    buttonClass: 'btn-primary'
} %}
    {% block button_text %}Menu Name{% endblock %}
    {% block menu_items %}
        <a class="btn-link" href="link">Button Name</a>
        <a class="btn-link" href="link">Button Name</a>
    {% endblock %}
{% endembed %}

Menu has a few options of customisation.

Gives you the option of the menu opening position.

Primary Placements:

• top
• bottom
• left
• right

Alignment Placements:

• top-start / top-end
• bottom-start / bottom-end
• left-start / left-end
• right-start / right-end

Auto Placement:

• auto (automatically chooses the best position based on available space)

hideAdornment is a togglable option to hide and show the caret . By default, it is set to false, to hide it simply change hideAdornment: to false.

buttonClass lets you add classes to the button. forumify's framework comes with a variety of button options which you can see here