Cart Widget Points | Boost Conversions with Loyalty Rewards Display by AiTrillion

Cart widget points

Introduction

The Cart Widget Points feature allows customers to redeem loyalty points directly from the cart page. By displaying point information at the cart level, you can increase transparency, encourage higher order values, and motivate customers to complete their purchases. This article explains how the cart widget points work and how to enable and configure them on your store.


Here are the steps below to set Cart Widget Points:

Step 1: Go to Loyalty Rewards > Set up program > Redeem Points



Step 2: Click on the Cart widget discount button.



Step 3: Enable the Display on Cart switch, update the point values according to your needs, and click on the Save button.



  1. Enter points: This refers to the ability to specify how many loyalty points are equivalent to 1 unit of your currency. For example, if you set this to 20, it means that 20 loyalty points will be equivalent to $1 or €1.

  2. Minimum cart amount ($): This is the minimum amount that must be in the cart for a customer to use their loyalty points. For example, if you set this to $50, customers can only redeem their points if their cart total is at least $50.

  3. Minimum points to claim: This sets the minimum number of points a customer needs to accumulate before they can start redeeming them. For instance, if you set this to 100 points, customers must have at least 100 points before they can use them for discounts or rewards.


  4. Cart widget title: This is the title that will be displayed on the cart widget, which might be something like "Your available points {{remaining-points}}, [10 points = $1]"

  5. Cart widget text: This is the text that appears below the title in the cart widget, explaining how many points can be used

  6. Display on storefront popup: If this option is enabled, the cart widget will appear as a reward option within the loyalty popup on the storefront, making it visible to customers as they shop.

  7. Maximum points to claim: This sets the maximum number of points a customer can redeem, which they can use for discounts.



Step 4: If you wish to display this cart widget in the AiTrillion loyalty storefront pop-up, enable the feature as shown below.
  1. Reward title: This is the title that will be displayed on the Loyalty popup

  2. Reward text: This text provides details on how many points are needed to redeem and save money.

  3. Minimum cart amount text: This is the message displayed to customers, informing them about the minimum cart amount required to use their loyalty points. For example, it could say, "You need a minimum cart value of $50 to redeem your points."



Step 5: On the storefront, log in to Shopify and click on the rewards button to open the AiTrillion Storefront Popup.




Step 6: On clicking the button, the pop-up will open, and you need to go to the Ways to redeem tab. The cart widget will be visible in the loyalty storefront panel. To redeem the rewards, click on Get rewards.


Notes
Note: Clicking on the cart widget in the storefront pop-up will take you to the cart page.

Display the cart widget on the cart page:

Now, there are 2 ways to display the widget on the cart page:
1. Using the App block.
2. Using a shortcode (Recommended for older Shopify themes)


Using the app block

Step 1: Go to Shopify admin >> Online store >> Click on the Edit theme button.



Step 2: Click on the down arrow button next to home >> Search for Cart >> Click on Cart.



Step 3: Click on Add section >> click on Apps tab >> Click on Loyalty cart redeem.






Using shortcode (Recommended for older Shopify themes)


To display this widget on the Shopify cart page, copy the shortcode in Step 4. Then go to Shopify admin > Online store > Themes > actions (Live theme) > Edit code.
<div class="aaa-loyalty-cartredeem-widget"> </div>

Click on the button to copy the text from the text field. Try to paste the text (e.g. Ctrl+V) afterward in a different window to see the effect.

Paste the code in cart-template. liquid file in the section to enable this feature on the cart.


Check more details about - What is Loyalty reward program here


On the cart, it looks like the image below:




Depending upon the theme, once you select the coupon, the discount will be automatically added to the checkout




Important Notes

  1. The Cart Widget Points feature works only when the Loyalty Program is enabled.
  2. The cart widget does not affect previous orders or already earned points.


Next⏭️