Clickable Section Background Images

What You'll Create

Section backgrounds that function as clickable links, turning your full-bleed images into large, easy-to-tap call-to-action areas. The entire background image becomes interactive while still displaying content on top.

The Problem It Solves

Squarespace section backgrounds are purely decorative—they can't be linked. To make a full-bleed clickable area, you'd normally need to overlay invisible buttons or restructure your layout. This technique makes the background itself clickable without changing your design.

Perfect For

Hero section CTAs, Portfolio navigation, Landing page sections, Image-driven layouts, Full-bleed designs

What Makes This Different

This technique adds an invisible link layer that covers the entire section background. Visitors can click anywhere on that background image to navigate to your target page. The content blocks on top remain clickable too. You simply specify which section should be linked and where it should go.

Details

• Section Type: Fluid & Classic

• Code Type: CSS + JavaScript

• Prerequisites: Footer code injection access, Section ID, External script file upload

• Toolkit Title: Add Links to Background Images (7.1)

Learn This Technique

This is one of 150+ code techniques taught inside Standout Squarespace, where you get:

• The complete, copy-paste code

• Video walkthrough explaining how it works

• The principles behind the technique so you can customize it

• Access to our private community for support