🧟♂
How do I install Smartrr on my headless store?
Implementing Smartrr on headless storefronts using the Shopify Plus API
Note: before implementing Smartrr, it's important to review Shopify's subscription requirements to determine your eligibility for offering subscriptions on your storefront. You must also have inventory tracking enabled for a product to be subscription-eligible.

App Installation

From the Shopify app store, install the Smartrr app.
In your Shopify admin ([your-store-name].myshopify.com), navigate to 'Apps'. The Smartrr app should now show on your app list.
Click on the Smartrr app to open. Navigate to the Integrations tab in the left-hand navigation and generate a new API token using the button that reads Create Key.
We recommend setting both your Token Nickname and your Application Name as the name of the platform you are authorizing for. We also recommend that Application Name specifically be in all capital letters, without spaces.
Important: Ensure that token's permissions for Selling Plan are left set at the default selection: Selling Plan: Read. If permissions are toggled to "None" you will not be able to read Selling Plans from the API.

Headless Implementation

Use the below endpoint to call for information about product Subscription Programs.
get
https://api.smartrr.com/venfor/selling-plan-group
Call Subscription Program Information
From the call response, use the data provided in the sellingPlans[ ] array to power the storefront display. Submit the shopifyNumericId value for the field selling_plan in the form POST submission in order to attach a Subscription Group alongside an item added to a customer’s cart.
post
https://<shopify domain>/cart/add
Attach Subscription Group to Item Added to Cart
Important: The product/variant will need to be enabled for the respective Subscription Program in the Smartrr admin portal. These can be detected with the productIds[ ] and/or variantIds[ ] array.

Displaying Account Portal

There are three methods for brands to display the Smartrr's Shopify liquid account portal on a headless shop.
We still recommend completing Smartrr's in-app Setup instructions up to the step 3. Smartrr Installation – part 1. Install Snippets onto a dummy theme for developers to see how Smartrr renders the account portal, or if your developers would like to duplicate a piece of liquid functionality to headless.
  1. 1.
    Forward /account –related URLs to your {your-store}.myshopify.com domain. This is our recommended method as it allows Shopify to continue handling all account actions (Login/Logout/Register/Checkout).
  2. 2.
    Create an account page on your site using the code found in your Shopify theme customers/account.liquid and use <iframe> to display it. This works for headless shops using React.
  3. 3.
    Duplicate smartrr-account.liquid in HTML, replacing the liquid code with the corresponding HTML Code. This works for headless shops not using React.