All posts
Platform migrations

Shopify to Webflow: Moving a Brand Site (Not the Store)

Shopify to Webflow migration for brand sites: when to move content to Webflow or Framer, keep checkout on Shopify, and which domain setup protects your SEO.

By Mehdi Hassan8 min read

The short answer

A Shopify to Webflow migration rarely means moving the store. The common, safer pattern is to move the brand site, meaning home, story, journal and campaign pages, to Webflow or Framer, and keep products, cart and checkout on Shopify. Move the store itself only if your catalog and operations are simple enough for Webflow Ecommerce.

Key takeaways

  • Most brands should use both: Webflow or Framer for brand and content, Shopify for commerce.
  • Moving the whole store to Webflow Ecommerce suits small catalogs with simple operations only.
  • Choose the domain setup first: brand site on the root and shop on a subdomain is the simplest.
  • Every page that changes domain or path needs a one-to-one 301, including blog posts.
  • Shopify's Buy Button or links to product pages connect the brand site to the store.

Part of Headless Shopify: When It's Worth It and When It's Not

Should you move from Shopify to Webflow, or use both?

Most brands should use both: Webflow or Framer for the brand and content site, Shopify for products, cart and checkout. That split gives marketing a visual builder with full design control and keeps commerce on a platform built for it. Moving the store itself to Webflow only makes sense for small catalogs with simple fulfillment and few apps.

The reason this question comes up is usually frustration with the theme. Brand pages feel boxed in by sections, the journal is hard to design, and campaign pages need a developer. Those are front-end problems, and you can solve them without touching your commerce stack. Going fully headless is the heavier alternative, which our hub on when headless Shopify is worth it weighs in detail.

What does a Shopify to Webflow migration involve?

A Shopify to Webflow migration for a brand site involves rebuilding your non-product pages in Webflow, moving blog content into the Webflow CMS, choosing a domain setup and redirecting every changed URL. Products, collections, customers and orders stay in Shopify. Nothing about checkout changes.

Moves to Webflow or Framer

Stays on Shopify

Home page and brand story

Products, variants and inventory

About, team and press pages

Collections and product pages

Journal, guides and blog posts

Cart and checkout

Campaign and launch pages

Customer accounts and orders

Wholesale, stockist or careers pages

Apps for reviews, subscriptions and fulfillment

There's no automated converter for any of this. Theme pages are rebuilt by hand in Webflow, and Shopify blog posts come across through an export and CSV import, with images re-uploaded. Plan the copy and structure before the build rather than recreating the old theme pixel for pixel.

When should you move the whole store to Webflow?

Move the whole store to Webflow Ecommerce only when your catalog is small, your operations are simple and design control matters more than commerce features. Webflow's ecommerce is capable for straightforward shops, but Shopify's app ecosystem, payments, subscriptions, markets and fulfillment integrations are much deeper.

Pros

  • One platform for design, content and commerce
  • Full visual control over product and collection pages
  • Fewer tools to pay for and log into
  • Good fit for small catalogs and limited-run or launch-style drops

Cons

  • A far smaller app ecosystem than Shopify
  • Subscriptions, bundles, B2B and multi-market selling are harder or need workarounds
  • Product data, customers and order history have to be migrated
  • Moving off later is another full migration

If you're running subscriptions, selling in several countries, or depend on more than a handful of Shopify apps, keep the store on Shopify. Check Webflow's current ecommerce plan pages for item and feature limits before deciding, because they change.

Which domain setup should you use for Webflow and Shopify together?

The simplest setup puts the brand site on your root domain in Webflow and the store on a shop subdomain in Shopify. It's easy to configure, each platform owns its own domain, and nothing needs a proxy. The table compares the main options.

Setup

How it works

Best for

Watch out for

Brand on root, shop on subdomain

brand.com on Webflow, shop.brand.com on Shopify

Content-led brands

Product URLs change, so redirect them

Shop on root, content on subdomain

brand.com on Shopify, stories.brand.com on Webflow

Commerce-led brands with a big journal

Content authority sits on a subdomain

One domain with a reverse proxy

Paths routed to each platform behind one domain

Teams with engineering support

Complex to set up and fragile to maintain

Buy buttons only

Products embedded in Webflow pages

Small catalogs, launches

Limited cart and account features

If your store currently ranks well on its root domain, keeping Shopify on the root and putting new content on a subdomain avoids moving product URLs at all. If content is your main traffic driver, the brand site on the root usually makes more sense. Platform-specific options for running two builders on one domain are covered in our guide to the Shopify and Framer hybrid setup.

How do you connect a Webflow site to a Shopify store?

You connect them with links, embedded buy buttons or an API integration, in rising order of effort. Most brands start with links and add more only where a page truly needs it.

  1. Link to product pages. Brand and journal pages link straight to Shopify product pages. It's simple, keeps one cart and is easy to track.
  2. Embed Shopify's Buy Button. Shopify's Buy Button channel lets you embed products and a cart on any site, including Webflow pages, for launch pages and shoppable stories.
  3. Pull products through the API. For live prices, stock or product grids, developers use the Storefront API. This is where you start building a light headless front end.

Keep navigation and design consistent across both sites so shoppers don't feel the handoff. Match the header, fonts and colors, and make the cart icon on the brand site link to the Shopify cart. Forms and other integrations on the brand side follow the patterns in our guide to forms and integrations on marketing sites.

Hypothetical example: a coffee brand splits its site

For example, suppose a coffee subscription brand has a Shopify theme with a large brewing guide section that's hard to design and slow to update. The team moves the home page, brewing guides and origin stories to Webflow on the root domain, and keeps the store on shop.brand.com.

Each guide links to the relevant products, and a few launch pages embed Shopify buy buttons. All old guide and product URLs get one-to-one 301s. Subscriptions, apps and checkout don't change at all, because they never left Shopify.

How do you protect SEO during the move?

You protect SEO by keeping every URL that matters reachable, either at the same address or through a single 301, and by moving content, titles and metadata across intact. A brand-site migration is lower risk than a store migration, but blog posts and product URLs that change domain are where traffic gets lost.

  • Crawl the Shopify store and export every URL before you begin.
  • Build a redirect sheet mapping each changed URL to its new home, then add the rules to Webflow and Shopify.
  • Carry over titles, meta descriptions, headings and image alt text for every moved page.
  • Submit both sitemaps in Search Console and check coverage after launch.
  • Measure page speed on the new site; our guide to Core Web Vitals on Framer, Webflow and Next.js has the platform fixes.

If you plan to test new layouts after launch, our guide to A/B testing in Framer, Webflow and Next.js covers the options on each builder.

Is Webflow or Framer better for a Shopify brand site?

Webflow is better when the brand site has a large, structured content library and several editors; Framer is better when speed of design and launching campaign pages matters most. Both pair well with Shopify through links and buy buttons, and both give marketing full visual control.

If you'd rather the brand site live in code, a Next.js site gives you the most flexibility and a clear path to a headless storefront later, which our comparison of Shopify Hydrogen vs Next.js covers. Whatever you choose, the principle holds: let the brand site be great at story and content, and let Shopify be great at selling.

Frequently asked questions

Can I export my Shopify theme to Webflow?
No. There's no tool that converts a Shopify theme into a Webflow site, because Liquid templates and Webflow's visual builder work in completely different ways. Pages have to be rebuilt in Webflow. Blog content can be exported from Shopify and imported into the Webflow CMS by CSV, though images and formatting usually need cleanup. Treat the move as a chance to improve structure and copy.
Will splitting my site across Shopify and Webflow hurt SEO?
Not if you set it up carefully. Search engines treat a subdomain as closely related but somewhat separate, so put the content that earns most of your traffic on the domain you want to strengthen. Redirect every moved URL one-to-one, link the two sites to each other clearly and submit both sitemaps. Most problems come from missing redirects, not from the split itself.
Can I use one cart across Webflow and Shopify?
Yes, if the Webflow side uses Shopify's Buy Button or the Storefront API, because both add items to the same Shopify cart and checkout. If the brand site only links to product pages, shoppers add items on Shopify itself, which also keeps one cart. Avoid running Webflow Ecommerce alongside Shopify, which creates two separate carts and two sets of orders.
How do I track conversions across both sites?
Use the same analytics property on both sites and configure cross-domain tracking if they sit on different domains, so a visit that starts on a journal page and ends in checkout counts as one journey. Shopify reports orders and checkout events. Test the full path from a brand page to a completed test order before launch, and confirm UTM parameters survive the handoff.
Does Framer work with Shopify too?
Yes. Framer sites connect to a Shopify store the same ways Webflow sites do: links to product pages, Shopify's Buy Button embedded on pages, or developer integrations through the Storefront API. Check Framer's current plugin and integration options as well, since they change. Framer suits brands that want to launch campaign and brand pages very quickly with a small team.

· CEO & Design Director

Copywriter, designer and developer, and founder of Designify Studio. Over five years, 60+ projects across 14+ industries, for startups that have raised $300M+.

Want this done for you? Website, $8,000.

A multi-page marketing site, written and designed by us, developed in Next.js and animated. $8,000, one-time, up to 6 pages. Book a free 30-minute call to see if it fits.

Schedule Call