SEO-Optimized Guide: Malware Detection & Security Reporting Guide

SEO-Optimized Guide: Malware Detection & Security Reporting Guide

By Michael Turner

December 6, 2024 at 06:06 AM

Customizing fonts in Squarespace involves modifying text style, size, color, and spacing across your site. Here's how to effectively manage your site's typography:

Font Collection Overview

  • Access to 600 Google fonts and 1,000 Adobe fonts
  • Recently used fonts and popular options appear first
  • Search functionality available for specific fonts
  • Some Google and Adobe font formatting options aren't supported

Key Font Considerations

  • Using consistent fonts creates a unified site appearance
  • Font display may vary across devices and browsers
  • When fonts are removed from Google/Adobe libraries, they're replaced with closest matches
  • Most font changes apply site-wide within their category (Headers, Paragraphs, etc.)

Text Scaling

  • Automatically adjusts text size for different screen sizes
  • Version 7.1: Scales based on base font size
  • Version 7.0: Adjusts according to browser window size

Modifying Fonts

To Change All Fonts Site-wide (Version 7.1):

  1. Open Styles panel > Fonts
  2. Click "Change" on current font pack
  3. Select Sans serif, Serif, or Mixed styles
  4. Preview and select new font pack
  5. Set base font size
  6. Save changes

To Modify Specific Font Elements:

  1. Click "Assign styles" in Fonts panel
  2. Select text group (Heading, Button, etc.)
  3. Choose font style from dropdown
  4. Customize additional options as needed

Squarespace Page Styles

Squarespace Page Styles

Font Styling Options:

  • Weight: Text thickness
  • Line height: Spacing between lines
  • Letter spacing: Space between characters
  • Text case: Uppercase, lowercase options
  • Size: Individual size controls for different text elements

Adding Custom Adobe Fonts (Version 7.0):

  1. Create web project in Adobe Fonts
  2. Copy project ID
  3. Add ID to Squarespace Developer Tools
  4. Apply custom fonts through site Styles panel

HTML Code in the editor

HTML Code in the editor

Troubleshooting Tips:

  • Use paste without formatting (Ctrl/Cmd + Shift + V) to maintain site styles
  • Ensure font weight is above 100 for mobile readability
  • Check domain settings if fonts appear different when logged in
  • Use recommended size units (rem for 7.1, em/px for 7.0)

System Font Options:

  • Helvetica Neue (Sans-serif)
  • Georgia (Serif)
  • Verdana (Mixed)

For optimal results, regularly test font appearance across different devices and maintain consistent styling throughout your site.

Related Articles

Previous Articles