Shopify

Shopify Addon

Quick and easy integration with Shopify.com

Install

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 product name in the Google Authentication window.

Important: Google requires you to submit a review of your application before they will allow strangers to use approve your OAuth permission requests. Google warns that the OAuth review may take up to a week. In our experience, the review may be faster than 24 hours as long as Google doesn’t have any questions about your application. We’ve prepared some background and directions to help you navigate the new process successfully. You can still test out your integration immediately.

These are the actions required to set up your Google OAuth:

  1. Obtain your Google OAuth 2.0 Credentials.
  2. Configure your CloudSponge account with your Google OAuth credentials.
  3. Request a review on Google’s OAuth Developer Verification Form.
Obtain your Google OAuth 2.0 Credentials

Watch how to create a Google OAuth credential in a few minutes.

Or follow the general steps below:

  1. Sign into the Google Developer Console with your Google account.
  2. Create a new project, or click on an existing one.
  3. Ensure that the Contacts API is enabled for your project.
  4. Configure your consent screen with your product name and other details.
  5. Create a new credential for your project.
    • Under Application type, select Web application,
    • Fill Authorized redirect URIs with your Proxy URL.
    • Click Create
  6. Note your Client ID and Client Secret. You will enter these into CloudSponge.
    • Click over your app credentials in order to view details.

    • Take note of your Client ID, Client secret.

Configure your CloudSponge account with your Google OAuth credentials
  1. Sign in to your CloudSponge account and add a new Gmail OAuth Credential.
  2. Enter the Client ID, Client secret and Redirect URI values from Google and click on Save button.
  3. Open your Account Settings page.
  4. Click the OAuth Credentials Settings button for the desired domain:

  5. For Gmail, select the newly inserted credential and click on Done button:

  6. Test a Google import on your site.

NB If you observe a 400 error with a message of “Error: invalid_scope” when you attempt to complete the OAuth flow,
then your OAuth account needs to be reviewed before Google will let you request access to people’s address books.
This is a new requirement that they introduced on May 11, 2017.
We’ve prepared some background and directions for navigating the new review process.

Request a review on Google’s OAuth Developer Verification Form

Read our background and directions for a quick turnaround from the review process.

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

Create your sandbox account now

Get Started

Your trial doesn’t start until you go live.