Overview
Allowing customers to redeem points at checkout is a great way to promote points spending and increase engagement with your reward program. Adding the slider just takes a few minutes.
Note: The Enterprise plan is required for this feature.
Requirements
The Shopify Plus platform is required; adding a points slider at checkout requires editing the checkout.liquid template file, which is a feature currently only available to Shopify Plus merchants.
For non-Shopify Plus merchants, this feature is not possible to add.
Implementation
1. Login to your Shopify Admin
Select Online Store in the left side menu, and then from the Actions button on the right, choose Edit HTML/CSS:
2. Create a new snippet in Shopify
Create a new file under "Snippets" and call it "lootly-points-slider.liquid"
3. Paste our slider script code into the new snippet
Copy the code from here and add it to the new "lootly-points-slider.liquid" snippet from Step 2, then click Save.
4. Add code into checkout.liquid
Next you’ll need to click on Layout from the left editor menu, than open the “checkout.liquid" file.
Search for the following code line “content_for_order_summary” and add the following 2 lines above it.
{% include 'lootly-launcher' %}
{% include 'lootly-points-slider' %}
You’re all done! 🎉
To see how the slider works on your store, add an item to your cart than select to view the cart / checkout.
You should now see the slider:
Note: To customize the text and colors associated with the slider you will need basic knowledge of HTML / CSS to edit the script. If you’re not sure, please contact our support team for assistance.