How do I implement Smartrr on my Shopify store?

Instructions for storefronts using both Shopify’s Debut theme and custom themes.

⚠️These instructions will involve some manipulation of the source theme code on your Shopify site. If you are not comfortable editing the liquid files in your store’s online theme, we recommend working with a front-end developer who has a working knowledge of Shopify’s liquid files. 

Don’t have access to a developer? We partner with a handful of excellent
agencies. We also offer full white-glove onboarding support with our Grow and Excel plans.

 

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. 

 

Screen Shot 2022-02-07 at 1.12.14 PM


If you are unsure whether your storefront qualifies for subscription offerings, you will see an error on
Step 3 in the instructions below. 

*Special instructions for storefronts using a custom theme are indicated with an asterisk (*). 

 


 

  1. From the Shopify app store, install the Smartrr app.



  2. In your Shopify admin ([your-store-name].myshopify.com), navigate to 'Apps'. The Smartrr app should now show on your app list.




  3. Click on the Smartrr app to open. Navigate to the 'Setup' section on the left-hand menu. If your Shopify store is ineligible for subscriptions, you will see an error like the below on the top of this page:



  4. Navigate back to your Shopify admin and go to Sales Channels > Online Store > Current Theme. Duplicate a copy of your current theme and name it something that is easily recognizable, such as [Your Store] Smartrr Integration Copy [Date]. Note: we’re recommending duplicating your theme here to prevent Smartrr from showing up on your site before you're ready to launch.



    *If you have a custom theme and use Shopify CLI for themes, wait until Step 6 to do a Shopify theme pull.

  5. Return to the Smartrr app and the 'Setup' section on the left-hand menu. Create your product Selling Plans based on the instructions in the Setup panel.

  6. Navigate to sections/product-template.liquid to add:



    to your { % form 'product' ... % } code so Smartrr can find the form.

  7. When this is complete, return to the Smartrr app click the button at the bottom of the page that says 'Publish Smartrr to Your Shop!'.




    *If you have a theme that is not based off Shopify's 'Debut' theme this button will give an error which can be solved with the following workaround:

In your theme's editor, find the liquid file where the product page form information lives in sections/product-template.liquid to see where to place the below snippet in the product form for your custom theme's product page.

 

 

See snippets/smartrr-product.liquid for configuration options to assist in customizing for your theme’s product page.

 

Be sure to insert the comment:

 

 

in files you edit to prevent your edits from being overwritten.