Switching your Squarespace site from version 7.0 to 7.1 is more than a routine site update; it's the perfect opportunity to refine your designs and explore the expanded capabilities exclusive to the latest version of the platform. Among other features, 7.1 is powered by Fluid Engine, the game-changing drag-and-drop site editor that empowers unprecedented design flexibility. Plus, Squarespace now supports a smooth transition with a dedicated, automatic update tool. If you’re managing client sites that currently operate on 7.0, this switch is a great opportunity to re-engage past clients and pitch rebuilds that make full use of cutting-edge features.

Use the dedicated update tool

The first step toward a more dynamic, responsive, and engaging web presence begins with using the update tool. In most cases, this tool supports a seamless switch that preserves a site’s structure and information related to search engine optimization (SEO), orders, sales, customer data, members, domains, and subscriptions. While the experience is designed to be intuitive, it’s worth taking a moment to familiarize yourself with the details. Switching to 7.1 is a non-reversible process, but thankfully, you can preview changes and cancel at any time before you publish. 

When you update a Squarespace site to 7.1, you unlock greater design flexibility along with features like scrolling blocks to introduce more animation and auto layouts that help arrange sets of content.

Lay the groundwork 

Any 7.0 site can migrate to 7.1 with a little groundwork. If you have lots of data, content, order information, settings, or domains, the update tool can save you time. Cover pages will be altered to automatically hide headers and footers, which you can unhide in a few clicks. Album pages also won’t carry over to the new version, so save those assets on your computer before making the transition. 

Preview your 7.1 site

Now that you’ve laid the groundwork, you can get started with version 7.1. Go to the Home menu and select Website, Design, and then Update to version 7.1. Review the updated information and follow the steps. You can review, add content, and make stylistic changes to your site during the preview phase. Remember that if you’re not happy with the styling, you can cancel the preview at any time.

Get to know styling in 7.1

Version 7.1 is all about offering you more creative control without giving you more work. Where version styling options for 7.0 sites varied by template, in 7.1, all sites share the same template—meaning there’s no limit to your styling options. You can make site style changes globally or at a more granular local level. 

Styling your Squarespace website

In version 7.0, site styles combine everything—sizes, fonts, and colors—into one panel. In version 7.1, those options are organized into different submenus for greater control. Where possible, the update tool substitutes your current settings with their closest 7.1 counterparts, but you can still explore the expanded range of options in your preview session. 

Migrate your site manually

If you prefer to do the site transition manually, need to make specific secondary adjustments, or want to familiarize yourself with the differences between versions 7.0 and 7.1, the following outlines the basics of switching to the latest version.

Start with fonts

Most of the same fonts from the version 7.0 Squarespace site are available on 7.1. You can set the heading, paragraph, button, and more text to your preferred font family. Then you can edit the font size, weight, and more for each set of text using site styles. To customize individual items even more, select Assign styles at the bottom of your font menu. If you want your newsletter footnote to be all uppercase, assign it! Want to use a fancy handwriting font for your quote block? Assign that custom style directly in the font menu.

Pro tip: Create a style guide. This can be a single unlinked page that has all the elements—headings, content blocks, etc.—you plan to use on the site. This page can serve as a style guide, where you can review how your style choices render across the varying elements of the website and how they look together.

Work with color themes

In version 7.0, there's one main style menu for editing colors. In version 7.1, you have 10 different color themes, and you can use them all on a single page. Here’s how you manually move the colors from your old site to this newest version of Squarespace.

Start by setting your color palette to the main colors you use on your 7.0 site. You can paste the color value (such as HSL, HEX, or RGB) into the value field to get an exact match. Then it’s time to get really creative. You can assign a unique color to an element when editing an individual color theme. Select the circle of color next to the item you want to change, use the color picker to select a color, or enter a color code to assign something completely different. Keep in mind: if you do change your color palette later, that unique color stays the same, so make a note of anything you assign a unique color to.

Pro tip: Think about juxtaposing two color themes that use the same background color, but alternate font colors, button colors, and other elements. Using the two themes in neighboring sections creates eye-catching variation.

Planning your pages

You can use version 7.1's feature, page sections, to create full-width sections of content across all standard pages on your site. These sections are much more flexible and customizable than the index pages available in the Brine theme.

There's an amazing array of premade sections available that are completely customizable. List and gallery sections feature specific layouts that reformat automatically when you add more content. All other page sections can feature any content block available on Squarespace. You can also add a collection page to include a specialized section for blog posts, products, events, or portfolio images.

From images to forms, text, and audio, all the content blocks can be added, removed, and used to create customized layouts by dragging and dropping the content where you want. When switching your site, consider redesigning your older page layouts in version 7.1 because Fluid Engine offers many more options.

Page section settings

Standard page sections now offer more flexibility than the site width setting found in version 7.0. You can assign small, medium, and large height and width to any specific section, and adjust the alignment accordingly. This is great for featuring content over a background image. You can also set a background to full width or inset.

Migrating Brine and Bedford index pages and banners

You can recreate Banners in version 7.1. Upload the background image to your page section settings, and then add a text block or button in the section itself. You can also recreate Bedford's slideshow banner with a slideshow gallery section.

You can similarly recreate Index pages using either page sections (for stacked index page layouts) or portfolio pages (for grid index page layouts). Upload your background image (if you want one) to the page section settings, and then add any content blocks you want to place over that image. Stack multiple sections to achieve the same effect as a stacked index page.

Pro tip: Use different color themes to create unique looks for your recreated index pages. Create custom color overlays and unique font and button colors to make content pop when displayed over the image background that you added.

New features of 7.1 websites

Portfolios are a versatile collection type available in 7.1, which is particularly flexible when it comes to layouts. Portfolios act like a folder that holds individual project pages in nested navigation (e.g., yoursite.com/portfolio/project). 

Similar to thumbnail indexes in version 7.0, portfolios feature a list of projects, and those projects have pagination for navigating between them. Add page sections to the landing page and individual project pages, so you can customize the content like a standard version 7.1 page. This type of collection page is a great way to organize case studies or free training series. There are a lot of creative ways to restructure your content from version 7.0. 

Another feature exclusive to version 7.1 is list sections. This section features content in a new way. List sections can have images, text, and buttons that you can scroll through manually or automatically. This can replace those DIY summary blocks you’ve created out of hidden blogs, and they can be used like image gallery blocks from version 7.0 but with even more features like text and individual item buttons.

Learn more about key version 7.1 differences such as Courses, Video Collections, and commerce features, including nested categories and updated product limits.

Let’s talk about SEO

While you're evaluating how amazing your content can be with these new page sections, portfolios, and more, migrating all of that content is the perfect time to reevaluate your SEO strategy for every page. Take the time to compress your images, label them with proper alt tags for accessibility, and reindex your site once you publish so search engines see all your hard work. Check out our SEO guide for more tips and suggestions.

Your checklist

Now that you have more options for layouts, site styles, page types, and the opportunity to optimize your clients’ sites, it’s time to leap. Whether you’ve decided to rebuild sites on 7.1 from scratch or to transfer manually, the following checklist can make the new site even better.

• Pick any template to start with. To save time, choose one from Squarespace’s template store with a similar site setup or one you’ve created with Squarespace Blueprint AI 

• Assign fonts to headings, paragraphs, and buttons, exploring the Assign styles options for more customization

• Create a color palette based on the main site's colors

• Consider pairing color themes for more flexibility

• Assign unique colors to elements inside individual color themes

• Recreate pages with even more flexible layouts using page sections 

• Page sections can replace stacked index pages with unique background images and colors

• Consider using portfolios to organize related page content like case studies or services

• Use this migration as a chance to optimize site content for SEO

Whether you’re updating your own Squarespace website from version 7.0 to 7.1 or helping clients make the switch, Squarespace’s new flow automates and streamlines the process. The migration tool makes it possible to maintain each site’s content and data while unlocking the platform’s newest features like Fluid Engine and Courses. Now is a great time to contact clients who still operate version 7.0 websites and pitch your migration services.

This post was originally written by Circle member, Becca Harpain, from Inside the Square. It has since been updated to reflect new features and tools.

Want more?

Check out Squarespace Circle, Squarespace’s program for professional designers. Along with exclusive content, discounts, and other perks, Circle brings professionals together from all across the globe to exchange advice while connecting with new clients and collaborators.