How can I add more Nav Links to my Navbar in Webflow?

TL;DR
  • Use Webflow Designer to duplicate an existing Nav Link, then edit its text and URL in the Element Settings Panel.
  • Organize and style the new link, and publish your site to apply changes.

If you need to add more Nav Links to your Navbar in Webflow, you can do so easily through the Designer.

​

1. Locate the Navbar Component

  • Open the Webflow Designer and select the page where you want to edit the Navbar.
  • If you have already added a Navbar component, click on it to select it.

​

2. Add a New Nav Link

  • Click on the element within the Navbar, such as other existing Nav Links or the Navbar Container.
  • Within the Navigator Panel, locate the existing Nav Link.
  • Duplicate an existing Nav Link by selecting it and using the shortcut Cmd+D on Mac or Ctrl+D on Windows. Alternatively, right-click and select Duplicate.
  • Adjust the new Nav Link's text and link URL by selecting the link and updating it in the Element Settings Panel on the right.

​

3. Organize and Style the New Nav Link

  • Use the styles panel to ensure your new Nav Link maintains consistent spacing, fonts, and colors with the existing links.
  • Drag and drop the new Nav Link to the desired position within the Navbar.

  

4. Publish Your Changes

  • Preview your changes to ensure everything looks correct.
  • When satisfied, publish your site to reflect the changes.

​

Summary

To add more Nav Links to your Navbar in Webflow, use the Designer to duplicate an existing link, edit its settings, and style it appropriately. Remember to publish your changes to update your live site.

Webflow Resources
Webflow templates
Webflow inspiration
Rate this answer

Other Webflow Questions

Explore Logic tutorials
Can clients install the Webflow editor through a dedicated download page or is an invite from the dashboard necessary?
How can I make a dropdown open automatically when the page loads in Webflow?
How can I prevent my images from shrinking unexpectedly in Webflow? I've tried adjusting min width, max width, and max height but haven't found a solution yet.
How can I connect and use my JavaScript and CSS files for special functions and styles in Webflow?
Is it possible to give separate URLs to the tabs "For Everyday" and "For Pharmacy" in Webflow and have them act as their own pages, but still be clickable and changeable using the tabs function?
How can I limit the character count for the blog title in Webflow to avoid breaking the UI? The default "Name" field does not provide options for minimum and maximum character counts.
How can I create a dynamic schema in Webflow?
Can I add rounded corners to Youtube videos and remove all icons except for the play button on the videos in Webflow?
What is the URL of the custom fonts from Webflow, such as 'HK Grotesk', that can be obtained for use in the CSS Editor of Acuity Scheduling?
Can the form's action in Webflow be overwritten using JavaScript when the checkbox is unchecked, without causing a "405 Not Allowed" error?
What are the ramifications of removing these from the HTML tag in Webflow? Can I remove them if I'm using my own server for form submissions?
How can I adjust the tablet breakpoint in Webflow to display the nav menu (hamburger menu) at an earlier pixel width, such as 1150px instead of the default 992px? Is there any custom code or integration that can help me achieve this?
How can I make a Webflow page automatically scroll 600px down upon load without affecting any elements on the page?
How can I create a full-width background video using a Vimeo embed without the controls and with autoplay, but without it being 100vw and 100vh in Webflow?
How can I edit specific classes that I have created in Webflow? I am unable to locate the option box mentioned in an old response from 2014, and I do not see it to the right of the classes text field. The only dropdowns I see are for renaming or duplicating a class and selecting pseudo-classes. Here are screenshots for reference: [Include screenshots here]
Can I capture a screenshot of a Webflow page on click and convert it to a downloadable PDF?
How can I alternate the layout of the image and heading for each collection item in a two-column format on Webflow?
How can I execute JavaScript code when clicking a specific button with a given ID in a Webflow project?
How can I disable the Webflow success or failure state for a sign-up form and display a custom thank you page using jQuery and the Webflow form submit state?
How can I create a vertical scrolling menu with Webflow, similar to the one on Apple's website, that switches to horizontal scrolling when the menu doesn't fit on one screen?
How can I change the language of the Google Maps embed from English to Arabic in Webflow?
How can I reduce the vertical space between lines within a bullet point in Webflow? Can I replace the bullet points with icons on the "Services" page?
How can the text color be changed for custom input fields on Webflow?
How can I add conditional visibility in Webflow to prevent a div from appearing on a published page if a CMS field is empty?
How can I stop a YouTube video from playing in the background in audio mode when I close a modal in Webflow?
How can I connect and use my JavaScript and CSS files for special functions and styles in Webflow?
How can I fix the "Ensure text remains visible during webfont load" warning in Webflow?
How can I implement a ThreeJS script as a background for my Webflow project using custom code?
How can I send data from a Webflow Form to ActiveCampaign without using Zapier? I have set the form to POST and input the form's action URL, similar to Mailchimp but it redirects me to the admin area of ActiveCampaign without sending the data. Has anyone had success with this method?
Can Webflow be used to create a "blob" elements effect in the header of a website using custom code or JavaScript?