Domains & Redirects
When you're ready to take your site live, make sure you have your domains setup properly on both Framer and Shopify.
In this doc, we will:
Overview
Overview
Overview
Like any two separately hosted sites, Framer and Shopify cannot share a single domain. Each must use its own domain or subdomain to function properly.
In most cases, your root domain (e.g., storename.com) should point to your Framer site.
When using Framer Commerce, Shopify treats your Primary domain as your Checkout URL—so it cannot be the same as your root domain. Instead, set it to either:
Your default storename.myshopify.com, or
Your default storename.myshopify.com, or
Your default storename.myshopify.com, or
A custom subdomain for better brand consistency, such as checkout.storename.com
A custom subdomain for better brand consistency, such as checkout.storename.com
A custom subdomain for better brand consistency, such as checkout.storename.com
Creating subdomains for Checkout & Accounts
Optional, but recommended for brand consistency.
Creating subdomains for Checkout & Accounts
Optional, but recommended for brand consistency.
Creating subdomains for Checkout & Accounts
Optional, but recommended for brand consistency.
1
Access your domain registrar's DNS settings
1
Access your domain registrar's DNS settings
1
Access your domain registrar's DNS settings
2
Add a new CNAME record
2
Add a new CNAME record
2
Add a new CNAME record
3
Set the name field
We suggest short and descriptive names like "checkout" and "account".
3
Set the name field
We suggest short and descriptive names like "checkout" and "account".
3
Set the name field
We suggest short and descriptive names like "checkout" and "account".
4
Set the data field
Use "shops.myshopify.com" to point to Shopify. If your provider requires an IP address, use 23.227.38.65.
4
Set the data field
Use "shops.myshopify.com" to point to Shopify. If your provider requires an IP address, use 23.227.38.65.
4
Set the data field
Use "shops.myshopify.com" to point to Shopify. If your provider requires an IP address, use 23.227.38.65.
5
Set the TTL to 1 hour
5
Set the TTL to 1 hour
5
Set the TTL to 1 hour
6
Repeat steps 2-5 for your other subdomain
6
Repeat steps 2-5 for your other subdomain
6
Repeat steps 2-5 for your other subdomain
Set Shopify Checkout URL (Primary domain)
Connect your subdomain or MyShopify domain to the URL displayed on your Shopify checkout screen.
Set Shopify Checkout URL (Primary domain)
Connect your subdomain or MyShopify domain to the URL displayed on your Shopify checkout screen.
Set Shopify Checkout URL (Primary domain)
Connect your subdomain or MyShopify domain to the URL displayed on your Shopify checkout screen.
1
On your Shopify dashboard, click on "Settings"
1
On your Shopify dashboard, click on "Settings"
1
On your Shopify dashboard, click on "Settings"
2
Click on “Domains” tab on the sidebar on the left
2
Click on “Domains” tab on the sidebar on the left
2
Click on “Domains” tab on the sidebar on the left
3
Add your new Checkout subdomain (if applicable)
3
Add your new Checkout subdomain (if applicable)
3
Add your new Checkout subdomain (if applicable)
4
Set the subdomain or MyShopify domain as Primary
Remember, do not select the same domain as what you are pointing to Framer.
4
Set the subdomain or MyShopify domain as Primary
Remember, do not select the same domain as what you are pointing to Framer.
4
Set the subdomain or MyShopify domain as Primary
Remember, do not select the same domain as what you are pointing to Framer.
Set Shopify Accounts URL
After you've setup your New Customer Accounts on Shopify, you can set your subdomain.
Set Shopify Accounts URL
After you've setup your New Customer Accounts on Shopify, you can set your subdomain.
Set Shopify Accounts URL
After you've setup your New Customer Accounts on Shopify, you can set your subdomain.
1
On your Shopify dashboard, click on "Settings"
1
On your Shopify dashboard, click on "Settings"
1
On your Shopify dashboard, click on "Settings"
2
Click on “Domains” tab on the sidebar on the left
2
Click on “Domains” tab on the sidebar on the left
2
Click on “Domains” tab on the sidebar on the left
3
Add your new Account subdomain
3
Add your new Account subdomain
3
Add your new Account subdomain
4
Set this new subdomain as your Accounts domain
4
Set this new subdomain as your Accounts domain
4
Set this new subdomain as your Accounts domain
Set your domain on Framer
Set your domain on Framer
Set your domain on Framer
1
Go to the ”Domains” page in your Site Settings and select “Connect a domain you own”.
1
Go to the ”Domains” page in your Site Settings and select “Connect a domain you own”.
1
Go to the ”Domains” page in your Site Settings and select “Connect a domain you own”.
2
Enter your domain and update the DNS records provided by Framer in your domain provider’s DNS settings.
2
Enter your domain and update the DNS records provided by Framer in your domain provider’s DNS settings.
2
Enter your domain and update the DNS records provided by Framer in your domain provider’s DNS settings.
For more info, visit How to Connect a Custom Domain on Framer's help desk.
Note: If your domain is managed by Shopify, you'll need to migrate it to another domain host (Namecheap, GoDaddy, etc.) to point to Framer. For more info, visit Transferring Shopify-managed domains to another store or domain provider on Shopify's help desk.
Redirect & hide your native Shopify site
You'll want to ensure customers return to your Framer site from checkout and emails by setting up redirects. You can also prevent your native Shopify store from appearing in search results by blocking indexing.
Redirect & hide your native Shopify site
You'll want to ensure customers return to your Framer site from checkout and emails by setting up redirects. You can also prevent your native Shopify store from appearing in search results by blocking indexing.
Redirect & hide your native Shopify site
You'll want to ensure customers return to your Framer site from checkout and emails by setting up redirects. You can also prevent your native Shopify store from appearing in search results by blocking indexing.
1
On your Shopify dashboard, click on "Online Store" and then "Themes"
1
On your Shopify dashboard, click on "Online Store" and then "Themes"
1
On your Shopify dashboard, click on "Online Store" and then "Themes"
2
On your current theme, click on the 3 dots to open the overflow menu, and click "Edit Code"
2
On your current theme, click on the 3 dots to open the overflow menu, and click "Edit Code"
2
On your current theme, click on the 3 dots to open the overflow menu, and click "Edit Code"
3
Make sure you are on your "theme.liquid" file
3
Make sure you are on your "theme.liquid" file
3
Make sure you are on your "theme.liquid" file
4
Paste the code below before the end of the </head> tag
Make sure you replace the placeholder URLs with your domains and do not include any slashes.
4
Paste the code below before the end of the </head> tag
Make sure you replace the placeholder URLs with your domains and do not include any slashes.
4
Paste the code below before the end of the </head> tag
Make sure you replace the placeholder URLs with your domains and do not include any slashes.
{% if request.host == 'primaryshopifydomain.com' %} <style> #redirect-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: white; z-index: 9999; } </style> <div id="redirect-overlay"></div> <script> window.location.replace('https://framerdomain.com'); </script> {% endif %} <meta name="robots" content="noindex" />
Remix OFFSIDE template for free
Just log into Framer to explore how Framer Commerce works, no extra signup.
Stay up to date
Be the first to hear about new templates, features, and offers.
Remix OFFSIDE template for free
Just log into Framer to explore how Framer Commerce works, no extra signup.
Stay up to date
Be the first to hear about new templates, features, and offers.
Remix OFFSIDE template for free
Just log into Framer to explore how Framer Commerce works, no extra signup.
Stay up to date
Be the first to hear about new templates, features, and offers.