Sanity Studio v3 is here. Find out more on our blog →
May 18, 2022

SUSAM: Integrate Sanity asset management with Shopify

By Sogody

SUSAM — Sanity Uploader with Shopify Asset Management

SUSAM is an asset management integration with Shopify. It can be used for any Headless Shopify store that utilizes Sanity as their media provider to store, sync, and download their images and videos from their online shop. SUSAM connects Shopify’s asset management with Sanity CMS, for an effortless way to push files to your headless shop frontend and host them consistently on Shopify.

In this guide, we will include steps on how to install this plugin, how it gets integrated with Sanity CMS, and how you are going to use it.

Our great ecommerce team @Sogody will happily answer any questions or help you with the setup of SUSAM or other yet to be published solutions that we have available.

How it works

Prerequisites / Requirements

To use this plugin, you must already have a Sanity Project and your Shopify Private App pre-installed. Also, in order to gain access to all features you need to install the SUSAM Chrome Extension.

Installation

In your Sanity project folder:

sanity install @sogody/susam

This will add the file input from the SUSAM plugin as a Sanity input type.

Configuration

After installing the plugin through npm, susam.json file will be added to the Sanity Studio’s config directory. You must add your Shopify credentials to the susam.json which will be used to integrate with Shopify through SUSAM as follows.

{
  "SHOPIFY_DOMAIN": <yourStore.myshopify.com>,
  "API_PASSWORD": <yourAdminAPIpassword>
}


To get the configuration keys do the following steps:

  1. Visit Shopify.com to create a Shopify Private App, go to Apps > Develop Apps > Create an app.
  2. From your Shopify Private App Admin API section find:
    a. Shopify App Domain Name and add it to SHOPIFY_DOMAIN
    b. Password and add it to API_PASSWORD
  3. Make sure that @sogody/susam is present in sanity.json in your Sanity Studio.

Install Extension

For the Shopify Private App integration to be complete we advise content creators to install the SUSAM chrome extension.

How to use it

Make a schema type that uses the plugin's type shopifyURL. You can add the Shopify input field on your schema as below.

{
  name: 'shopifyURL',
  title: 'Shopify Input File',
  type: 'shopifyURL',
}

Features

Upload resources to Shopify
Browse previously uploaded resources
Download resources
Drag and drop resources

Find this useful?

If you found this solution as useful as we did, feel free to contact us through info@sogody.com or in https://sogody.com. Our great ecommerce team @Sogody will happily help you with the setup of SUSAM or other yet to be published solutions we have available.