How to hide a Squarespace website while working on it

Squarespace sites are always visible to the public. This means that your site your visitors will see the unfinished weirdness if they visit your site while you're editing it.
 

Method 1

If you're editing page content you can create a duplicate of the page. Edit the duplicate and once finished delete the original page, insert the duplicated page to main nav, change it's name and url to what the original page was.

Method 2

For larger Design/Content edits you can use the following script to tell visitors that the site is going through an update.

Paste the code below to Settings --> Advanced --> Code injection --> Header
Edit parts of the code to create a message (and style) you like. 


<script>
editmodeEnabled = "yes";  //yes or no
  
//EDIT TEXT CONTENT HERE
siteDisabledContent = "<div style='text-align:center; margin-top:20%;'><h1>Website is down for service</h1><p>We'll be back online shortly.<br>You can contact us at email@example.com</p></div>";  
    
Y.on('domready', function () {
    if (editmodeEnabled =="yes" ) {
        if(window.location.href.indexOf("squarespace.com") > -1) {//admin
    } else { //public
      Y.one('#site').remove();
          Y.one('body').setContent(siteDisabledContent);
    }
    };
});
</script>


I added a yes/no switch so you don't have to come back here to copy-paste it again for new edits. Just switch it off with editmodeEnabled = "no";

How it works:
If you're editing your site the url is something like firstname-lastname.squarespace.com and the live site is example.com. This script checks if the url contains squarespace.com. If it does, it means it's you editing the site. If it doesn't, it means it's a user visiting the site.

Need help with your Squarespace site?
Get in touch at contact@voxpopagency.com