Articles on: On-Site Displays

Configure Points Redeem at PDP/Cart

Configuring the Point Redemption Widget on Product Display Pages




Introduction


The Point Redemption Widget on Product Display Pages (PDPs) helps customers understand how many loyalty points they can redeem directly on a product page. This real-time visibility can influence purchase decisions, increase conversions, and encourage repeat engagement.

This guide follows a step-by-step approach to help you seamlessly set up, enable, and customize the Redemption Widget on your Shopify store.


Step 1 - Access the Widget Settings


From the left menu, go to Onsite Display and click Point Redemption Widget.




Step 2 - Select the PDP Redemption Feature


You will see the option titled Point Redeem at PDP Cart.




Step 3 - Open Configuration


Click Configure to proceed.




Step 4 - Check Current Status


You will now see whether the feature is enabled or disabled.




Step 5 - Ensure the Feature Stays Enabled


Verify that Enable is selected so the widget is active.




Step 6 - Allow Processing Time


Changes may take up to five minutes to reflect.

💡 Ensure a Redemption Rule is already configured—otherwise the widget will not function.




Step 7 - Continue Setup in Shopify


Return to Shopify to complete the widget’s placement and styling.





Step 8 - Navigate to Theme Settings


Go to Online Store → Themes.




Step 9 - Add the Widget to the Product Page


  1. Click Customize
  2. Choose the page you want to modify (e.g., Default Product Page)
  3. Select where the widget should appear (commonly below the earning widget)
  4. Click Add → Apps
  5. Search for Point Redeem Widget and select it

Once added, click Save.




Step 10 - Customize Widget Settings


If further customization is desired, select the widget again to open all settings.




Step 11 - Adjust Colors


• Choose a background color manually

• Or allow the widget to automatically inherit your store’s theme

• Adjust text color if needed




Step 12 - Placement & Font Size


• Confirm that the widget should appear on the Product Page

• Adjust font size to match your store’s branding

• Add additional CSS classes (optional)




Step 13 - Advanced Customization Options


Add CSS classes for further styling.

You may also disable automatic discount application, allowing the system to auto-apply discounts for logged-in users instead of requiring manual application.




Step 14 - Adjust Login Behavior & Guest Visibility


• If auto-discount is enabled, customers will need to apply the discount themselves

• You can hide the widget from guest users

• Set a Redirect URL, typically your login page




Step 15 - Add Redirect URL


When guests check their redeemable points, they will be redirected to the login page.

Paste your sign-in URL here.

You can also toggle the widget’s border visibility.




Step 16 - Border & Animation Settings


• Choose whether to hide or show the widget border

• Disable animations such as the rotating loader circle if preferred




Step 17 - Logged-In Text Customization


For logged-in customers, you can set up to three text variations.

For logged-out users, assign standard text explaining how to redeem points.

Preview how each message appears on your storefront.



Step 18 - Custom Messaging for Auto-Applied Discounts


There are two logged-in text customization options:

• Default message such as “200 saved using your points” for auto-applied coupons

• Additional variations for customized experiences




Step 19 - Customize Icons & Messages


If auto-apply is disabled, you can fully customize the displayed message using:

• Custom icons

• Personalized text

• Conditional messages

Ensure both text options are configured.




Step 20 - Final Adjustments


Make any last adjustments based on your preferences.

Click Save to apply changes.

Thank you for completing the configuration!




Wrap-Up


You’ve successfully learned how to:

âś… Enable and configure the PDP Point Redemption Widget

âś… Add the widget to your Shopify product pages

âś… Customize colors, text, placement, and CSS

âś… Configure login behavior and auto-apply settings

âś… Tailor the widget experience for logged-in vs. logged-out users

With this widget fully configured, customers can clearly understand how many points they can redeem—resulting in improved transparency, higher engagement, and stronger loyalty-driven conversions. 💚


Updated on: 16/12/2025

Was this article helpful?

Share your feedback

Cancel

Thank you!