InsideTheSquare.co

View Original

How to change image block text styles

This tutorial is for both versions of Squarespace, 7.1 and older versions built with 7. For more information, visit https://insidethesquare.co/themes

This tutorial will show you how to customize the text for different types of image blocks.

Now to be super-duper clear, this is not for gallery images, this is for on-page image types found on blog posts, additional product details, and event. These image blocks have design settings like inline, poster, card, overlap, collage, and stack.

Inline images can have a caption, while the other five get a title, subtitle and a button if you want one. 

Using CSS, we can change all of them to a new style, or specify based on the image type.

There are a LOT of different options, and I walk you through them all in this tutorial.

The main codes are pretty simple to remember, but the full list is available for free in the cheat sheet below:

.image-title p changes the title

.image-subtitle p change the subtitle

.image-button a is for the button.

See this content in the original post