How to use Custom Fonts for Image Block Title (Card) in 7.1

Code HacksSquarespaceNew 7.1
Written By Emily Peilan
From this…

From this…

… to this!

… to this!

IF YOU WANT WEBSITE LEADS ON AUTOPILOT, CHECK OUR MASTERCLASS

Navigate to Design > Custom CSS

Insert the following Code:

.image-block-collage-text-alignment-left .sqs-block-image .design-layout-collage .image-card>* h3 {
  font-family: 'Amalfi'; /* insert your desired font here */
  font-size: 1.5rem; /* style font size here */
}

It’s as easy as that!

You can find the font I used here: Amalfi Coast

If you need help importing a font that isn’t on Squarespace, check out this extensive blog post where I show you my step-by-step method:

Let me know how you got on in the comments below, or if you have any questions! Happy custom coding friends!

 
Custom Fonts Image Card 1.png

pin me .

 

Similar blog posts that you would love…

Emily Peilan

Squarespace Web Designer | Creating stylish, chic and modern websites that convert for the Creative Entrepreneur and Small Businesses. 

https://www.arohavisuals.com
Previous

The 5 Essential Types of Content you need to Prepare before working with a Web Designer
Next

How to Import multiple Custom Fonts into Squarespace 7.1