What is a "Buy Box"?
This is almost exactly how it sounds - a box where your customers will go on your site, to inevitably checkout with their product or subscription.
How do I Install Automatically?
We first have the option to install automatically from our merchant portal. To do so:
Navigate to our merchant portal
Scroll to the "Setup" section, and click the "Automated Subscribe & Save Widget Installation"
Follow the instructions on the page - and you should now have the "Subscribe & Save" widget successfully installed!
4. Following these actions successfully will result in four files being added to your selected theme in the snippets folder.
rtx-account-btn.liquid - This file handles the manage subscription link in the account page.
rtx-api.iquid - This file works in conjunction with rtx-pdp.liquid to add the selling plan id to a subscription order.
rtx-pdp.liquid - This file handles almost all of the buy box code and styling along with helper functions for events happening on the product page.
rtx-passwordless-btn.liquid - This file handles the passwordless login link that is placed on your login page.
5. Installing these snippets through the Stay.Ai app will also try to add the appropriate {% render %} tags into the liquid code. This will allow the elements to be displayed on the correct page. Since most themes have custom work done to them and there are large disparities between themes, these tags will be placed on the best approximation of where they should render.
NOTE: There may be additional work required to get them styled or positioned exactly where you would like them. If you need development support accomplishing this, or if the install did not work properly, please reach out to the Stay.Ai Team.
To manually install the Stay.Ai Subscribe & Save Widget 2.0, start by following the below instructions:
Log into the Shopify Merchant admin for a dev store.
Navigate to 'Online store --> Themes' using the left-hand navigation.
Install a 2.0 theme that doesn't currently have a buy box installed. To do so, either...
Install a fresh theme ('Dawn' is the default 2.0 theme)
Duplicate another theme without a buy box so you have a copy to work with
Once you have installed your theme, click the 'Customize' button for the theme. You should now be in the Shopify Theme editor.
Navigate to a product in your test store within the theme editor.
On the left hand side you should have a menu.
Under 'Product information' locate and click the 'Add block' button
It will pop up a menu that has two sections; 'THEME BLOCKS' and 'APPS'. Under 'APPS' locate the 'Subscribe & Save Block'. It should have a sub header labeled 'Stay.AI Subscriptions'. Click it.
You should now see a menu on the right hand side of the browser to customize the 'Subscribe & Save Block'.
Locate and check the 'Enable Buy Box' checkbox
You should now see the buy box appear in the UI!
From this point you have a lot of flexibility on editing the buy box with built-in tool customization.
The ability to switch between UI’s for Radio Buttons, Regular Buttons, or Stacked Buttons. As well as options for color selectors, border radius, and border width.
There is also a section to implement more in-depth custom CSS rules.
When you are ready to test, click “Save” in the upper right hand corner. You should now be able to preview this theme and have a working buy box on your product detail page!
And, you're done!
As mentioned, if you have any issues, please reach out to your Stay.Ai Customer Service representative to help resolve!