How to disable Google Map block zoom
There may be occasions when you want to disable the zoom function on a Google Map block in Squarespace 7.1—especially when the map zooms in and out as users scroll over it. This can be distracting or frustrating, particularly on pages where the map is positioned near important content. In this tutorial, you’ll learn how to easily disable scroll zoom on the Google Map block to improve your site's usability and user experience. This tutorial will show you how to disable Google Map block zoom on Squarespace 7.0 and 7.1.
Table of Contents
Why Disable Google Map Block Zoom?
Disabling map zoom can help:
Prevent accidental zooming when scrolling
Maintain smoother navigation across your page
Improve the user experience, especially on mobile
This is especially useful when your map is embedded near text or interactive elements.
Complexity: Easy
Step-by-Step Instructions
Step 1: From the Squarespace dashboard navigate to Pages > Custom Code > Custom CSS and paste the code. The following code snippet below will disable this and ensure that your map blocks remain static:
// Disable Google Map block zoom // .sqs-block-map { pointer-events: none; }
Key Takeaways
Scroll zoom on Google Maps can interfere with page navigation.
Adding a simple code block disables zoom until the user clicks.
This improves usability and creates a cleaner user experience.
FAQs
Will this affect how the map loads?
No, the map will still display normally and be fully interactive when clicked.
Can I re-enable zoom if needed?
Yes, simply remove or comment out the script to restore default behavior.
Does this work on mobile?
Yes, but mobile interactions are different. This mainly improves scroll behavior on desktop.
Conclusion
Disabling scroll zoom on Google Map blocks in Squarespace 7.1 helps prevent unwanted user interaction and keeps your layout user-friendly. With a few lines of JavaScript, you can control how users engage with your map and improve the overall browsing experience on your site.
