The CSS Editor in Squarespace allows you to customize your site's appearance beyond built-in options through custom CSS code. This tool is primarily for modifying fonts, colors, and backgrounds.

Using the CSS Editor:

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

Note: The syntax checker will flag any code that may not work correctly across browsers. Line numbers help navigate your code, and syntax errors appear in red at the bottom.

Custom Files Feature:

• Click "Custom Files" or "Manage Custom Files"
• Upload images or fonts by clicking "Add Images or Fonts" or drag-and-drop
• Supported formats:
  • Images: .jpg, .png, .gif
  • Fonts: .ttf, .otf, .woff
  • Note: .svg files are not supported

Using Custom Files in Code:

1. Place cursor where you want the file URL
2. Click the file from Custom Files
3. URL automatically pastes into your code

Important Considerations:

• Custom CSS doesn't transfer between templates in version 7.0
• When changing SSL settings, update file URLs accordingly (http/https)
• Limit CSS modifications to fonts, colors, and backgrounds to maintain site stability
• For complex customizations, consider Premium and Enterprise plans

Remember to check the syntax and test your changes before publishing to ensure everything works as intended.

Related Articles

Previous Articles