Purchase button

API Token

API Token

Price

Domain

Domain

Variant selector

Domain

Domain

Quantity selector

Domain

Domain

Inventory label

Domain

Domain

Selling plans

API Token

API Token

Cart quantity counter

API Token

API Token

Cart overlay trigger

Domain

Domain

Cart product card

Domain

Domain

Cart subtotal

Domain

Domain

Checkout button

Domain

Domain

Currency selector

Domain

Domain

Configure your Shopify store

Learn how to set up your Shopify store to work with Framer.

In this doc, we will:

Install a Headless Shopify App

We'll first install a Headless Shopify App to establish a connection and give the necessary permissions to use your store off the native Shopify platform.

You can simply install the official Headless app if you have a Shopify Basic plan or above. If you have a Starter plan, you'll have to create your own custom app.

Install a Headless Shopify App

We'll first install a Headless Shopify App to establish a connection and give the necessary permissions to use your store off the native Shopify platform.

You can simply install the official Headless app if you have a Shopify Basic plan or above. If you have a Starter plan, you'll have to create your own custom app.

Install a Headless Shopify App

We'll first install a Headless Shopify App to establish a connection and give the necessary permissions to use your store off the native Shopify platform.

You can simply install the official Headless app if you have a Shopify Basic plan or above. If you have a Starter plan, you'll have to create your own custom app.

Shopify Basic+

Shopify Starter

Step 1

Install the Headless app

Open the Headless Shopify app on your desired Shopify store and click "Install".

Step 2

Click on “Create storefront”

Step 3

Beside Storefront API, click on “Manage”

Step 4

Copy your Public Access Token

Store it somewhere accessible so you can paste it later in your Framer Commerce store.

Shopify Basic+

Shopify Starter

Step 1

Install the Headless app

Open the Headless Shopify app on your desired Shopify store and click "Install".

Step 2

Click on “Create storefront”

Step 3

Beside Storefront API, click on “Manage”

Step 4

Copy your Public Access Token

Store it somewhere accessible so you can paste it later in your Framer Commerce store.

Shopify Basic+

Shopify Starter

Step 1

Install the Headless app

Open the Headless Shopify app on your desired Shopify store and click "Install".

Step 2

Click on “Create storefront”

Step 3

Beside Storefront API, click on “Manage”

Step 4

Copy your Public Access Token

Store it somewhere accessible so you can paste it later in your Framer Commerce store.

Get your Shopify Domain

Using a default or customized "MyShopify" domain is a fast and easy way to get started, however this domain will be displayed on your checkout screen, and may not be ideal when it’s time to launch.

We recommend using a custom subdomain (i.e. checkout.yourdomain.com) and using re-directs. This can always be done later.

Get your Shopify Domain

Using a default or customized "MyShopify" domain is a fast and easy way to get started, however this domain will be displayed on your checkout screen, and may not be ideal when it’s time to launch.

We recommend using a custom subdomain (i.e. checkout.yourdomain.com) and using re-directs. This can always be done later.

Get your Shopify Domain

Using a default or customized "MyShopify" domain is a fast and easy way to get started, however this domain will be displayed on your checkout screen, and may not be ideal when it’s time to launch.

We recommend using a custom subdomain (i.e. checkout.yourdomain.com) and using re-directs. This can always be done later.

MyShopify Domain

Custom Domain

Step 1

On your Shopify dashboard, click on "Settings"

Step 2

Click on “Domains” tab on the sidebar on the left

Step 4

Copy your ".myshopify.com" domain

Store it somewhere accessible so you can paste it later in your Framer Commerce store.

MyShopify Domain

Custom Domain

Step 1

On your Shopify dashboard, click on "Settings"

Step 2

Click on “Domains” tab on the sidebar on the left

Step 4

Copy your ".myshopify.com" domain

Store it somewhere accessible so you can paste it later in your Framer Commerce store.

MyShopify Domain

Custom Domain

Step 1

On your Shopify dashboard, click on "Settings"

Step 2

Click on “Domains” tab on the sidebar on the left

Step 4

Copy your ".myshopify.com" domain

Store it somewhere accessible so you can paste it later in your Framer Commerce store.

Framer Commerce

Product

Templates

Pricing

Log in

Sign up free

Framer Commerce

Product

Templates

Pricing

Log in

Sign up free

Framer Commerce

Product

Templates

Pricing

Log in

Sign up free