How To Easily Resize Images In Squarespace: Insider Tips

This post may contain affiliate links. I may earn a commission at no extra cost to you if you make a purchase through them. Full disclosure here.

Resizing images in Squarespace is easy.

Simply follow these steps:

1. Click on the image you want to resize. You'll see a dot on the bottom of the image border.

2. Drag the dot up to make the image smaller or drag it down to make it bigger.

3. When you're happy with the size, click Save or Done > Save Changes.

Alternatively, you can use Squarespace's built-in image editor to resize your images. Here's how:

1. Click Edit to edit the page with the image you want to resize.

2. Click the image and then the pencil icon.

3. In the image options, click Edit.

4. Click the Crop tool to adjust the size and aspect ratio of your image.

Squarespace makes it simple to resize your images without having to download and edit them externally. Let's dive deeper into the different methods you can use.

Quick Fix

Resizing Images Using Spacers

One of the easiest ways to resize images in Squarespace is by using spacer blocks. Spacers allow you to add white space around your image to adjust its size on the page.Here's how it works:

1. Add an image block to your page and upload the image you want to resize.
2. Above and below the image block, add spacer blocks.
3. Drag the spacer blocks inward or outward to decrease or increase the size of the image.

Using the Image Editor

Squarespace also has a built-in image editor that allows you to resize your images directly within the platform.To use the image editor:

1. Click on the image you want to resize.

2. Click the pencil icon to edit the image.

3. In the image options, click Edit.

4. Click the Crop tool and select a preset size or create a custom crop.

5. Adjust the image as needed and click Apply.

The image editor gives you more precise control over the size and aspect ratio of your images.

Resizing with CSS

For more advanced users, you can also resize images using custom CSS. This method requires some coding knowledge, but it gives you the most flexibility.

Here's an example of how to resize an image using CSS:

css.sqs-block-image img {
  width: 50%;
  }

    

Copy to Clipboard

This code will reduce the width of the image to 50% of its original size. You can adjust the percentage to your desired size.

Resizing images is an essential skill for creating a visually appealing Squarespace website. By using the built-in tools and features, you can easily adjust the size of your images without having to leave the platform.