Sanity Connect for Shopify Online Stores (ssr)

Written by Even Westvang

Missing Image!

In 2022, we kicked off our Shopify partnership by launching a Sanity integration with Shopify Hydrogen. With the Sanity Connect app, Shopify merchants building Custom Storefronts are able to put more of their unique product data to work to create rich shopping experiences that drive faster conversion and higher lifetime value.

In 2023, we released an update that brings this same value—unlocking Sanity’s composable content approach—to Online Store merchants using Liquid templates. This integration now syncs metafields from Sanity to Shopify so you can easily extend the Shopify content model, or the types of product information you can display to shop visitors. This means key product data that’s unique to your brand, shop, and inventory can now be activated fully and reused easily.

And now this year, Sanity Connect syncs metaobjects from Sanity to Shopify.

Developers can get started by adding the Sanity Connect app to your Shopify Storefront via the Shopify App Store listing page or your store’s admin panel.

Composable Commerce with Shopify and Sanity

Companies like Aether Apparel, Tommy John, and more have adopted Sanity to uplevel their shopping experiences with our composable content approach. Aether saw widespread uplift, including an 11% increase in revenue. “We are seeing increased time on page, time per session, conversion rates, average order value—pretty much every metric you can think of,” said Ashley Brooks, AETHER’s digital and e-commerce operations manager. [Read the case study here].

Composable commerce allows merchants to create additional product information such as materials, sizing, and relevant use cases and treat it as data. With Sanity, you manage all of this composable content centrally, and can call on any given component or object when needed to be rendered across any display you may like, including your Online Store. For example, on a landing page, you might want to expose the materials information alone, whereas on the product detail page, you want to include details about both materials and sizing. You may even suggest similar products that fall within the same use case, like “winter clothing.”

With our latest updates to the Sanity Connect app, Online Store merchants can tell inspiring, insightful stories, unconstrained by the predefined UIs within your store’s admin panel. Sanity provides a flexible single source of truth for content that’s fast for Online Store developers to build and intuitive for merchant editors to work within.

• Deeply expressive product and object metadata: Easily express complex product relationships, like sub variants and relationships between them, to create cohesive shopping experiences that drive faster customer conversion and increased check out values.
• Built for the enterprise: Sanity offers fine-grained role based access control to manage Shopify data, built as an open-source application that you can host anywhere. Data within Sanity is stored with the highest security standards and reliably delivered to any integration point (such as your store’s front end) without sacrificing store performance.
• Intuitive product management: Manage valuable product, collection, and variant metadata using Sanity Studio, a deeply customizable content workspace for your store. This means you can create a content management workspace that accommodates the unique product information you want to surface to shoppers. Within Studio, merchants can collaborate in real time with safeguards like full editing history and field-level rollback.
• Powerful block content editing: Do more with product descriptions using Sanity’s  portable text capability. Whether you want to offer in-line personalized recommendations, or embed streaming video, you can go beyond static text.
• Performant sites: Sanity syncs product information back to Shopify server-side. Not having to fetch content client side means Liquid developers can create performant stores with rich product data.

Sanity extends the Shopify merchant experience you love with the power of composable content, opening up a world of possibilities for you to create more compelling, higher-converting shopping experiences.

Ready to add Sanity Connect to your Liquid-based store? Your development team can enable this feature in minutes, supported by guides and documentation. We’ve summarized what they can expect below.

An Unparalleled Developer Experience

After you install the Sanity Connect app, we’ll immediately create a bidirectional sync of product, variant, and collection data for your store. Updates to content metadata beyond baseline fields for this data are made using Sanity Studio, and then synchronized back to Shopify in real-time and server-side within a Shopify metafield as JSON. Data within this field can be used within the Online Store editor to enhance product, variant, or collection pages, without sacrificing store performance.

With data now available in Sanity Studio, you can create a custom workspace for Shopify product management and operations, which enables merchants to extend and enrich your product, variant, and collection content with all of the context they have available about them.

Merchant editors can use Sanity’s block content editor, built on Portable Text, to tell richer stories with products, while adapting styles to your existing store. To help you deliver this content to your Liquid-based template, we’ve written Shopify snippets that support serializing Portable Text in your online store. You can find the snippets and more information on Github.

Create rich shopping experiences with Sanity Connect

Sanity Connect brings composable content to Shopify's already robust commerce components framework. This is the unlock for merchants who want to tell rich, insightful stories without compromise—the types of shopping experiences that drive faster conversion and greater lifetime value.

Developers can add Sanity Connect for Shopify in minutes via our app store page, or, if our Enterprise plan best meets your needs, contact us for a live demo of Sanity’s full support for Shopify.