Skip to main content

Setting up Shopify New Customer Accounts

Updated over 2 weeks ago

Shopify New Customer accounts (NCA) are compatible with Tapcart apps with some configuration to your Shopify storefront via Shopify's admin. Once you setup that configuration, steps outlined below, your app will use Shopify's New Customer Account portal as the default Account page in the app (replacing the Classic Accounts version provided by default).

Enabling authentication for new customer accounts in the Tapcart app requires specific configurations in Shopify. This guide provides an overview of the necessary steps to ensure a seamless login experience for your customers.

For more information on the differences between NCAs and the Classic Accounts, reference our comparison.

New Customer Account Activation Steps

Before getting started you will want to confirm your storefront has already activated New Customer accounts in your Shopify admin. If you have not already done that please review the New Customer Accounts Shopify Help Center article on how you can do so.

Add "Headless" App from Shopify App Store

Shopify is currently improving the way 3rd parties leverage New Customer Accounts however for the time being, in order for New Customer Accounts to work in the app you must add Shopify's Headless app from the App Store.

  1. Visit Shopify App Store and install their Headless App (note: this is a free app as of writing this article)

  2. Click Create Storefront to begin creating a storefront

  3. Under "Manage API Access" click Manage on the Customer Account API

  4. Leave the Public (web app) option selected under the Client Type section.

  5. Copy your Client ID shown in the image below.
    Note: Shopify mentions avoiding sharing it but the token is actually accessible through network calls so it's not as risky as described.

    1. 76476923-6321-44b7-9d19-ba65d7d003b4
    2. Gather your Shopify Store ID from the Application Endpoints section. This is the number found between /authentication/{your_store_id}/oauth
      Note: If you don't see this value, we are able to retrieve it from Shopify.

      2024-12-13_14-48-42.png
  6. Find the Application Setup section and click the pencil to edit

    1. Add the following URL as a Callback URI so that Shopify knows who is the source authentication the customer: https://shopify-customer-accounts.vercel.app/auth/token

    2. Add the following URL as a Javascript Origins which allows customer access tokens to be refreshed: https://shopify-customer-accounts.vercel.app

      2024-12-13_14-54-06.png

Note: Ensure that your redirect/JavaScript origin and callback URIs match the values required by your headless app settings. Double-check for any extra spaces or characters in the URI strings, as mismatches can cause errors.

Send data to your Tapcart team to complete the integration

In order for the setup to be completed we need to add this information into our system. Please email the following to [email protected]

  • Client ID

  • Store ID (if available)

This can take 24-48 hours to turn around so please account for that when making the request.

Troubleshooting Tips

  • If you encounter errors such as “JavaScript origin is not valid,” review your URI settings to ensure they are accurate and free of trailing spaces or mismatched characters.

Did this answer your question?