Custom CSS allows you to extend Squarespace's styling capabilities by modifying fonts, colors, and backgrounds. Add CSS code carefully to avoid potential site issues.

Adding CSS Code:

1. Open the Custom CSS panel
2. Click "Open in New Window" for an expandable editor
3. Add your custom CSS code
4. Click Save to apply changes

The editor displays line numbers for easy reference and highlights syntax errors in red.

Uploading Custom Files:

1. Click "Custom Files" (or "Manage Custom Files" in v7.0)
2. Upload by clicking "Add images or fonts" or drag files
3. Supported formats:
   • Images: .jpg, .png, .gif
   • Fonts: .ttf, .otf, .woff Note: .svg files are not supported

Using Custom Files:

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

Important SSL Considerations:

• File URLs match your site's SSL settings
• When enabling SSL:
  1. Open CSS Editor
  2. Click Manage Custom Files
  3. Click the file
  4. Update URL to start with https
  5. Save changes

Key Limitations:

• CSS should only modify fonts, colors, and backgrounds
• In v7.0, Custom CSS doesn't transfer between templates
• Built-in parser flags potential browser compatibility issues
• Code must pass syntax validation

For additional support:

• Review the Custom code FAQ
• Visit the Squarespace Forum
• Consider hiring a Squarespace Expert
• Explore premium/enterprise plans for advanced customization

Related Articles

Previous Articles