7 Different Ways You Can Use The Squarespace Image Block
If you have a website then there's a 99.9999% chance you will be using images on your site.
There’s a couple of ways you can include images on your site with Squarespace but I’ll be focusing on breaking down the image block for you.
Wait, are you new here? I wrote these blog posts to help you out in your biz:
1. Inline Layout
Using the Inline image block allows for a caption under your image that you can choose to either display or not. For SEO purposes you should always add a caption in the Inline layout because that automatically become alt text for the image. Google can’t read images so alt text helps Google identify what your image is all about.
Keep in mind that all other image block layouts don’t have the option to add alt text but you can still do so by first choosing the inline option ⇒ adding your text ⇒ Saving it ⇒ then changing the layout to a different layout.
2. Inline with Caption overlay
Although it’s still within the inline layout I wanted to make this separate since the end look is considerably different. With the overlay option, you can either 1) Have a set overlay 2) display it only when you hover on the image.
3. Poster Layout
With the poster layout, you can display your caption on the actual image and control the font size, font color, image overlay color, and content width. You can control all of this and more using your site styles functions ( Design ⇒ site styles).
Within the same poster layout, you can add a button to display on the image as well and control the font color and button color through your site styles.
4. Card layout
The card layout is super handy for when you want to have a background color behind all your text, background color on the title of your text, or keep the background white if you have a different color background. Here are three examples of how you can use the card layout on your site:
Like with the poster layout you can also add a button to your card layout image.
5. Overlap layout
There are so many things you can do with the overlap layout so this is just one example of it:
The site styles control panel lets you customize this layout so much that it’s impossible for me to show you all the different things you can do with it. Here’s a look at the site styles pane for the image overlap layout (notice how adding a button is also possible with this layout) :
6. Collage Layout
My personal favorite is the collage layout because I just love the look of it and I use it a lot throughout my site. Again, you can control anything from fonts to background color using the site styles control panel.
7. Stack Layout
The last option you have for your image blocks is your stack layout. You can add a button like in every other layout type + control the formatting through your site styles panel.
Hey , I'm Jessica!
I am the designer and owner behind JNL Media Co.! I help creative entrepreneurs & small biz owners create a beautiful Squarespace site that converts. After almost two years in corporate I left so that I could pursue my love for design + marketing and help other #girlbosses do the same through their business.
Obsessions: Traveling✈️ , Fitness💪🏼, and Writing ✍🏼