❗Heads up: This is not an issue with your CrowdRiff account or map setup. It is a compatibility issue between Squarespace and Google Maps that requires a one-time code fix.
How do I fix the blank map background?
You will add a small piece of code to your Squarespace site's header. This only needs to be done once and automatically applies to every page that has a CrowdRiff map embed.
Log in to your Squarespace admin panel.
Navigate to Code Injection.
Click Settingsin the left sidebar
Click Advanced
Click Code Injection
Add the fix code. In the Header box, paste the following code at the very top before any other code already there. Click the Save button.
<script>
window.__gm_no_vector__ = true;
var _OriginalMap;
var _patchInterval = setInterval(function() {
if (window.google && window.google.maps && window.google.maps.Map) {
clearInterval(_patchInterval);
_OriginalMap = google.maps.Map;
google.maps.Map = function(div, options) {
options = options || {};
options.renderingType = google.maps.RenderingType.RASTER;
return new _OriginalMap(div, options);
};
google.maps.Map.prototype = _OriginalMap.prototype;
}
}, 10);
</script>
What else should I know?
Keep your embed block as-is. Do not remove or edit the CrowdRiff embed on your page. This fix works alongside your existing embed, not instead of it.
This fix covers your entire site. Because it is added to the Header, it automatically applies to every page with a CrowdRiff map embed.
Visitors won't notice any change. The map looks and functions exactly the same. All places, pins, photos, and interactions continue to work normally.
Need more help?
If you have any other questions, feel free to send us a message!