Connections by authorization: Shopify, Meta and Google Workspace

These connections are for the app to read data from your account (products and orders from your store, posts from your page). Do not confuse them with social login, which is your customer signing in to the app with their own account: that lives in the Authentication tab, in Sign-up and login in your app.

Before you start

• Plan: Builder. The plan is checked on every use: if the account leaves Builder, the app stops reading that data;
• Cost: creating the apps at the providers is free. Each call the app makes to those accounts consumes integration credits;
• You need to be present for the authorization step: you are the one who approves access, signed in to your provider account.

How authorization works

The path is the same for Shopify and Meta, and it has two stages:

1. save the keys of the app you created at the provider, on the card, with Save and activate;
2. connect the account: on the same card, click Connect account. A provider window opens, you sign in to your account and approve access. The window closes on its own and the card shows "Integration active."

The Connect account button stays disabled until the keys are saved ("Save the keys first, then connect the account."). Saving the keys is not enough: without stage 2, the app answers that the account has to be connected first.

Shopify

Card fields: Shop domain, API key and API secret key.

The app can list products, view a single product, list orders and list customers of the store. It is read-only: the access requested from the store is to read products, orders and customers.

1. at partners.shopify.com, create an app (for testing, a development store is free);
2. copy the Client ID (it goes in the API key field) and the Client secret (it goes in API secret key);
3. in the app's editor, Integrations tab, E-commerce category, open the Shopify card;
4. in Shop domain, enter the store's domain in the format your-store.myshopify.com. It has to be the .myshopify.com address, not the store's own custom domain;
5. fill in the two keys and click Save and activate;
6. click Connect account and approve the installation on the store.

Meta (Facebook/Instagram)

Card fields: App ID and App Secret.

The app can list the Facebook Pages you manage and read a page's posts. The access requested is to see the list of pages, read their engagement and manage the business.

1. at developers.facebook.com, create an app (it can be the same one used for WhatsApp);
2. add the Facebook Login product to the app;
3. under Settings → Basic, copy the App ID and the App Secret;
4. in the app's editor, Integrations tab, Social category, open the Meta (Facebook/Instagram) card;
5. paste the two keys and click Save and activate;
6. click Connect account, sign in with the Facebook account of whoever manages the pages and approve.

While the Meta app is in development mode, only people with a role on the app (administrator, developer, tester) can authorize. For your own use, that is enough.

Google Workspace

Card fields: Client ID and Client Secret.

The connection is for the app to use Sheets, Calendar, Drive and Gmail with a Google account.

1. at console.cloud.google.com, in the project you use (it can be the same one as Maps), go to APIs & Services → Credentials → Create credentials → OAuth client ID, type Web application;
2. enable on the project the APIs the app will use (for example, Google Sheets API and Google Calendar API);
3. in the app's editor, Integrations tab, Productivity category, open the Google Workspace card, paste the Client ID and the Client Secret and click Save and activate.

⚠️ Unlike Shopify and Meta, the Google Workspace card does not have the Connect account button today: it stores the keys, but the step of authorizing the Google account is not available on it. If your app depends on this connection, contact support before building on top of it.

Do not use here the Google login callback URL from the Authentication tab: it belongs to a different connection.

How to know it worked

• after Connect account, the provider window shows "Connected! You can close this window." and closes on its own;
• the card shows "Integration active." and the Connected badge. Watch out: the badge already appears when you save the keys, before authorization. On its own it does not prove the account was connected;
• the final proof is the app showing the data: ask in the chat, for example, "list the products from my Shopify store".

How to revoke access

Two ends, and it is worth doing both:

1. on the platform: open the card and click Disconnect. The keys and the authorized access are deleted from here;
2. at the provider: remove the authorization on their side, so the access stops existing for good. On Shopify, uninstall the app in the store's app settings. On Facebook, remove the app in your account's business integrations.

Common problems

• The provider window shows an error about the redirect address. The provider requires the return address to be registered on the app you created, and that address does not appear on the card today. Contact support to get your project's return address and register it on the provider's app;
• The window closes with "Failed:" followed by a reason. The reason comes from the provider. The most common ones: the authorization was cancelled, or the saved secret key is not the one for the app you signed in to;
• "fill in … before connecting". Some field is not saved. On Shopify, the Shop domain is required too;
• "shop_domain must be a valid .myshopify.com domain". Use the address your-store.myshopify.com;
• On Meta, nobody but me can authorize. The Meta app is in development mode.