How to Add a Zoom Hover Effect to Squarespace Image Blocks

Want to add a bit of ✨ pizzazz ✨ to your Squarespace images? In this tutorial, I’ll show you how to create a smooth and stylish zoom-in hover effect for any image block on your Squarespace site.

Whether you're using fit, fill, or shape image styles, this effect will work beautifully—and I’ll show you how to customize it.

In this tutorial, you’ll learn exactly where to place the CSS code in Squarespace, how to control the zoom scale, and even how to apply this to list sections, sometimes called "people" sections.

Plus, I’ll show you how Custom Codey (my Squarespace Code AI) can help you generate perfect hover effects (and more!) in seconds.

📌 Chapters
00:00 - Intro to Zoom Hover Effects in Squarespace
00:18 - Exploring different image block styles
00:46 - Where to paste the CSS in Squarespace
01:08 - Zoom effect on image blocks with img selector
01:29 - Hover effect without img selector
01:47 - Adjusting the zoom scale size
02:11 - Using the right selectors for other image types
02:32 - Adding hover effect to list section images
03:06 - Custom Cody adds smooth transitions
03:30 - Where to find the code and next steps

📝 Original Blog post with codes: https://insidethesquare.co/squarespace-tutorials/image-zoom
🙋‍♀️ Have a Squarespace question? Drop it in the comments below! I love hearing from you and helping you make your website uniquely yours! ✨
- - -
💸 GET 10% OFF YOUR FIRST YEAR OF SQUARESPACE 💸 Use my affiliate link and code INSIDE10 - You'll save 10% off your first annual subscription & Squarespace will give me a little commission for sending you their way 😎 🔗 INSIDE10 → https://insidethesquare.co/inside10
- - -
The term "Squarespace" is a trademark of Squarespace, Inc. This video was not approved or endorsed by Squarespace, Inc. I just really love their platform ♥ #SquarespaceCSS #ImageHoverEffect #SquarespaceTips #WebDesignTutorial #SquarespaceDesign #ZoomHoverEffect #SquarespaceImages #CustomCody #SquarespaceCustomization #InsideTheSquare

Видео How to Add a Zoom Hover Effect to Squarespace Image Blocks канала InsideTheSquare with Becca Harpain