Encyclopedia of Code
Start Here
Private Community
Resources
Categories
Breadcrumb Blog Navigation with Categories
These code snippets will automatically add breadcrumb navigation links with categories to the beginning of every Squarespace blog post.
Add a Description to Your Portfolio Projects
This code snippet will allow you to have a title and description on your Portfolio Projects.
Remove Spacing Under Headings
This code snippet will allow you to remove some of the spacing under a heading.
Add Spacing Between Images in a Gallery Reel
This code snippet will allow you to add white space between the images in a Gallery Slideshow Reel.
Edit the Event Button Text and Backlink
This code snippet works on Event Pages in both Squarespace 7.0 and 7.1. It will allow you to change the words “View Event” in the Event Button that appears for past events. This will also allow you to change the words in the event post’s backlink from “Back to Events” to text of your choice.
Change the Color of the Search Bar
This code snippet will allow you to change the colour of the search bar in both Squarespace 7.0 and 7.1.
Fixed Header with Shrinking Logo on Scroll | Squarespace 7.0
This code snippet will allow you to have a fixed header in Squarespace 7.0. When a user scrolls down the header and logo shrink in size. This is a good option for those whose logo take up a large portion of the screen.
Custom Search Icon
This code snippet will allow you to add a custom search icon in both Squarespace 7.0 and 7.1.
Custom Second Navigation in Squarespace
This code snippet will allow you to add another navigation in Squarespace above your current header. This includes a search bar, social icons, and additional links that will be displayed above your main navigation on both desktop and mobile.
Add a Transparent Background Colour to Text and Buttons
This code snippet will allow you to add a semi-transparent background colour to text and buttons in Squarespace. This allows your background image to show through while making sure your text is nice and clear.
Resize Related Products | Squarespace 7.0
This code snippet will allow you to resize the related products on product pages for multiple screen sizes in Squarespace 7.0.
Resize the Newsletter Form Input Boxes and Button
This code snippet will allow you to change the padding inside the Newsletter Form field element input boxes and button to make them smaller/bigger in height and width.
Multiple Languages in Squarespace 7.1 (Dropdown Design)
This code snippet will allow you to switch between multiple languages on your Squarespace Site using a drop down in the main navigation.
Change the Width of the Mobile Menu
This code snippet will allow you to change the width of the mobile navigation menu.
Change the Order of the Date in a Form
This code snippet will allow you to change the date to Day, Month, Year in a form in Squarespace.
Video Captions on Hover
This code snippet will allow you to have the video captions display over the video on hover.
Footer Navigation in Columns on Mobile
This code snippet will allow you to create a custom footer navigation that displays in columns when being viewed from a mobile device.
Blog Posts in Two Columns on Mobile
This code snippet will allow you to showcase your blog items in two columns when being viewed from a mobile device.
Make the Folder Title Clickable | Squarespace 7.1
This code snippet will make your folders clickable. When users click on the folder title they will be taken to the first page in the folder.
Customize the Input Text in a Form
This code snippet will allow you to edit the style of the text that a user inputs into a form on Squarespace.