shopify

Contentful UI Extension to load products from Shopify's Storefront API

Adds a custom UI field to Contentful that allows users to search and select Shopify products.

To make the UI extension work you'll need a valid Storefront API token with unauthenticated_read_product_listings scope and the API endpoint of your Shopify store. By default the UI-extension uses instance parameters which are pre-configured for demo purposes:

See extension.json for the details:

{
  "name": "Shopify Products",
  "id": "contentful-ui-shopify",
  "fieldTypes": ["Object"],
  "srcdoc": "./index.html",
  "parameters": {
    "instance": [
      {
        "id": "apiToken",
        "name": "Shopify Access Token",
        "type": "Symbol",
        "default": "b5392a6d4ba10c47cb4ad1645bf78eb4"
      },
      {
        "id": "apiEndpoint",
        "name": "Shopify GraphQL endpoint",
        "type": "Symbol",
        "default": "https://contentful-demo.myshopify.com/api/graphql"
      }
    ]
  }
}

Assign to a field of a content type

Usage

Make sure you have the Contentful CLI installed:

npm install contentful-cli -g

You are logged in:

contentful login

And have a space selected:

contentful space use

To install the UI Extension:

contentful extension create

To update the UI Extension:

contentful extension update --force