Being an active member on squarespace forum, I’ve been asked a lot questions about some simple customization, most of them can be solved by inject custom css or javascript, here is how to do
- Add Custom Css to the site
- Add Custom snippet to Single page
- Add Custom snippet side-wide
- Find the fixed element id with Chrome Extension
Add Custom Css to the site
- Navigate to Settings Page
Usually your domain.com/config - Click for item Design, then select Custom Css
- Paste the code to Custom css textarea
Tips: Paste it in the end of the box - Press Save
Add Custom snippet to Single page
- Navigate to Settings Page
Usually your domain.com/config - Select Pages item, where you manage ste’s pages
- Hover over the name of the page name, click on gear icon
There will be a popup show up, click on Advanced - Paste the code snippet to end of the Page Header Code Injection
Add Custom snippet side-wide
- Navigate to Settings Page
Sed do eiusmod ut tempor incididunt ut labore et dolore. - Click Advanced, then Code Injection
- There 2 boxes, HEADER and FOOTER
Paste the snippet in one of them, based on the instruction, usually on Footer
Find the fixed element id with Chrome Extension
Sometime you just wanna apply the code to one block only, what is when this plugin useful
Find this plugin on Chrome Extension and Install it
Squarespace ID Finder – Chrome Web Store (google.com)
- Once install, visit your website
- Look for the extension icon on the top right of browser
- Click on the icon, there will be some text show up above your blocks
- Click on them to copy to clipboard and follow answers instruction