Shopify Products
UI ExtensionDeveloped by Contentful

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": ""


Assign to a field of a content type



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
Ecommerce, Productivity

UI Extensions always act on behalf of the logged in user and have the same permissions.

This UI Extension can only be installed by space admins. It will be installed in the most recently used space.