Squarespace 7.1Navigation & Menus

Header Icons - Inline

By Will's Toolkit

$15.00
Header Icons - Inline snippet from Will's Toolkit, preview from the Code Catalog – Squarespace Navigation & Menus on SquareLocator
Fit check
Great for
Small Businesses
Restaurants
Cafés
Consultants
Retail Brands
Know before you buy
  • Members-only code: you need an active Will's Toolkit subscription to see and copy it
  • Needs a Squarespace plan that allows custom code
  • A styling snippet rather than a configurable plugin, so changes beyond the design shown mean editing CSS
Version7.1
SetupEasy

Overview

Header Icons - Inline is a Header and Nav snippet from Will's Toolkit that places a small icon to the left of each main navigation link in a Squarespace header. Will's preview shows links such as Products, Travel Planning Services and About Us, each with a matching line icon sitting on the same line as the text.

What you get

  • Code that adds an icon beside each main navigation link
  • Icons aligned inline with the link text
  • Access to the full Will's Toolkit Code Catalog with membership

Who it suits

Sites with a handful of top-level pages where icons help visitors scan the menu, such as travel, hospitality and service businesses. It works best with short, clear navigation.

Honest limits

  • Members-only code: you need an active Will's Toolkit subscription to see and copy it
  • Needs a Squarespace plan that allows custom code
  • A styling snippet rather than a configurable plugin, so changes beyond the design shown mean editing CSS
  • Icons are set in the code, so changing them means editing the snippet

How it is delivered

This snippet sits in the Code Catalog of Will's Toolkit, Will Myers' membership for Squarespace designers, and is marked members only. Membership is $15 a month or $150 a year and includes the full Code Catalog, the Toolkit browser extension, the Robo-Will AI assistant, the Slack community and 20 per cent off Will's plugins. Snippets are copy and paste code added to your site. Will's catalogue lists it under Header & Nav, last updated 4/30/2025.

Related guide: browse every plugin we list in the Squarespace plugins collection, or read our roundup of the best Squarespace plugins in 2026.

Header Icons - Inline is a navigation snippet from Will's Toolkit that adds a small icon to the left of each main menu link. In Will's preview, Products, Travel Planning Services and About Us each get a matching line icon, which makes the menu quicker to scan and gives the header a bit more character.

It suits short menus with clear page names. Choosing and changing icons happens in the code, so plan the icon set up front. A stacked variation that puts icons above the labels is also in the Toolkit.

It is part of Will's Toolkit, Will Myers' membership for Squarespace designers, rather than a one-off purchase. Membership costs $15 a month or $150 a year and unlocks the full Code Catalog of more than 100 snippets, the Toolkit browser extension, the Robo-Will AI assistant, a Slack community and 20 per cent off Will's paid plugins.

The honest caveats: the code is members only, it needs a Squarespace plan that allows custom code, and as a styling snippet it does one job well rather than offering a settings panel. Anything beyond the design shown means editing the CSS yourself.
What it does
  • Adds icons beside header navigation links
  • Keeps icons on the same line as the link text
Full specifications

FAQs

FAQs

What does Header Icons - Inline do?
It adds a small icon to the left of each main navigation link, on the same line as the text, as shown in Will's preview.
How is it different from Header Icons - Stacked?
Inline puts the icon beside the text. Stacked puts the icon above a smaller label, which takes more height but less width.
Can I choose the icons?
Yes, the icons are set in the code, so you choose which icon goes with each link when you add it.
How do I get this snippet?
Join Will's Toolkit, Will Myers' membership, at $15 a month or $150 a year. The snippet is in the members-only Code Catalog along with over 100 others.
How is it installed?
It is copy and paste code. You add it to your Squarespace site, then adjust colours or sizes in the CSS if you want to match your brand.
Do I need a particular Squarespace plan?
You need a plan that allows custom code. The Toolkit is built for Squarespace 7.1.