How can I make the menu close when a link is clicked in Webflow?

To make the mobile menu in Webflow close when a link is clicked, you need to add interactions that trigger the menu to close upon clicking a link.

1. Use Navbar Component's Built-in Behavior

• If you’re using Webflow’s Navbar component, it automatically closes when a menu link is clicked — as long as the link navigates to a new page or section.
• This applies to both internal page sections (like #about) and external/internal page links.

2. Add Custom Interaction (for Custom Menus)

If you’re using a custom menu or custom interactions, follow these steps:

• Select each link inside your mobile menu.
• Go to the Interactions panel (lightning icon).
• Add a new Mouse Click (Tap) trigger.
• On the first click, add an action to affect the menu wrapper (typically a div that contains the menu).
• Set the action to hide or shrink/slide the menu — whatever your closing animation is (e.g., display: none, height = 0%, move, opacity, etc.).
• Optionally, reset the menu icon (like hamburger icon to default state).

3. Double-Check Menu Icon State

• If your hamburger icon changes (e.g., into an "X"), make sure to also reset its animation state when a menu link is clicked.

4. Use Webflow's Page Section Scroll Links Properly

• If you're linking to sections within the same page, ensure the links use section IDs (e.g., #features), so the Navbar component automatically handles the close.

Summary

To close your menu when clicking a link in Webflow, use the Navbar component’s built-in behavior for standard use cases. For custom menus, add a click interaction that hides the menu when any link is clicked.