Jump to content

Changing Font on Image Block Poster

Recommended Posts

Site URL: https://www.waterdragonfabrics.com/

Hi there!

I am trying to create a piece of CSS code to change the font on my gallery image block (poster). The text that's in bold letters on top of the image.
 I have just tried piecing something together but I have not enough knowledge of CSS. Something along the lines of this:

.design-layout-poster .image-title p:(color:white!important font:? size:?

You can see I am not too experienced. Would appreciate your help. Also I am not sure where to take the font info from. I am imagining I can just use a font name that squarespace offers me in the site styles?

Best wishes,


Edited by Water_Dragon_Fabrics
Link to comment
  • 3 weeks later...

I finally figured this out! It was really hard to find the element in the code. (This is on a 7.1 site.)


This worked for me for the heading:


.sqs-block-image .design-layout-poster .image-title h1 { 
    font-family: Arial;
    color: #000000 !important;


For the Sub-Title, just switched h1 to p:

.sqs-block-image .design-layout-poster .image-subtitle p {
    font-family: Arial;
    color: #000000 !important;


The font-family did not need the !important flag, but the color did. 

Link to comment
  • 2 years later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.