# Shopify Integration

This guide will walk you through how to create a private app in your Shopify store and connect your data to Cozmos.

To find out more about Shopify, visit <https://www.shopify.com/>

{% hint style="info" %}
Please be aware that certain features in Shopify may be blocked depending on what plan level you have with them.&#x20;
{% endhint %}

### Step 1: Create a Private app

To provide all the necessary data please open your Shopify store and go to the admin page in a separate tab of your web browser. Open the “Apps and sales channels” tab which is located in the left navigation column and then click on “Develop apps” at the very top of the page.

In order to start developing apps on your store, you should allow custom app development first.

Click on “Create an app” and you will be taken to the “Create app” pop-up to enter the app related data. Please enter the information shown below in the Custom App Configuration dropdown.

<details>

<summary>Custom App Configuration</summary>

#### ADMIN API ACCESS SCOPES:

* Orders: Set to <mark style="color:yellow;">`read_orders`</mark>
* Proucts: Set to <mark style="color:yellow;">`read_products`</mark>
* Script Tags: Set <mark style="color:yellow;">`write_script_tags`</mark> and <mark style="color:yellow;">`read_script_tags`</mark>
* Shop Locale: Set to <mark style="color:yellow;">`read_locales`</mark>
* Translations: Set to <mark style="color:yellow;">`read_translations`</mark>
* Legal policies: Set to <mark style="color:yellow;">`read_legal_policies`</mark>
* Publications: Set to <mark style="color:yellow;">`read_publications`</mark>

#### STOREFRONT API ACCESS SCOPES:

* Read and modify checkouts
* Read the inventory of products and their variants
* Read and modify customer details
* Read product variants and collections
* Checkout: Set <mark style="color:yellow;">`unauthenticated_write_checkouts`</mark> and <mark style="color:yellow;">`unauthenticated_read_checkouts`</mark>
* Content: Disable <mark style="color:yellow;">`unauthenticated_read_content`</mark>
* Customers: Set <mark style="color:yellow;">`unauthenticated_write_customers`</mark> and <mark style="color:yellow;">`unauthenticated_read_customers`</mark>
* Products: Set <mark style="color:yellow;">`unauthenticated_read_product_listings`</mark> and <mark style="color:yellow;">`authenticated_read_product_inventory`</mark>

</details>

Please, make sure to install the app at the API credentials tab of the App development page of Shopify Store Custom App as soon as you configure and save API access scopes.&#x20;

By doing that you will additionally receive Admin API access token & Storefront API access token required for your Shopify Store connection to your Cozmos account.

{% hint style="info" %}
Make sure your products include your App as "Sales channel" for Checkout to work correctly.
{% endhint %}

<figure><img src="https://955540963-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgWSBgBDll5yYEIDkdXon%2Fuploads%2F0DgX3b4LZZ5OhueCp2di%2Fimage-1.png?alt=media&#x26;token=60165b15-fbc0-4f28-b72f-94ec1cc9d71d" alt=""><figcaption></figcaption></figure>

Once the Custom app has been successfully created and API credentials have been received, please proceed to filling in the data to connect your Shopify store to your Cozmos account as provided below.

### Step 2: Connect your Shopify store in Cozmos

To find the Shopify integration setup, go to: Settings / Ecommerce Providers / Shopify

<figure><img src="https://955540963-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgWSBgBDll5yYEIDkdXon%2Fuploads%2FWYH7ZYjHMJV0GYpZzcjS%2Fimage.png?alt=media&#x26;token=b40e5758-7e3c-4b32-b522-a1dd4ad39ffe" alt="Ecommerce Providers"><figcaption></figcaption></figure>

#### Add your store name

You can copy this from your Shopify store URL or from the URL provided in your Shopify admin settings side menu.

<figure><img src="https://955540963-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgWSBgBDll5yYEIDkdXon%2Fuploads%2FPlecFQvG55ri9IAtsWky%2Fimage-2.png?alt=media&#x26;token=98e6d04c-780b-41d7-b958-b5848eae69e3" alt=""><figcaption></figcaption></figure>

#### Add your API Key

This info you can copy at the API credentials tab of App development page of Shopify Store Custom App, at the bottom of the page. Please, see the screenshot below.

<figure><img src="https://955540963-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgWSBgBDll5yYEIDkdXon%2Fuploads%2FAWl7WHRjoMqC6TO00Esp%2Fimage-3.png?alt=media&#x26;token=adb751a5-ac3b-4241-becf-eb4ef5b09db8" alt=""><figcaption></figcaption></figure>

#### Add your API secret key

This info you can copy at the API credentials tab of App development page of Shopify Store Custom App, at the bottom of the page, right under [API key](#add-your-api-key). Please, see the screenshot below.

<figure><img src="https://955540963-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgWSBgBDll5yYEIDkdXon%2Fuploads%2FZurvxJHIqJPb7hrwimIn%2Fimage-.png?alt=media&#x26;token=efb2b66c-8461-4881-a976-3b4953a9fdfb" alt=""><figcaption></figcaption></figure>

#### Add your API access token

First click “Install app” at the API credentials tab of App development page of Shopify Store Custom App to get your Admin API and Storefront API access tokens.

{% hint style="warning" %}
Please be aware you may reveal the token only once. Make sure you copy and save your API secret key in a secure place.
{% endhint %}

<figure><img src="https://955540963-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgWSBgBDll5yYEIDkdXon%2Fuploads%2Ffj0NSeAZpIbMG3aIfswM%2Fimage-4.png?alt=media&#x26;token=370c31cd-b115-42b8-8d64-6985d01fe4fa" alt=""><figcaption></figcaption></figure>

#### Add your Storefront API access token

This info you can copy at the API credentials tab of App development page of Shopify Store Custom App, namely in the Storefront API access token block. Please, see the screenshot below.

<figure><img src="https://955540963-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgWSBgBDll5yYEIDkdXon%2Fuploads%2FSbemzaW5WrPj4dg2HzsS%2Fimage-6.png?alt=media&#x26;token=7d7e222d-42d2-48ba-82d1-60d4e06ac5b6" alt=""><figcaption></figcaption></figure>

#### Save Changes

Once all information has been added, please click on the 'save changes' button.

<figure><img src="https://955540963-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgWSBgBDll5yYEIDkdXon%2Fuploads%2F6cC9UbLwZ0oST6p1sUv9%2Fimage.png?alt=media&#x26;token=83bceb92-2fa9-4844-bbcb-15f546c150bf" alt="Connect Shopify store"><figcaption></figcaption></figure>

If all details entered are correct, you will now see a Connected status indicator next to the Shopify store name input field

<figure><img src="https://955540963-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgWSBgBDll5yYEIDkdXon%2Fuploads%2FTbuJblxKcGzb8SvFhoPu%2Fimage.png?alt=media&#x26;token=984c6a5d-6195-442d-8c03-de72a55c6c7c" alt="Shopify - connected"><figcaption></figcaption></figure>

{% hint style="info" %}
If you are unable to connect your store, please reach out to our [Product Support Team ](https://learn.cozmos.com/help/support)and we will assist where possible.
{% endhint %}

### Step 3: Sync and Settings

Once connected, you have two additional settings to complete before you sync your products

#### 1. Localised Content Data

This refers to any language data you have in your Shopify store, please ensure you select all languages you want to be available within your Sphere

#### 2. Order Confirmation Redirect

Customers will be automatically redirected to Sphere upon completion of order. Adjust how you would like this to behave using the options provided.

#### Sync Products

You are now ready to sync your products. How long the sync process takes will depend on how many products you have in Shopify

<figure><img src="https://955540963-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgWSBgBDll5yYEIDkdXon%2Fuploads%2FuSQ1MdmZGiWLXJUyQCAW%2Fimage.png?alt=media&#x26;token=830cce38-3145-43d9-9934-12bbef9c11fa" alt="Sync products"><figcaption></figcaption></figure>

While the sync is in progress, you will see products appearing in the Products section of your Space. Wait until the sync is complete before you start to edit or use any products in your Sphere design.

### Step 4: Multipass (optional)

Below the Sync Your Products block you will see an option to to turn on Multipass, for a full overview of what this means, please read our [Multipass Guide](https://learn.cozmos.com/guides/ecommerce/shopify-integration/shopify-multipass).