Custom Folder Links In Squarespace Nav

Folders are a useful tool but they come with one pretty annoying limitation — by default they only direct to the top most link contained within the folder.

In a lot of cases, this is a huge pain in the ass. You want to link to an overview page but are forced to just jump right in to your first item. This becomes especially frustrating when you are using a folder to link to particular tags or categories in a blog. Instead of going to the overall blog page, it jumps to just the first tag in the folder. 

I'm working on a website for this DC fashion blogger Petite Flower Presents. I needed to segment her navigation into a few different sub categories. 

Screen Shot 2017-12-23 at 15.17.52.png

I have a folder for the main blog that contains links to three different tags:

  • Style 
  • Beauty 
  • Food & Travel

By default, If I were to click the "blog" in the main navigation, it would default to the "style" category. I want to instead have it link to the main blog page. There is no way to make this the default case in Squarespace so, I found a workaround. 

 

A lil bit of code to the rescue

Basically we need to paste code into where the navigation title would normally go. This will keep the text the same but overrides the default link.

<a href="www.YOURSITE.com/page">Title Here</a>

www.YOURSITE.com/page = the url of where you want it to link.

if you're pointing to an outside link you can keep the above format but if you're linking to an internal page you can just use "/page"

Title Here = the navigation title

 

A final note — make sure to change the page title back. When you paste in the code to the navigation title it will automatically change the page title and you need to make sure to corrected it if you don't want weird stuff showing up in browsers tabs.

Petite_Flower_Presents_-__Private_Browsing_.png
 

There your are, now you know how to make custom links in the Navigation Title of Squarespace folders. Let us know what creative projects you apply this to!