Apply custom CSS to enhance your site's appearance beyond Squarespace's built-in styling options. Focus on modifying fonts, colors, and backgrounds to avoid potential site damage.

To add custom CSS:

1. Open the custom CSS panel
2. Click "Open in a new window" for an expandable view
3. Add your code
4. Click Save to publish changes

Note: Line numbers appear on the left for reference, and syntax errors display in red at the bottom.

Uploading Custom Files

Upload custom images and fonts through the CSS Editor:

1. Click "Custom Files" (or "Manage Custom Files" in version 7.0)
2. Click "Add Images or Fonts" or drag files into the upload area

Supported file formats:

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

Using Custom Files in Your Code

1. Write your code up to where you need the file URL
2. Place cursor at the desired location
3. Click the file to automatically insert its URL

Important Considerations

• Custom CSS doesn't transfer between templates in version 7.0
• The syntax checker flags code that may not work across browsers
• If using SSL, ensure file URLs match your security settings (http vs. https)

Best Practices

• Verify code formatting and completeness
• Test changes across different browsers
• Keep backups of your custom CSS
• Update file URLs when changing SSL preferences

For additional support, consider consulting Squarespace Experts or visiting the Squarespace Forum for developer guidance.

Related Articles

Previous Articles