Connect a storefront to your store

The Storefront section of the Commerce tab holds what a storefront needs to sell from your store: the publishable keys it calls the Store API with, the sales channels those keys sell through, and the storefront's own settings. Your storefront is the site shoppers buy on, such as one built with the JavaScript SDK or the Store API.

• You need the Admin or Owner role to create or revoke a key, to change a sales channel and to change the storefront settings. Other members see the keys, the channels and the settings, with a note that the page is read-only for them.
• The store's address and the sites that may call the Store API are under Settings, in the Store card (Change your store's settings).

In the dashboard, open the organization, then Commerce, then Setup, then Storefront. It has three cards: Publishable keys, Sales channels and Storefront settings.

A storefront sends a publishable key with every Store API call. A key is safe in browser code, and a test key places test orders.

1. On the Publishable keys card, select New key….
2. Enter a Label of up to 100 characters. It is for you to tell keys apart, and storefronts never see it.
3. Choose the Mode. Test places test orders. Live takes real orders once the store is live, and until then the Store API refuses it.
4. Under Sells through, tick the sales channels the key sells through. With none ticked, it sells through the default channel, and follows the default if another channel becomes it.
5. Select Create key.

The dialog shows the key, the header to send it in (x-publishable-api-key) and the Store API address. Select Done. The key stays in the list, where Copy key copies it. Send the publishable key shows how a storefront uses it. The JavaScript SDK takes the key as publishableKey and sends it with every request.

1. On the Publishable keys card, select Revoke… on the key's row.
2. Type the key's label, then select Revoke key.

Storefronts that send the key stop working within 15 seconds, so create another key first if a storefront still uses it. The key stays in the list, marked Revoked.

A sales channel is where the store sells. A key sells through its channels, and a product is listed in the channels it is added to under Listing in Products. A store has at most 50 channels.

To add one:

1. On the Sales channels card, select New channel….
2. Enter a Name of up to 100 characters. Storefronts can read it from the Store API.
3. Optionally, enter a Description of up to 500 characters, for members only.
4. Under Sells from, tick the stock locations whose stock the channel sells. With none ticked, it sells the stock of every location that is turned on.
5. Select Create channel.

The menu on a channel's row holds the rest:

Edit channel…

Change the name, the description or where it sells from, then select Save channel.

Make default

Keys that name no channel sell through the default. When some do, the dashboard asks you to confirm, because their storefronts then show the new default's products. A channel that is turned off must be turned on first.

Turn off… and Turn on

Storefronts whose keys sell through a channel that is turned off show none of its products until it is turned on again. Its products and keys stay as they are.

Delete channel…

Type the channel's name, then select Delete channel. Its products leave it and its locations are unlinked. A key that sells only through it shows no products, and needs replacing with a new key.

The default channel cannot be turned off or deleted. Make another channel the default first.

The Storefront settings card holds your own JSON for the storefront to read, such as an age gate or a welcome popup and the weight of each popup design. Coritan gives none of its keys a meaning: the Store API serves the object to your storefront as storefront, and your storefront's code decides what each key does.

1. On the Storefront settings card, write a JSON object in Storefront JSON, such as {"popup": {"enabled": true, "delay_seconds": 8}}.
2. Select Format JSON to lay it out with one key a line.
3. Select Save changes.

The field checks the JSON as you type and says what is wrong under it. Its hint counts the size against the limit. The object is saved whole, replacing the one before, and emptying the field removes it. It must stay within these limits:

• At most 16,384 bytes, counted as compact JSON in UTF-8, so a letter such as é counts twice.
• Objects and arrays nested at most 8 levels deep, counting the outer object.
• Every key from 1 to 64 characters long.

Turn on Turnstile check on sign-ups to ask for a Cloudflare Turnstile check before a storefront sign-up is recorded in Leads. It applies while Turnstile is set up for your storefront, and the Store API tells the storefront, as leads_turnstile, when to show the check. The switch saves with the card's Save changes.

A new key or channel appears in its list at once. Saving the storefront settings says "Storefront settings saved.", and the card shows the JSON laid out with one key a line.

The Store API refuses a live key with store_not_live

The store is still in test mode. Use a test key until staff take it live, as Take your store live explains.

The storefront's pages cannot call the Store API

Sites that may call the Store API, in Settings, lists sites, and the storefront's own site is not one of them. Add it, or empty the list.

Make default cannot be selected

The channel is turned off. Turn it on first.

Turn off… or Delete channel… cannot be selected

The channel is the default. Make another channel the default first.

The storefront settings do not save

The alert on the card, or the message under Storefront JSON, gives the reason. Fix the JSON, then select Save changes again.

• Run your store from the Commerce tab
• Change your store's settings
• Build a checkout with the Store API
• Build a storefront with the JavaScript SDK

The store's settings take storefront (a JSON object, replaced whole) and leads_turnstile through PATCH https://api.coritan.com/api/v1/orgs/{org_slug}/commerce/store. Create publishable keys and sales channels covers the key and channel routes.

curl -X PATCH "https://api.coritan.com/api/v1/orgs/acme/commerce/store" \
  -H "Authorization: Bearer $CORITAN_TOKEN" \
  -H "Content-Type: application/json" \
  -d '{"settings": {"storefront": {"popup": {"enabled": true, "delay_seconds": 8}}}}'