What is Squarespace Safe Mode and how to use it?

Custom code injection can elevate your Squarespace site, adding unique functionality and style. However, when something goes wrong—whether it’s a broken layout or unexpected errors—troubleshooting custom code can become a daunting task. This is where Squarespace Safe Mode comes to the rescue.

For example, in one case shared on the Squarespace forum, a custom code snippet shared by me caused a gallery slideshow to autoplay in edit mode, preventing slide editing. By entering Safe Mode, the user was able to disable all scripts temporarily and confirm that the issue stemmed from their custom code. This process allowed them to address the problem without affecting the live site experience.

Safe mode allows you to preview your website without any custom scripts or code injections running, making it easier to pinpoint the source of the issue. Here’s everything you need to know about using Squarespace Safe Mode to diagnose and resolve code-related problems.

Squarespace safe mode

What is Squarespace Safe mode?

Squarespace Safe Mode is a built-in diagnostic tool designed primarily for developers and advanced users. When activated, it temporarily disables all custom code and scripts on your site—but only in your editing environment.

For users visiting your live website, all scripts continue to function normally. This dual environment ensures that you can troubleshoot your site without disrupting the user experience for your audience.

Safe Mode is especially useful when:

• You need to identify the cause of a broken feature or design.

• Troubleshooting conflicts with third-party plugins or custom code injections.

• Verifying how your site looks and behaves in its default state.

How to enter Squarespace Safe mode

Follow these steps to enter Safe Mode directly from your Squarespace dashboard:

1. Open Your Site’s Dashboard: Navigate to your Squarespace site’s dashboard while in editing mode. The default URL should look something like this:

   yoursitename.squarespace.com/config

2. Modify the URL: Add /safe to the end of the URL, so it looks like this:

   yoursitename.squarespace.com/config/safe

3. Hit Enter:
   Once you press Enter, Squarespace will load your site in Safe Mode. A message will confirm that Safe Mode is activated.

Another trick to enter Safe mode: using Ground Control

If you’re using the Ground Control plugin with the Quick Access feature enabled, you can enter Safe Mode even more conveniently. Here’s how:

1. Install Ground Control:
   First, ensure you’ve installed the Ground Control plugin.

2. Activate Quick Access Toolbar:
   Enable the Quick Access toolbar feature from Ground Control’s settings.

3. Use Quick Links to Enter Safe Mode:

   • Hover over the Ground Control icon in your toolbar.

   • Navigate to the Quick Links section under Quick Access.

   • Select Safe Mode from the options.

Entering safemode in Ground Control

This method streamlines the process, saving you time and effort when troubleshooting.

What Happens in Safe Mode?

While Safe Mode is active:

• Custom Code is Disabled: Any code added through Code Blocks, Code Injection, or third-party plugins won’t run in the editor preview.

• Live Website Remains Unaffected: Visitors to your live site won’t experience any interruptions, as Safe Mode only impacts your editor environment.

• Troubleshooting Becomes Clearer: With scripts temporarily disabled, you can determine whether an issue is related to custom code or another underlying problem.

Exiting Safe Mode

Once you’ve finished troubleshooting and are ready to re-enable your scripts, follow these steps to exit Safe Mode:

1. After disabling your custom code, you may notice a message that says, Scripts have been disabled on your site preview.

2. Click on the Enable Scripts in Preview? button to restore all scripts and exit Safe Mode.

This will return your site preview to its original state with all custom scripts running.

Troubleshooting with Safe Mode

Safe Mode is a diagnostic tool, not a permanent fix. Here’s how to use it effectively:

1. Identify the Source:

   • If the issue disappears in Safe Mode, it’s likely caused by custom code or a script conflict.

   • If the issue persists, the problem might lie elsewhere, such as with a template or built-in feature.

2. Check Your Custom Code:

   • Examine any custom code you've added through Code Injection or Code Blocks. Look for syntax errors, missing elements, or conflicts with other scripts.

   • Disable or temporarily remove suspicious code snippets to see if the issue resolves.

3. Repeat as Needed:

   • If you make changes to your code, regenerate the issue in Safe Mode and test again.

Final Thoughts

Squarespace Safe Mode is an invaluable tool for diagnosing and addressing issues caused by custom code. By isolating the problem in a controlled environment, you can maintain the integrity of your live site while troubleshooting behind the scenes.

Whether you’re a seasoned developer or a curious site owner, learning to use Safe Mode can save you time, frustration, and ensure your website remains polished and professional.