Shopify Addon

Quick and easy integration with

This guide will help you to get CloudSponge working in your Shopify store.


The first step is install our extension in your store from the Shopify Ecommerce Plugins page:

Click to Install

Clicking in the above link will automatically create a CloudSponge for your store, and now all public pages will be able to use our widget.

Using our Widget

To use our widget to import contacts, follow these steps:

  1. Login in your Shopify account

  2. Select Online Store in the left menu:

  3. Click on Pages:

  4. At Pages, click on an existing page or add one clicking in the top right Add page button.

  5. After open/create-new page, now click in the Show HTML button like above:

  6. Add the below code to add a link to launch our widget and the textarea to receive the imported contacts:

    <!-- Any link with a class="cs_import" will start the import process -->
    <p><a class="cs_import">Add from Address Book</a></p>
    <!-- This textarea will be populated with the contacts returned by CloudSponge -->
    <textarea id="contact_list" style="width: 450px; height: 82px;"></textarea>

  7. Click on the Save button at the bottom right:

  8. Preview your page clicking in the View button at the top right:

  9. Test it: click in the Add from AddressBook link, and you’ll see our widget in action:

  10. Need help? Comments? Want to customize it? Let us know!

Creating a Google Credential

If you want to provide Gmail importing for your customers, you’ll need to spend 2 minutes to configure a Google API Credential.

After you follow these steps, your users will see your domain in the Google Authentication window instead of ours.

  1. Sign into Google Developer Console.
  2. Create a new project, or click on an existing one.
  3. At API Manager > Overview, search by Contacts API and click on it:
  4. If the Enable API button is available:
    1. Click on it to use this API.
    2. Click on “Go to Credentials” button (or “Credentials” link at the left).
  5. At Step “1 - Find out what kind of credentials you need”, fill the questions with the following answers:
    1. Which API are you using: Contacts API.
    2. Where will you be calling the API from: Web server.
    3. What data will be you accessing: User data.
    4. Click on “What credentials do I need?” button.
  6. At Step “2 - Create an OAuth 2.0 client ID”:
    1. Fill Name with your app name.
    2. Fill Authorized redirect URIs with
    3. Click on Create client ID button.
  7. At Step “3 - Set up the OAuth 2.0 consent screen”:
    1. Check if email address is correct.
    2. Fill Product name shown to users with the app name that will be displayed to your users.
    3. Click on Continue button.
  8. At Step “4 - Download credentials”, click on “Done” button.
  9. Click over your app credentials in order to view details.
  10. Take note of your Client ID, Client secret.
  11. Sign in to your CloudSponge account and add a new Gmail Consumer Credential.
  12. Enter the Client ID, Client secret and Redirect URI values from Google and click on Save button.

  13. Test a Google import on your site.

  14. Need help? Comments? Want to customize it? Let us know!