Knowledge Base

Cart Page Label & Redemption Section to Shopify Theme

Add Redeem Store Cash Popup on the Shopify cart page

By Daksh
Updated on June 09, 2025

This guide explains how to set up labels and a redemption section for your Shopify store's cart page using the Webplanex Rewards Wallet app. This allows customers to see their eligible rewards and redeem them directly during checkout.

 

Important Note:

Depending on your Shopify theme version (2.0 or lower), you'll need to either add a theme app extension or code snippets to integrate the cart label and redemption section

 

  1. Navigate to Theme elements: Locate the "Theme Elements" button on the navigation bar within the Webplanex Rewards Wallet app.

     

     

  2. Choose the Cart Menu: Click on the "Cart" menu within the Theme Elements section. This menu might have two options: "Cart page labels" and "Cart checkout popup."

     

  3. Customize Labels: Within the chosen menu ("Cart page labels" or "Cart checkout popup"), you can personalize the text labels:
    • Change the text displayed for eligible rewards.
    • Edit the text on the redemption button.

     

  4. Customize Checkout Popup: You can further customize the appearance of the cart checkout popup.
    • Select background and foreground colors.
    • Adjust text labels based on your preferred language.

     

     

  5. Enable the Switch: Once you're happy with the labels, button appearance, and content, activate the switch to make these elements visible on your live Shopify store theme.

     

     

Adding the Elements to Your Theme (Depending on Version):

 

For Shopify Theme Version 2.0:

  1. Access Theme Code:
    • Navigate to your Shopify admin panel.
    • Go to "Online Store" > "Themes" and select your theme.
    • Click on "Customize."

     

     

  2. Locate Cart Template File:

    Choose the "Cart" page from the theme customization options.

     

     

  3. Add Blocks:
    • Click on "Add block" from the left side menu.
    • Select the blocks named "Webplanex Rewards Label" (for the cart label) and "Webplanex Redeem Rewards" (for the redemption button).

     

     

  4. Save Changes:
    • Adjust the positions of the blocks on the cart page as desired.
    • Click on "Save" to apply the changes.

 

For Shopify Theme Versions Below 2.0:

  1. Access Theme Code:
    • Navigate to your Shopify admin panel.
    • Go to "Online Store" > "Themes" and select your theme
    • Click on "Edit code."

     

     

  2. Locate Cart Template File:

    Search for the file named "cart.liquid" or "cart-template.liquid".

     

     

  3. Add Code Snippets:

    Open the appropriate file and locate a suitable place to insert the belowcode

     

    Cart Label Code   

    <span id="total_order_cashback"></span>

    Code For Cart Drawer and Cart Popup

    <span class="wpcb_cashback_label"></span>

    Code For Cart Drawer and Redemption Button code(Put this snippet out side of the `<form action="/cart"> </form>`)

    <div class="wep_cart_checkout"></div>

     
  4. Save Changes:

    Save the changes made to the theme code.