Previewing pages

Review how your site's content appears in various devices and browser windows.

Last updated March 22, 2024

As you edit a page, your changes show on the right side of your screen. This enables you to review your updates without constantly logging in and out or switching between editing and previewing.

Depending on your needs, this might not be enough. For example, if your screen or browser window is small, the preview will show how your site appears on mobile devices instead of computers. You can also check how your site appears on mobile devices with the Squarespace app.

This guide shows you all of the ways you can preview your site as you edit it.

Watch a video

Full preview of pages

How you preview pages depends on if you're editing your site on a computer or in the Squarespace app.

To expand the preview and hide the editing panels, hover over the top-right corner (top-left corner in version 7.0) and click the arrow.

Benefits:

  • Displays a full-screen preview
  • Hides edit annotations
  • Displays page slugs in your browser address bar

Tip

If your site is on version 7.0, the arrow won't appear while you're in the site styles panel. Exit site styles to enter full preview, or temporarily zoom out.

Expansion_arrow.png

To go back to editing your site, click the arrow again.

To preview a page:

  • On a phone, the preview bar appears at the bottom of your screen. Tap the bar to expand or collapse a preview.
  • On an iPad, tap the fullscreen icon to hide the menu and expand the preview page.

To preview or edit the computer version of a page, tap Edit, then tap the computer icon. Tap the content to edit in computer view. Tap the computer icon again to return to mobile view.

Full preview of blog posts

You can preview blog posts similar to pages, either before or after publishing. To preview a blog post:

  1. After creating a blog post, click Save & Publish to make it public, or click Save to save as a draft.
  2. In the side panel, click the post title.
  3. A preview of the post will display to the right. Click the expand arrow in the corner to open the full preview.
  4. Click the arrow again to reopen the side panel.

Device view

Preview how your site appears on different devices with device view.

Incognito mode

To view your site exactly as your visitors view it, visit your site in incognito mode. This can help if your site has embedded code, which may not display when you're logged in.

Zoom out (advanced)

Most browsers give you the option to zoom in or out on a page. Zooming out is a quick way to check what your site looks like in wider browsers.

In most browsers, you can press Ctrl (on a Mac) with the + and - keys to zoom in or out. If this doesn't work, do a web search for zoom and your browser's name and version.

Note

Editing in Squarespace is only supported at 100% zoom. To avoid display and editing issues, always set your browser back to 100%/Actual Size.

Preview changes before making them live

Usually, pressing Save on any change updates your live site immediately. Here are some ways to create content without visitors finding it right away:

Footer Image
  • Get help from our community

  • Get help from our community on advanced customizations.

  • Hire a Squarespace Expert

  • Stand out online with the help of an experienced designer or developer.