Contents :
Boost your IT agility with Nocode Open Source solutions
Download the ebook
Interested in Alegria.academy's Nocode training program?
See the syllabus

How to migrate from Squarespace to Webflow? Guide 2023

Published on
30/3/2023

Squarespace and Webflow are Nocode website building platforms that offer web design and development features. Webflow is more suitable for users who are looking for freedom of customization, while Squarespace is used for its simplicity.

That said, we observe that more and more people want to migrate to Webflow. That's why we thought it would be interesting to write an article on the subject.

Why migrate from Squarespace to Webflow?

  • Page customization: Webflow allows a great deal of customization - without having to code - whereas for Squarespace, a developer will be needed for advanced customization.
  • Active community: Webflow has an active community including a page to showcase users' work, a designer page for freelancers and a very rich forum. Squarespace, on the other hand, does not offer a community space of this weight.

If you want to go further, we have written a complete comparison between these two tools.

Export your content from Squarespace

The steps to follow

Before you start exporting, please save your website so you can go back in case of problems.

To export your content from Squarespace, please follow these steps:

  1. Click on the Settings icon in the lower left corner of the screen.
  2. Click on the Advanced button.
  3. Click on Export/Import.
  4. Select Export.
  5. Click on the Wordpress icon, the file will be exported in Wordpress format but you will be able to import it into Webflow without any problem.
Export from Squarespace to wordpress/webflow
  1. Choose the items you want to export (pages, blog posts, products, etc.).
  2. Click on Export.

An XML file will be created with all the elements you have chosen. This file will contain all the information of your Squarespace site, including text and images.

Then, convert your XML file to a .csv file using an online converter.

Here is a non-exhaustive list of content that can be exported or not.

Content that can be exported

In the list below, you will be able to see all the content that can be exported from your Squarespace site to Webflow.

  • A blog page, including all his articles and up to 1,000 comments per article.
  • Text blocks.
  • Image blocks.
  • Text from other blocks, such as the Embed, Twitter and Instagram blocks, will be exported with minimal structure.
  • Gallery Pages

Content that cannot be exported

Unfortunately, some content will not be available when migrating to Webflow. Here is the list below:

  • Different types of pages such as Album, Cover, Index, Information, Events, Portfolio and Shop.
  • Content of headers, footers and sidebars specific to each page.
  • Multiple Blog pages. The extraction can only be done on one blog. You will have to repeat the operation twice if you have two blogs (which is quite rare).
  • Records.
  • Audio blocks.
  • Product blocks.
  • Video blocks.
  • The drafts.
  • The style parameters.
  • Custom CSS."

Recommendation: during the whole migration process, keep your Squarespace subscription active until your new website is online on Webflow!

Regarding the migration of these elements, we can help you develop them in Webflow. We have worked on more than 50 projects on this tool so we will be able to quickly answer your needs.

Steps to follow for an import on Webflow 

Import your content on Webflow

To import your content into Webflow, you must first create or log into your Webflow account. Once logged in, follow these steps:

  1. Create a new project in Webflow.
  2. Click on the CMS tab in the sidebar.
  3. Click on Import Content.
  4. Select the XML file you exported from Squarespace.
  5. Select the items you want to import (pages, blog posts, products, etc.).
  6. Click on Import.
  7. Webflow will import all your content from the XML file, and you can start working on it in Webflow.
  8. Create a new collection and configure it beforehand
Webflow collection

To conclude this migration, you will need to match the fields of your old collection (the fields come from your .csv file) to those of your new collection in Webflow.

import csv to webflow

Create your design on Webflow

On Webflow, you will create a new design using the tools at your disposal. Use the information you have gathered about your Squarespace design to reproduce the same look on Webflow. 

  • Customize your design: Once you have created your initial design, you can further customize it by adding transition effects, changing colors, typography, and adjusting margins and padding to achieve the desired design.
  • Test your design: Please test it to make sure it is functional and optimized for all devices.

Once again, if you have any doubts or if you wish to save time by delegating, Alegria.solution is here to help you with your project.

Image

When importing images into a CMS like Webflow, it is important to ensure that the images are correctly migrated. There are two cases: 

  1. Images are associated with "image" fields in the CMS
  2. Images are associated with the "rich text" field.

In the first case, the download will be done automatically.

In the second case, the images will be imported from their original URLs, which can be a problem if the original site is deleted. To avoid this, it is advisable to manually download each image from the rich text field and import them to the CMS.

SEO

The sitemap is a key element to improve the natural referencing (SEO) of a website. It allows Google to explore more efficiently the pages of the site and to analyze their content. In short, the sitemap helps Google to better understand the structure and content of your site.

To generate a sitemap on Webflow, follow these 7 steps:

  1. Log in to your Webflow account and access your project.
  2. Click on the sitemap icon in the main menu on the left.
  3. Click on the "Generate" button in the upper right corner of the screen.
  4. Webflow will start generating your sitemap and this may take a few minutes depending on the size of your site.
  5. Once the generation is complete, you can preview your sitemap and see all the links of your website by clicking on "View Site Map" at the top right of the screen.
  6. You can download your sitemap by clicking on the "Export XML" button at the top right of the screen.
  7. Copy the link from your XML sitemap and submit it to Google Search Console or other SEO tools.
sitemap webflow

Redirection

If you have been using custom URLs on your Squarespace site, it is important to redirect those URLs to the new URLs on your Webflow site. For example, if your "About" page had the URL "www.monsite.com/about" on Squarespace, you will need to make sure that page has a new URL on Webflow, such as "www.monsite.com/a-propos".

To redirect old URLs to new ones, you can use 301 redirects. A 301 redirect is a statement that tells web browsers that the URL has been permanently moved to a new URL. 301 redirects ensure that visitors to your site who have saved the old URLs can still access your content without encountering 404 errors.

You can create 301 redirects in Webflow by using the 301 redirects feature in the project settings.

webflow redirection

This step is crucial if you don't want to lose traffic and SEO.

Check your site before publishing it

Before publishing your Webflow site, you must make sure that everything is in order. Here is a non-exhaustive checklist:

  • Check that all pages are working properly, that images and videos are displayed correctly.
  • Test your site on different browsers and devices to make sure it is well optimized and responsive for all types of visitors. 
  • If you are using advanced features such as contact forms, third-party integrations, or complex animations, you will need to test these as well.
  • You can also use performance testing tools like PageSpeed Insight to check that your site loads quickly and has no performance issues. 

Once you are sure that everything is working properly, you can publish your Webflow site and make it available to the public.

Conclusion

Migrating your Squarespace website to Webflow may seem complicated at first. But by following the steps we've outlined, you can successfully migrate your site while preserving your SEO and enjoying the many benefits of the Webflow platform.

Note that migration is a crucial step and it can be difficult to think of all the details to ensure that everything goes as planned.

At Alegria, we have experience in website development with Webflow, with over 50 projects completed in less than 2 years. If you are looking for a service provider to discuss your website creation or migration project, do not hesitate to contact us. We are here to help you achieve your goals.

Why migrate from Squarespace to Webflow?

Cross Icon

Webflow offers several advantages over Squarespace, including better loading speed, more features and customization, and an active community.

How do I export the content of my Squarespace site?

Cross Icon

To export your content from Squarespace, you need to save your website, then follow these steps: click on the Settings icon, select Export/Import, choose the items you want to export and click on the Wordpress icon. Then you can convert your XML file to a .csv file with an online converter.

You can export pages, a Blog page, including all its posts and up to 1,000 comments per post, text blocks, image blocks, gallery pages, and text from other blocks, such as the Embed block, Twitter block, and Instagram block.

Cross Icon

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Some content cannot be exported, such as other page types (including Album pages, Cover pages, Index pages, Information pages, Events pages, Portfolio pages, and Shop pages), content in page-specific headers, footers, and sidebars, more than one Blog page, folders, audio blocks, product blocks, video blocks, drafts, and custom CSS style settings.‍

Cross Icon

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

To import your content to Webflow, you need to create or log into your Webflow account, create a new project, select the CMS tab, click Import Content, select the XML file you exported from Squarespace, choose the items you want to import and click Import. Then, you can create a new collection and configure it beforehand, then create your design on Webflow using the available tools.

Cross Icon

Some content cannot be exported, such as other page types (including Album pages, Cover pages, Index pages, Information pages, Events pages, Portfolio pages, and Shop pages), content in page-specific headers, footers, and sidebars, more than one Blog page, folders, audio blocks, product blocks, video blocks, drafts, and custom CSS style settings.‍

Some content cannot be exported, such as other page types (including Album pages, Cover pages, Index pages, Information pages, Events pages, Portfolio pages, and Shop pages), content in page-specific headers, footers, and sidebars, more than one Blog page, folders, audio blocks, product blocks, video blocks, drafts, and custom CSS style settings.‍

Cross Icon

To import your content to Webflow, you need to create or log into your Webflow account, create a new project, select the CMS tab, click Import Content, select the XML file you exported from Squarespace, choose the items you want to import and click Import. Then, you can create a new collection and configure it beforehand, then create your design on Webflow using the available tools.

Transform
your ideas in project
Bring your projects to life quickly, switch to Nocode!
Become
Nocode expert
Alegria.academy, Europe's first Nocode school
Turn
your ideas into a project
Bring your projects to life quickly, switch to Nocode!
Join
‍‍
Our community
We let you work with the best professional Nocode Makers
on hard-to-reach missions
Would you like to carry out a digital project?
Working with us