commercetools App Installation Guide

commercetools is a leading digital commerce platform that allows you to create powerful, highly customized commerce experiences while building a profitable, sustainable brand.

With Marketplace, you can easily install the commercetools application and use it in your entry to refer to products or product categories from commercetools in your entries.

Prerequisites

This step-by-step guide explains how to install and configure commercetools in your stack.

Steps for Execution

  1. Create a New commercetools API Client
  2. Install and Configure commercetools in Contentstack Marketplace
  3. Use commercetools within your Stack
  1. Create a New commercetools API Client

    1. Login to your account at the commercetools Merchant Center and select your project.
    2. On the sidebar click on Settings and select Developer settings. 
      Developer_Setting.png
    3. Click on Create new API client
      Create_New_API_Client.png
    4. Give a suitable name and select the scopes as shown below from the view section and then click on the Create API client.api_client_create_btn.png
    5. Store the generated project key, client ID and client secret, since you will need them to configure the app in Contentstack.
    6. Note: Refer the commercetools Composable Commerce Regions page to know the region of your commercetools account. 
      You can check the locale you use to specify the search locale in config field locales through Settings > Project Settings > Languages Section.

  2. Install and Configure commercetools in Contentstack Marketplace

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

    1. Login to your Contentstack account.
    2. On the left-hand side primary navigation, you will find a new icon for Marketplace (as shown below). Click on the icon to go to the Marketplace.
      Marketplace_icon.png
    3. Within the Marketplace, you will be able to see all the apps available, hover over the commercetools app and click on Install App.
      Install_App_Commercetools.png
    4. In the popup window, select the stack for which you want to install the commercetools app and click on Install
      Select_Stack.png
    5. On the Configuration page, select the region, enter the project key, client ID, client secret, and default search locale that you got in step 1.
      Click on Save.
      Configuration_Page.png
    6. Click on Open Stack to start using the commercetools app.
  3. Use commercetools within your Stack

    To use the commercetools 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 on the + New Content Type button.
    2. Create a content type by adding relevant details as displayed below: 
      Create_New_Content_Type.png
    3. In the Content Type Builder page, add a Custom field in your content type by clicking on the “Insert a field” link represented by a + sign.
    4. Under Select Extension/App, select commercetools - Product Field or commercetools - Category Field for products and categories, respectively, and click on Proceed
      Select_Extension_App.png
    5. After adding the app, click on either Save or Save and Close to save your changes. 
      Save_And_Close.png
    6. To use the commercetools app, create an entry for this content type, and you will see this commercetools custom field on your entry page as shown below: 
      Custom_Field_Entry.png
    7. Click on Add Product(s) or Add Category(s), to select products or product categories from your commercetools account and add them to your entry. 
      Add_Products.png
    8. The products and categories you select are referenced within your entry. You can add more products and categories or simply save and publish your entry.
      Referenced_Entry.png

Was this article helpful?

Thanks for your feedbackSmile-icon

On This Page

^