Migrate, instantly!
With Smootify, you can seamlessly continue building your custom branded storefront on Webflow while Shopify manages your robust ecommerce backend.
Keep your work safe
Thanks to this guide, you can migrate your Webflow Ecommerce projects to Shopify without losing your work or your data.
Automatic Import
With our Webflow Ecommerce CSV Converter, you can effortlessly import your products into Shopify in seconds, without writing a single line of code.
Easily conversion
You just need to replace a few elements of your design with our pre-made components to have your store fully integrated with Shopify.
Always synced
Smootify keeps Webflow and Shopify in sync at all times, so you never have to update your items manually. Design in Webflow, manage with Shopify.
1. Create a Shopify Store
In this guide, we'll walk you through the simple steps to transform your Webflow Ecommerce project into a Shopify store.
You'll be able to preserve all the hard work you've put into your Webflow design without losing a thing, thanks to Smootify!As a first step, if you want to carry out this migration without any downtime, we recommend duplicating your Webflow project and working on the copy.
Before we dive into setting up your project, let's do a quick overview of Shopify and its key areas. If you're a freelancer, agency, or simply manage multiple stores for clients, we recommend creating a Shopify partner account. With a partner account, you can manage all your stores from a single login and of course, test Smooify for free by creating a development store.
Here is a brief summary of the key steps. Click on the hotspot to remember and execute them correctly in your project.
2. Connect with Smootify
The second step is to create a Smootify account and install the official Shopify App. Start by clicking "Launch" to create your Smooify account. After logging in, install the Shopify app to connect your Shopify store to Webflow. Simply click "Install app" and you'll be taken to the Shopify App Store. Select the Shopify store you want to connect to Webflow and click the "Install" button. You'll be automatically redirected to your store's dashboard where you'll be prompted to install the Smooify app. Click "Install.” Once complete, you'll be redirected back to the Smooify dashboard where you'll be asked to connect your Webflow project.
Here is a brief summary of the key steps. Click on the hotspot to remember and execute them correctly in your project.
3. Migrate Webflow Products to Shopify
Once connected, the first step is to migrate your products from Webflow to Shopify. To do this, simply go to the Ecommerce section in your Webflow designer and click on Products. In the top right corner, you'll find the export button to export your products to a CSV file. Categories will be automatically imported into Shopify, so there's no need to export them, while orders, discounts, and subscriptions cannot be imported. Discounts and subscriptions will need to be added manually, and we recommend saving an exported CSV of your orders before going live with the new project.
Here is a brief summary of the key steps. Click on the hotspot to remember and execute them correctly in your project.
4. Create new CMS collections
Before syncing the Webflow and Shopify CMS, we need to create the correct CMS collections in the new Webflow project we're creating. Again, we can automate this entire process very quickly using another Smootify tool. Return to the Smootify dashboard, select your project, and go back to the tools section
Here is a brief summary of the key steps. Click on the hotspot to remember and execute them correctly in your project.
5. Sync Webflow CMS & Shopify
Once you've saved the changes, the CMS structure is complete, and we're ready to sync the Webflow CMS with Shopify. You can do this with either the Free or Lite plan with the Smootify Desktop App, or fully automatically with the Server plan.
Here is a brief summary of the key steps. Click on the hotspot to remember and execute them correctly in your project.
6. Customize the Webflow Project
Now that all products and collections have been successfully imported and synced to Shopify, we can focus on customizing your Webflow project.To complete the migration from Webflow Ecommerce to Shopify, you need to replace all native Webflow Ecommerce components with Smootify ones.
Here is a brief summary of the key steps. Click on the hotspot to remember and execute them correctly in your project.
7. Domains & Redirects
Once you've finished customizing your new Webflow project, the final step is to go live. To do this, you'll need to associate your custom domain with your Webflow project.
Here is a brief summary of the key steps. Click on the hotspot to remember and execute them correctly in your project.
8. Setup the Headless App
The Headless App, besides being crucial for the correct system setup, will enable important features such as receiving order confirmation emails and the proper activation of customer accounts.
