Template Docs Commerce APIs Webhooks
Get Started
Template Docs Commerce APIs Webhooks
Get Started
Start Here
Quick Start Beginner Tutorial
The Basics
Template Overview What is JSON? View JSON Data Templating Basics
Template Files
Template Configuration Layouts & Regions Template Partials Menus & Navigation Folders & Indexes Collections Static Pages
Template Language
What is JSON-T? JSON-T Directives JSON-T Predicates JSON-T Formatters JSON-T Helpers JSON-T System Variables
Squarespace Tags
Open Block Field Navigation Tag Category Tag Custom Query Tag
JavaScript
Custom JavaScript Image Loader
Advanced
Local Development Custom Post Types Template Annotations Style Editor Error Reporting URL Queries

Navigation Tag

Navigation tags in Squarespace are a particular type of .block file that creates and displays navigation areas in a template that are revealed in the CMS 'Pages' section of the site.

To include a navigation in your template, use the Squarespace navigation tag:

<squarespace:navigation navigationId="mainNav" template="main-navigation" />

Squarespace navigation tags bind navigation data (navigationId) to a navigation template (block file). The navigationId must match the "name" of one of the navigations defined in template.conf. And the template must match the filename of a .block template in the /blocks folder. For instance, if you specify template="mynav", you need a template called mynav.block in the /blocks folder.

Folder Navigation

Sometimes referred to as a "Sub menu," a folder-navigation tag will automatically generate links to all other pages within the same folder when viewing a page inside a that folder. To add a sub menu to your template, you need to use a folder-navigation tag pointing to a .block file containing the markup as shown here:

<squarespace:folder-navigation template="submenu" />

This tag is different from a normal navigation tag because it automatically pulls navigation data from the page being viewed, and there is no navigationId attribute necessary. It also includes active page variables so you can set active states on the active page links within your .region file.