Squarespace 5 helps you build a site without coding or design expertise. When you add content to your WYSIWYG editor, you're actually adding HTML to your site without writing the code yourself. Similarly, when you make style changes, you're automatically making changes to your site's CSS.
To further customize your site’s style and enhance specific parts of your site, you can use custom code. We highly recommend that you have coding knowledge before adding custom code. Some coding changes will conflict with your template's default code.
Certain editors can accept code, including the HTML Page, Text/HTML sidebar widget, and Journal Page blog posts. This guide explains the options for adding code to these editors and answers common questions about custom code.
Note: Adding code to your site is an advanced modification that falls outside of the scope of Squarespace support.
Add a code snippet
To embed or add a piece of code to a page, widget, or blog post, add it as a Code Block.
- In the editor, click the .
- In the window that appears, add your code.
- Click Save & Close.
Tip: Your code will appear as a Code Block icon while in the editor.
Code an entire page, widget, or post
In the editor, click the HTML button.
Tip: Use the HTML button, not the drop-down menu to its right.
The editor will switch to HTML mode. You'll see the code for any existing content.
Add your code to the editor. When you're finished, you can click HTML again to go back to the WYSIWYG.
Add code to your footer
The site footer accepts both plain text and HTML. To edit your footer:
- Enter Structure mode.
- Scroll down to the bottom of your site.
- Click Edit Website Footer.
For more help, visit Editing footers.
Add code to other areas of your site
To add code to other areas of your site, add it to your Code Injection. You can find this in your Website Management bar by clicking Website Settings, then Code Injection.
For more help, visit Code Injection.
- CSS - <style></style>
Can I style my site with CSS?
To add styles not available in your built-in style options, you can add CSS to your site with the CSS Editor. To access this, click the Style icon, then click the Custom CSS tab in the Appearance Editor.
For more information, visit Using the CSS Editor.
Can I add code files?
To add files that your code can reference:
- Add the files to your file storage area.
- Within your code, preface calls to these files with /storage/
What code can I add to my site?
You can add client-side code
Client-side code is code that is sent to and executed by a browser (like Chrome, Firefox, Safari, and Internet Explorer). This includes:
You can't add server-side code
Server-side code is handled by a server, not by a browser, and includes:
- Ruby on Rails