Building Business Websites with Squarespace 7(Second Edition)
上QQ阅读APP看书,第一时间看更新

Understanding the Site Manager interface

The parts of the Site Manager interface can expand/contract depending on the type of activity you are performing. For example, the side panel will automatically expand to accommodate charts when you are viewing your site statistics (and therefore, the Preview screen will shrink accordingly). You can also hide the side panel entirely to fill the screen with your site preview. You can do this using the expansion arrow in the top-left corner of the Preview screen, as shown here:

Clicking on the expansion arrow will:

  • Expand the Preview screen to fill the browser window.
  • Disable all editing tools, allowing you to view and interact with your website just as your public visitors do.

When in fullscreen preview, you will notice that the expansion arrow is still visible in the top-left corner, but the arrow points in the opposite direction. Clicking on the arrow will collapse the Preview screen, revealing the side panel and re-enabling the editing tools. You will toggle between these views a lot when working on your website, so take a moment now to try this. Fullscreen preview is very useful for testing content or design changes, so you can see things exactly as they will appear to your visitors on desktop computers.

Be aware that if you embed code into your pages using advanced customizations, they may not work while you are logged into your site, even in fullscreen preview. We'll cover advanced customizations in Chapter 11, Moving Beyond Standard Squarespace Tools.

You can also preview how your website will appear to visitors who use tablets or mobile devices using Squarespace's built-in Device View. Device View is activated using the short horizontal line that sits above the preview area. If you hover your mouse over the line, it will become a down arrow. Clicking on this arrow will reveal the Device View icons: mobile, tablet, and desktop. You can click on an icon to toggle between the different views. Tablet and mobile views display an outline silhouette of the device around the outside of the Preview screen, as shown in the following screenshot: