CSS Editor Guide

The CSS Editor allows advanced customization of fonts, colors, and backgrounds beyond Squarespace's built-in options. This tool is designed for users proficient in CSS coding.

Important Limitations:

• Use CSS only for styling (fonts, colors, backgrounds)
• Custom CSS doesn't transfer between version 7.0 templates
• The syntax checker flags potential browser compatibility issues

Adding CSS Code:

1. Open the custom CSS panel
2. Click "Open in new window" for a pop-up editor
3. Add your code
4. Click Save to publish changes

Working with Custom Files:

1. Click "Custom Files" (or "Manage Custom Files" in v7.0)
2. Upload files by clicking "Add images or fonts" or drag-and-drop

Supported File Types:

• Images: .jpg, .png, .gif
• Fonts: .ttf, .otf, .woff
• Note: .svg files are not supported

Using Custom Files in Code:

1. Write your CSS code
2. Position cursor where file URL is needed
3. Click the uploaded file
4. URL automatically inserts at cursor position

SSL Compatibility: When changing SSL settings, update file URLs accordingly:

1. Open CSS Editor
2. Access Manage Custom Files
3. Click the file
4. Update URL protocol (http/https)
5. Save changes

For additional support:

• Consult the Squarespace Forum
• Consider hiring a Squarespace Expert
• Explore premium plans for advanced customization options

Related Articles

Previous Articles