Sanity Connect for Shopify

You can install Sanity Connect on the Shopify app store to set up synchronization of your product information to your content lake. This will let you add custom metadata to product information, as well as reference and use product information in your other content.

You can use this content in a custom storefront through headless solutions – such as Shopify’s Hydrogen framework or Next.js – or push your Sanity content back to Shopify to use in a Liquid storefront.

How to install Sanity Connect in your Shopify store and connect it to a project:

• Find Sanity Connect on the Shopify app store and push the Add App button
• If you have multiple Shopify accounts, you need to choose the one that contains the store you want to add the app to
• After choosing the store, Shopify will show you the permissions Sanity Connect needs to work and its data policies. You can push the Install app button to continue.
• The app will ask you to connect to your Sanity account. If you don't have one, you can choose to Create new account.
• When you're logged in, you will need to connect your shop with a project on Sanity. You can choose between existing projects or create a new one (for free).
• Select organization to list out projects under it, and then the project and dataset you want to sync to.
• You are now ready to configure the app.

You might also want to consider using our Shopify asset plugin, which allows you to select assets from your Shopify store in the context of your Sanity Studio, allowing you to serve assets from the Shopify CDN in your frontends.

You can configure how and when Sanity Connect should synchronize products to your content lake, and whether content should be synchronized back to your Shopify store. You can change these options at any time.

When enabled the content you add to products, variants and collections in Sanity will be synced back to your Shopify store.

We will sync the full document to a JSON metafield on the relevant entity in Shopify. Following the sync, you can access this content in Liquid.

Sanity Connect offers two ways to synchronize content from Shopify into your content lake - direct sync and custom sync.

Direct Sync

This will synchronize all products, product variants and collections as documents to your content lake. You can check the reference to preview the data model for these documents.

Custom Sync

This option will let you enter an endpoint that receives updates from Shopify and syncs data to your content lake. Typically that will be a serverless function handler where you can reshape the data and do other business logic as part of the sync.

You may, for example, want to reduce document usage by syncing products but not variants, or sync variants as objects on a product document rather than individual variant documents.

We have further documentation on custom sync handlers including an example serverless function.

Sync data automatically: Automatically sync whenever you save products. Note: The sync will update the Shopify information for both published and draft documents. An update is typically available in your content lake after a couple of seconds.

Sync manually: There will no automatic sync, and you'll have to go into the Sanity Connect settings to trigger a synchronization manually.

The Sanity Connect app can optionally sync collections data. It's turned off by default, but you can enable it with the checkbox in the settings.

You can install a production-ready reference studio that's set up with a great editor experience by running this command in your local shell. Replace PROJECT_ID and DATASET_NAME with those from the project your Shopify store is connected to:

npx @sanity/cli init --template shopify --project PROJECT_ID --dataset DATASET_NAME

You'll find comprehensive documentation for this studio in its README.md.

If you already have set up a studio and want to surface the product, variant and collection documents, then you can go to the reference studio's source code and copy the schema files from there.