Shopify App Installation Guide | Old Version

Shopify is a leading commerce platform for businesses of all sizes. It allows you to set up an online store to sell your products.

With the Contentstack Marketplace Shopify app, you can use and refer to the products from your Shopify account within your Contentstack entries.

Prerequisites

This step-by-step guide explains how to install and configure Shopify within your stack.

The steps to be performed are as follows:

  1. Get your Storefront API access token from Shopify
  2. Install and Configure Shopify in Contentstack Marketplace
  3. Use Shopify within your Stack
  1. Get your Storefront API access token from Shopify

    To get your credentials from Shopify, follow the steps given below:

    1. Log in to your Shopify account.
    2. On the Admin portal page, click Apps from the left navigation menu. 
    3. Navigate to the bottom of the Apps page and click the Develop apps for your store link.
      Click to enlarge

    4. On the App Development page, click Create an app. Mention your App name and select the App developer of your app, then click the Create app button. 
      Click to enlarge

    5. On the next screen, navigate to the Configuration section and configure the Storefront API integration for your app.
    6. Select the access scopes for your Storefront API and Save your configuration.
      Click to enlarge

    7. Finally, click the Install app button, confirm your installation, and proceed to get the Storefront API access token.
      Click to enlarge
    8. Note The Storefront API access token is required to connect your store with Contentstack. Make a note of this access token to be used in the next step.

  2. Install and Configure Shopify in Contentstack Marketplace

    To install the application in Contentstack, follow the steps below:

    1. Log in to your Contentstack account.
    2. In the left-hand side primary navigation, click the Marketplace icon to go to the Marketplace. 
    3. Click to enlarge
    4. Within the Marketplace, you can see all the apps available; hover over the Shopify app and click the Install App button. 
    5. Click to enlarge
    6. Select the stack for which you want to install the Shopify app and click the Install button.
    7. Click to enlarge
    8. Enter the Domain and Storefront API access token on the resulting Configuration page and click the Save button.
    9. Click to enlarge
    10. Click the Open Stack button to start using the Shopify application.
  3. Use Shopify within your Stack

    To use the Shopify application within an entry of your stack, follow the steps given below:

    1. Go to your stack and click the Content Models icon on the left navigation panel, and click the + New Content Type button.
    2. Create a content type by adding relevant details as displayed below:
    3. Click to enlarge
    4. In the Content Type Builder page, add a Custom field in your content type by clicking the Insert a field link represented by a + sign.
    5. Under Select Extension/App, select Shopify and click the Proceed button. 
    6. Click to enlarge
    7. After adding the app, click Save or Save and Close to save your changes.
    8. Click to enlarge
    9. To use the Shopify app, create an entry for this content type, and you will see the Shopify custom field on your entry page as shown below: 
    10. Click to enlarge
    11. Click the Add Collection button, to select collections from your Shopify account and add them to your entry.
      Click to enlarge
    12. The collections you select are referenced within your entry. You can add more collections by clicking the Add Collection button. Finally, Save your entry.
      Click to enlarge