How to Add and Customize Image Blocks in Squarespace
Learn how to add and customize image blocks in Squarespace to enhance your website’s visual appeal.
Navigate to Your Page
Go to the menu on the left and click on “Website.”
Click on “Pages” and find the page where you want to add your block.
Click on that page and press “Edit” in the top left corner.
Add an Image Block
Click on the button in the top left corner to add a new block.
Choose “Image” from the menu.
You’ll see an empty block with a dotted line and a plus sign.
Upload or Select Images
Double-click on the image block.
You can upload a file from your computer, select from your library, or browse stock images.
For this tutorial, we’ll use stock images from Unsplash.
Customize Image Layout
After adding the images, click on the pencil icon to edit settings.
Align the image left, right, or center within the container.
Use the design options to fit or fill the image to the frame.
Advanced Image Settings
Edit the focal point to highlight specific parts of the image.
Add alt text for accessibility.
Use the built-in editor for further customization.
Duplicate and Align Images
Duplicate image sections to maintain consistent dimensions.
Align images centrally or adjust spacing as needed.
Remove or adjust gaps between images for a seamless look.
Shape and Effects
Use the shape option to create circular or elliptical images.
Apply image effects like film grain sparingly.
Customize corners by rounding them as needed.
Add Text Blocks
Add text blocks next to your image blocks.
Adjust the bounding box to fit the text neatly.
Use bold text for emphasis and align text blocks for a balanced layout.
Mobile View
Switch to mobile view to ensure compatibility.
Adjust the mobile layout without affecting the desktop view.
Fine-tune spacing and alignment for optimal mobile presentation.
NEW COMMUNITY!
I am launching my premium community to help you solve your biggest headaches when building your website or starting a web design business. If you would like to find out more, you can join the waitlist here: https://community.pixelhaze.academy/interest
We also have a free Skool community dedicated to website builders, including Squarespace, Wix (from Autumn 2024), and Hostinger here: https://www.skool.com/website-builders/about
Check Out Square Forge, our Squarespace Template Builder: https://squareforge.net
