Add Photos
Image blocks are used to add a photo or GIF to a section on your website. Image blocks display only one image, while galleries display multiple photos in slideshow, carousel, grid, or stacked designs.
Insider Tip! Make sure to resize your photos so they don’t slow down the loading speed of your site. Squarespace recommends uploading images that are 500KB or less to ensure your site loads quickly. Learn more about Squarespace web image best practices here.
How to Add Your Photos
Double-click the image block you wish to edit (or click once and then click the pencil icon), click Replace. Then, click Upload File to add your logo from a file on your computer or Select From Library to use a file from your Squarespace asset library.
Once you have uploaded your new image, you can set the focal point by dragging the small circle on the image. The focal point determines where an image is centered.
If you would like to attach a link to your image, you can do so in the Content tab by clicking Attach Link. You can link to a URL, file, email, or phone.
There are several design options for your image blocks.
Fit vs. Fill – To have the image fill the container, click Fill. If you would prefer to maintain the original shape of the photo, click Fit and the image will maintain its shape within the container. If you choose Fill, parts of the image may be cropped as the layout adjusts for various screen sizes.
Shape – To change the shape of the photo container, click Shape. Then, click the arrow next to Shape under that tab to select the desired shape.
Image Effect – Apply image effects that include animations to create more interest.
Overlay – To add a color overlay (often used to darken or lighten your photo), toggle on Overlay and choose a color and blend mode.
Lightbox – Toggling Lightbox on means the image will expand when clicked while the rest of the page is dimmed.
Click Save to save your changes to the image block.
How to Add a New Image Block to a Section
Hover over the section where you would like to add the text block. Click + Add Block and click Image.
Drag the image block to the desired location within the section. Then, customize the size, content, and design.
Click Save to save your changes to the image block.