Resources

Migrating Your Current Website To Webflow

Brett Berger
December 5, 2022
5 min read
Summary

It’s easier than you might think!

Migrating Your Current Website To Webflow

In today's website ecosystem, there are lots of powerful page builders and website management tools. That being said, whichever tool you might be using now, may not be the best fit for your business. This brings an interesting problem to business owners: Do you tough it out and deal with the shortcomings of your current tool? Or do you bite the bullet and begin the arduous task of migrating your current site over to a new tool? Whichever route you chose, we hope this article sheds some light on the problem and gives your team a clear path forward.


Is it worth moving my old site to a new platform?

The short answer to this question is: Yes. If you're having trouble with your current website platform, there is always another option that will likely solve your current problem and make it easier for your team to manage, all while saving you money. You may also be daunted by the amount of work that is required to move to another tool, but we are here to say that it’s easier than you might think.

However, while we make it easy for you to get started with a new design, there's still some work involved in moving over existing code and content. For example, if you have a WordPress site, you'll need to transfer your database as well as any plugins or themes you're using at the moment. This can be quite a labor-intensive process, as not everything in WordPress is compatible with Webflow. Luckily we've got some tips and tricks that can help make this process easier!

Migrating your website to Webflow is easier than you might think

Migrating your website to Webflow is a multi-step process that involves some technical know-how, but it's easier than you might think. There isn’t much ‘migration’ happening at all. The best approach is to start with a clean slate and build an entirely new site while using the old one as a blueprint. This might seem like the most labor-intensive approach, but because we’re leveraging the power of a no-code tool, it will take a fraction of the time than it would by using a more traditional tool.

The first step is getting an exact copy of your current site into Figma or a similar design tool. This acts as a blueprint for your site and removes any ambiguity during the development process. If you already have this from when the site was initially created, then you’re halfway there!


Using Figma and Relume to cut migration time in half

The next step is to create the prototype in Figma. This will ultimately be imported into Webflow to take over your old WordPress site. You can either start from scratch by creating a new file or use an existing Figma file. If you choose the second option, make sure all font styles and colors are consistent with what's on your current website.

Start by finding components and sections that resemble your current website in the Relume library. This tool is incredibly powerful and is something we use daily. Don’t worry about styling too much at this point, just get a skeleton version of your current site that mimics the same layout and positioning.

Once the wireframe version of your site is complete, you can begin moving over the styling, fonts, copy, and images that are live on your current site. Once the design is complete, you can begin building your site in Webflow. Since all of the layout, styling, copy, and images have already been defined in Figma, the development time in Webflow will be minimal, allowing you to get your site live in days, not weeks.


Webflow Superpowers

The reason we recommend Webflow, and have chosen to build our agency solely around this tool, is its user-first design and hyper flexibility. Anything that you have on your WordPress site can be implemented using Webflow and then some. This is why translating your site into a Figma design is so important as it removes your reliance on plugins, themes, and developers to make updates to your site. Once you have the design of your site in a central place, it can easily be translated into any modern web development tool with ease. This means that if you don’t like one tool, you can easily jump to another until you find the one that best suits your business. 

The real superpower of Webflow is its CMS feature. This provides an intuitive user-friendly interface to manage all of your site's back-end data and content. This phase of the migration would normally be the most arduous step, but because Webflow’s CMS can accept a CSV upload, transferring all of your backend data is as simple as exporting from your existing tool and uploading it to Webflow. 

Webflow's CMS is built with end users in mind; not developers.

In contrast to traditional CMS in which developers build their front-end templates and code, Webflow’s CMS is built with end users in mind; not developers. This makes it easy for non-technical users to create their backend without having to learn any code or pay for expensive database solutions.

The clean, intuitive design of Webflow also makes it an ideal tool for beginners who don’t have a background in web design. Its drag-and-drop interface allows you to customize your website using simple click-and-drop gestures similar to those used on interfaces such as Google Sheets or Excel Spreadsheets.

Migrating is a multi-step process.

As you might imagine, migrating is a multi-step process. Now that we have a Figma design of the current site, and all of the back-end data contained in a CSV file, all that’s left is to transfer the code and interactions of the site.

For more simple websites this process will not be too challenging, but for larger enterprise sites with lots of dynamic content and programmatic functionality, this will be the most time-consuming portion of the migration. Most scripts can be copied and pasted into Webflow, but for anything that uses a plugin, that functionality will have to be rebuilt in Webflow using a scripting language.

Webflow has recently launched a plugin marketplace which means this problem will become less and less apparent, but for anything truly custom, the team at Flow Sparrow would be more than happy to help get you the site of your dreams! 

Conclusion

If you’re thinking about migrating your current website to Webflow, we recommend following the steps outlined above. Following this procedure will ensure that your migration process goes smoothly and you can get on with updating your site as quickly as possible.

If after reading this, you’re still not sure about how or when to migrate your site, we would be more than happy to discuss what that might look like. Drop us a line at info@flowsparrow.com or book a free discovery call below.


Thanks for Reading!

Subscribe to our newsletter

Subscribe to receive the latest blog posts and updates from Flow Sparrow.

By subscribing you agree to with our Privacy Policy.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Migrating Your Current Website To Webflow

In today's website ecosystem, there are lots of powerful page builders and website management tools. That being said, whichever tool you might be using now, may not be the best fit for your business. This brings an interesting problem to business owners: Do you tough it out and deal with the shortcomings of your current tool? Or do you bite the bullet and begin the arduous task of migrating your current site over to a new tool? Whichever route you chose, we hope this article sheds some light on the problem and gives your team a clear path forward.


Is it worth moving my old site to a new platform?

The short answer to this question is: Yes. If you're having trouble with your current website platform, there is always another option that will likely solve your current problem and make it easier for your team to manage, all while saving you money. You may also be daunted by the amount of work that is required to move to another tool, but we are here to say that it’s easier than you might think.

However, while we make it easy for you to get started with a new design, there's still some work involved in moving over existing code and content. For example, if you have a WordPress site, you'll need to transfer your database as well as any plugins or themes you're using at the moment. This can be quite a labor-intensive process, as not everything in WordPress is compatible with Webflow. Luckily we've got some tips and tricks that can help make this process easier!

Migrating your website to Webflow is easier than you might think

Migrating your website to Webflow is a multi-step process that involves some technical know-how, but it's easier than you might think. There isn’t much ‘migration’ happening at all. The best approach is to start with a clean slate and build an entirely new site while using the old one as a blueprint. This might seem like the most labor-intensive approach, but because we’re leveraging the power of a no-code tool, it will take a fraction of the time than it would by using a more traditional tool.

The first step is getting an exact copy of your current site into Figma or a similar design tool. This acts as a blueprint for your site and removes any ambiguity during the development process. If you already have this from when the site was initially created, then you’re halfway there!


Using Figma and Relume to cut migration time in half

The next step is to create the prototype in Figma. This will ultimately be imported into Webflow to take over your old WordPress site. You can either start from scratch by creating a new file or use an existing Figma file. If you choose the second option, make sure all font styles and colors are consistent with what's on your current website.

Start by finding components and sections that resemble your current website in the Relume library. This tool is incredibly powerful and is something we use daily. Don’t worry about styling too much at this point, just get a skeleton version of your current site that mimics the same layout and positioning.

Once the wireframe version of your site is complete, you can begin moving over the styling, fonts, copy, and images that are live on your current site. Once the design is complete, you can begin building your site in Webflow. Since all of the layout, styling, copy, and images have already been defined in Figma, the development time in Webflow will be minimal, allowing you to get your site live in days, not weeks.


Webflow Superpowers

The reason we recommend Webflow, and have chosen to build our agency solely around this tool, is its user-first design and hyper flexibility. Anything that you have on your WordPress site can be implemented using Webflow and then some. This is why translating your site into a Figma design is so important as it removes your reliance on plugins, themes, and developers to make updates to your site. Once you have the design of your site in a central place, it can easily be translated into any modern web development tool with ease. This means that if you don’t like one tool, you can easily jump to another until you find the one that best suits your business. 

The real superpower of Webflow is its CMS feature. This provides an intuitive user-friendly interface to manage all of your site's back-end data and content. This phase of the migration would normally be the most arduous step, but because Webflow’s CMS can accept a CSV upload, transferring all of your backend data is as simple as exporting from your existing tool and uploading it to Webflow. 

Webflow's CMS is built with end users in mind; not developers.

In contrast to traditional CMS in which developers build their front-end templates and code, Webflow’s CMS is built with end users in mind; not developers. This makes it easy for non-technical users to create their backend without having to learn any code or pay for expensive database solutions.

The clean, intuitive design of Webflow also makes it an ideal tool for beginners who don’t have a background in web design. Its drag-and-drop interface allows you to customize your website using simple click-and-drop gestures similar to those used on interfaces such as Google Sheets or Excel Spreadsheets.

Migrating is a multi-step process.

As you might imagine, migrating is a multi-step process. Now that we have a Figma design of the current site, and all of the back-end data contained in a CSV file, all that’s left is to transfer the code and interactions of the site.

For more simple websites this process will not be too challenging, but for larger enterprise sites with lots of dynamic content and programmatic functionality, this will be the most time-consuming portion of the migration. Most scripts can be copied and pasted into Webflow, but for anything that uses a plugin, that functionality will have to be rebuilt in Webflow using a scripting language.

Webflow has recently launched a plugin marketplace which means this problem will become less and less apparent, but for anything truly custom, the team at Flow Sparrow would be more than happy to help get you the site of your dreams! 

Conclusion

If you’re thinking about migrating your current website to Webflow, we recommend following the steps outlined above. Following this procedure will ensure that your migration process goes smoothly and you can get on with updating your site as quickly as possible.

If after reading this, you’re still not sure about how or when to migrate your site, we would be more than happy to discuss what that might look like. Drop us a line at info@flowsparrow.com or book a free discovery call below.


Thanks for Reading!

Share this post

Sign up to get updates

By clicking Sign Up you're confirming that you agree with our Terms and Conditions.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.