Linking to collection items in nav bar dropdown

[clyro (Matt)]

Hi everyone,

I’m struggling with how to link to items in a collection in the nav bar.

Can I show a dropdown with the title and link to each item in the collection?

e.g
Features
Features collection item name 1
Features collection item name 2
Features collection item name 3
Features collection item name 4

Obviously I could use external links with the URL path, but it seems risky if URL paths change. I can’t seem to find them in the pages list manually or how to populate the dropdown dynamically.

Thanks!

---

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

[DFink (Dave)]

So inside collection lists, you must create an actual link, either text link or link block that you can then link in the settings to “current collection”. Then it will go to whatever the link corresponds to. Then you can say get text name from collection item name. this may help Collection list | Webflow University

If you are new to Webflow I strongly suggest you spend a couple of days watching a whole bunch of videos at https://university.webflow.com/ to learn about how to build in webflow. It’s extremely powerful and there is a lot to learn.

[clyro (Matt)]

Thanks for the help. I’ve been through the tutorials, thanks.

I’m still struggling to get the navbar dropdown to behave the same as standard links from the template I’m using.

I nested the collection wrapper in the navbar, and managed to get most of the styles to match. I just can’t get the text to turn white on hover (unless the mouse is directly over the text). Inherited styles have me really confused in general to be honest! It’s hard to decode what is happening with a template to move forward.

The collection is in The Features 2 dropdown.

Here’s the read only:
https://preview.webflow.com/preview/drift-test?utm_medium=preview_link&utm_source=dashboard&utm_content=drift-test&preview=0da282f1a7f3f1c438703d905ff836c7&mode=preview

Thanks again for your help!

[clyro (Matt)]

I managed to solve the styling issues for those struggling with adding collection lists in the nav for the Startup template like me!

1. Copy one of the dropdown menus in the nav to add a new one for your collection list.
2. Add a collection list component inside the “Dropdown List”.
3. Choose to display the Text as the collection item name i.e your page name.
4. Drag the existing “Dropdown Link” nested inside your Collection Item - this was the frustrating part. Doing this means it retains the styling and behaviour from the Dropdown link.
5. Finally, you can now select the purple collection item as the link. Choose "Current [name of collection].