Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 18
jasonbarone

How do you make a dropdown navigation folder clickable?

Question

I'd like to place a few Categories into a folder, and have the Main Link (the Folder itself) actually link to a Category too.

How is that possible?

Example:

alt text

I need the Folder Link (Decorate) to actually take people to the Category for Decorate so I don't have to list it inside of the Folder.

So basically my question is how do I turn the Folder Link into an actual link? I saw your other thread about this but it doesn't work if the links are External Links, which these are...

Thanks!

Edited by jasonbarone
reworded question

  • 🚀Founder at Squarefront, the global community of Squarespace builders.
  • 🎥Documenting the process of building Squarefront on YouTube.
  • 🚗Senior Design Engineer, Design Platform at Uber.
  • 🍕Connect with me on Instagram, Twitter and Linkedin.
  • Need help with Squarespace? I've used the platform for well over 10 years and have helped thousands of businesses, both small and large. Send me an email!

Share this post


Link to post

Recommended Posts

  • 0

This worked great for my desktop version. But now on mobile I'm unable to see the subpages of the folder. It goes straight to the first page link. Is there a way to disable this on mobile?

Share this post


Link to post
  • 0

This worked great for my desktop version. But now on mobile I'm unable to see the subpages of the folder. It goes straight to the first page link. Is there a way to disable this on mobile?

Share this post


Link to post
  • 0

@dhoulb

Have you found a resolution to your problem? I'm experiencing the same issue in that clicking on the folder title will not take me to the page I've created.

~Jon

Edited by Jonsolotravels
Initial Revision

Share this post


Link to post
  • 0

I'm having the same problem. I'm using FIVE template, and I tried using this Code Injection, and when I click on the folder link it does not take me anywhere. I want it to take me to the first page in the folder. And then I would like to hide the first item in the folder so there is not two links with the same name in the Navbar. Anyone? Please help.

Share this post


Link to post
  • 0

Thank you @dhoulb, this workaround did the trick for me in the Five Template.

what I did was: - create a subpage in a folder. Move this subpage to the top of your pages list within this folder. (important for code to work) - paste @dhoulb 's first block of code into the Code Injection field for the site's Footer section. - paste the second line of code provided by dhoulb (starting with .folder-collection) into the custom CSS to hide the new subpage from the folder's drop-down menu.

you should now be able to click thru the folder title in the top nav to get to the new hidden subpage.tagging: @nicedayvince and @evolutions4 in case you were still looking for help.

Share this post


Link to post
  • 0

I found a work around that involves adding the page in the drop down list, but here's what I did.I edited the CSS as follows:


.folder:nth-child(2) .subnav .collection:nth-of-type(1) {
 visibility:hidden;
 display:none;
}

What we have here is a way to access the first link in a drop down list, and make it disappear.

nth-child() allows you to change the CSS of the nth child element of whatever element you are accessing, in this case, the .folder class that is used for navigation folders. You'll have to take a look at the source page to make sure you understand which elements you need to access.

In this case, I accessed the first instance ( nth-of-type(1) ) of the .collection class within the .subnav class, and changed the visibility to hidden, and the display to none.

This way you could, for example, place a page called Cars within a folder called cars as the first sub page, then make the sub page invisible. The Folder still links to the invisible page, but now you don't visibly have a folder and page with the same name.

Hope this Helps!

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...