NEW: Fancy Image Blocks
Squarespace have recently updated the ways that Image Blocks can be displayed. Previously, you could only have a plain old image, with or without a caption, and the caption could only be shown below the image or as an overlay at the bottom of the image, and you couldn't control the styling. Not anymore. All of the new styles can be modified within the Style Editor, meaning you can change the font, colour, spacing, size and more.
The great news is that these new ways of showing text to accompany images means you can now do some pretty creative things with these blocks, making your clustered text & image more attractive and user-friendly. Here are some examples of the new styles, along with inspiration on where and how you might use them in your website.
Image Style: Collage
Ideal for team pages or anywhere you want to show a title and subtitle clearly associated with an image. Works best with small amounts of text.
Image Style: Card
This style is great for customer testimonials - or, since you can make the image/text clickable, it's also the perfect call to action if a button seems too boring for your needs. Works best with medium amounts of text; the "card" is the same height as the image so if you use portrait format images, you will have more space.
Image Style: Poster
Great as the lead image on an article - or anywhere you need bold text on top of an image. You can also apply a tinted overlay over the image in whatever colour/opacity you like, so you can make the text stand out even more.
Image Style: Overlap
This would work well in longer articles or anywhere you want to use bold snippets of text with an accompanying image to break up a page. You'll need to use simple images and choose colours carefully or else this style can look quite messy.
Image Style: Stack
This is similar to the ordinary caption of before, only now you can have two blocks of text, and you can control the font size/style for each independently. This style can have as much text as you like as it just keeps flowing below the image.