How to Use the Preview Area on Squarespace - dummies

How to Use the Preview Area on Squarespace

By Kris Black

In the Preview area on Squarespace, you can see how your site will look to site visitors — without having to log out from managing your website. While you’re previewing your site, a floating toolbar appears in the lower right of your website. The first two icons on the toolbar — Content and Style — are the Preview editing modes. The final icon, the gear icon, takes you to Site Manager.


Content mode

Selecting the pencil icon while in Preview switches the screen to Content mode. In Content mode, you can use some of the same features in Content Manager, described next.

Some templates enable you to also add blocks in certain areas in the layout of your site just like you add blocks to pages in Content Manager. These layout areas, which are indicated by a dotted outline, are not accessible from Content Manager and can be edited only in Content mode. Use the plus sign button in the lower-right corner of an editable area to add a block.

For example, depending on your template, you may be able to add blocks to your site’s footer, a sidebar, or to the top of your page.


If you want to modify the content of a page, you need to switch to Content Manager. Simply click the Manage Page button in the Preview toolbar while in Content mode, and you will immediately exit Content mode and go to Content Manager within Site Manager.

Site Manager is an area of your site hidden from site visitors where you can administer site settings and configurations. In Site Manager, you can

  • Add content to your pages

  • Manage your blog’s content

  • Update a gallery page

  • Check your site traffic statistics

  • Configure sitewide settings

  • Manage your store

Is the Preview toolbar covering something you want to see on your site while in Content mode? You can move the toolbar by simply dragging it.

To exit Style mode or Content mode while still viewing your website, click the x in the Preview toolbar. To get to Site Manager, click the gear icon in the Preview toolbar. And Site Manager will lead you to our next topic of discussion, Content Manager.

Style mode

To modify your site’s template, select the paintbrush icon to switch to Style mode. Style Editor slides into view on the left side of your site, allowing you to use an intuitive set of controls to modify select elements determined by the current template.


You can add CSS code in Style Editor and see how that code renders your site in real time.