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.

Why Clickable Images Matter for Your Website?

Clickable images improve user experience (UX) by allowing visitors to navigate easily, download files, or view related content without relying on traditional text links.

At Square Style, we specialize in helping businesses optimize their Squarespace websites for efficiency and automation.

Below, we provide a step-by-step expert guide to making images clickable in Squarespace, covering both version 7.1 and 7.0.

Quick Fix

Why Make Images Clickable?

Enhanced Navigation: Clickable images can serve as visual navigation tools, guiding users to important pages or resources.
Increased Engagement: By linking images to relevant content, you encourage visitors to explore more of your site, increasing their time spent on your pages.
Improved User Experience: Clickable images can make your site more interactive and user-friendly, allowing visitors to access information quickly.

Step 1: Choose Where to Add Clickable Images

Squarespace allows you to add clickable images in multiple ways. Choose the right option based on your needs:

Image Blocks (For Single Images)

Best for: Adding clickable images to regular pages, blogs, and product listings.

Gallery Sections (For Multiple Images, Version 7.1 Only)

Best for: Portfolio pages, service showcases, or case studies.

Gallery Blocks (For Multiple Images in Blog Posts & Events)

Best for: Clickable images in dynamic content like blogs or event pages.

Gallery Pages (Version 7.0 Only)

Best for: Dedicated pages showcasing image collections with clickthrough links.

Step 2: Add Clickthrough URLs to Image Blocks

Image blocks are the most common way to add a single clickable image.

Add an Image Block

Navigate to the page where you want the image.
Click Edit and select + Add Block > Image.
Upload your desired image.

Attach a Clickthrough Link

Click on the image block to open its settings.
Click the pencil (edit) icon and select Attach Link.
Choose one of the following options

Web Address – Link to an external website (e.g., your social media or partner pages).

Page – Link to another page on your Squarespace site.

File – Link to a PDF, image, or downloadable file.

Email – Open an email client when clicked.

Phone Number – Make a phone call (useful for service businesses).

Optimize How the Link Opens

Enable "Open in new tab" if linking to an external site.
Click Save to apply the changes.Enable "Open in new tab" if linking to an external site.
Click Save to apply the changes.

SEO Tip: If linking to internal pages, make sure your image alt text includes relevant keywords for better ranking in Google Image Search.

Step 3: Make Gallery Section Images Clickable (Version 7.1)

Gallery sections are useful for displaying multiple images in an attractive layout.

Add a Gallery Section

Click Edit on the page where you want the gallery.
Select + Add Section > Gallery and upload your images.

Attach Clickthrough URLs

Hover over an image and click Edit Gallery.
Click the image and find the Link field.
Enter a URL or click the gear icon for advanced link settings.

Save & Optimize

Click Save to apply the link to the image.

Pro Tip: If linking to product pages, use UTM tracking parameters to track which images drive the most clicks.

Step 4: Add Clickthrough URLs to Gallery Blocks

Gallery blocks work well in blog posts, event descriptions, and certain Squarespace pages.

Add a Gallery Block

Click + Add Block > Gallery and upload your images.

Attach Clickthrough URLs

Hover over the image and click the gear icon.
Click Click to add URL and select one of the following:
- Content – Link to an internal page.
- File – Link to an uploaded file (e.g., PDF, image).
- External – Link to another website.

Save Your Changes

SEO Tip: Keep your image file size under 500KB for fast loading and improved Core Web Vitals scores.

Step 5: Add Clickthrough URLs to Gallery Pages (Version 7.0)

Gallery pages are ideal for Squarespace 7.0 users who want a dedicated page for image collections.

Add a Gallery Page

Click Pages > + Add Page > Gallery.
Upload your images.

Attach a Clickthrough URL

Hover over an image and click the gear icon.
Click Options > Clickthrough URL.
Choose from internal page, external site, or file download.

Save & Publish

Template Note: Some Squarespace 7.0 templates (e.g., Avenue, Montauk) do not support clickthrough URLs in gallery pages. If yours doesn’t, use gallery blocks instead.

Step 6: Enable Lightbox for Clickable Images (Optional)

A lightbox effect allows images to open in an overlay while keeping visitors on the page.

For Image Blocks: Enable Lightbox in image block settings.
For Gallery Sections/Blocks: Click Edit Gallery > Enable Lightbox.

Use Case: A lightbox is great for portfolios, photography websites, and digital product previews.

Conclusion: Enhance Your Website with Clickable Images

Adding clickthrough URLs to images in Squarespace is a simple yet powerful way to:

✅ Improve user navigation
✅ Increase engagement & conversions
✅ Optimize SEO & accessibility

At Square Style, we help businesses transform their websites into automated client-generating machines. If you need a custom Squarespace strategy, contact us today for expert guidance!