> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.nector.io/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Configure Points Redeem Widget at PDP/Cart

# Configuring the Point Redemption Widget on Product Display Pages

${frame}[](https://www.youtube.com/embed/7IagarHGsV8)


### 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.

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image1_1c7k1gc.jpg)


###### Step 2 - Select the PDP Redemption Feature

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

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image2_1xen536.jpg)


###### Step 3 - Open Configuration

Click Configure to proceed.

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image3_p670u9.jpg)


###### Step 4 - Check Current Status

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

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image4_dtmbd4.jpg)


###### Step 5 - Ensure the Feature Stays Enabled

Verify that Enable is selected so the widget is active.

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image5_9kk7ko.jpg)


###### 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.

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image6_izpe9g.jpg)


###### Step 7 - Continue Setup in Shopify

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

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image7_1ou50pz.jpg)



###### Step 8 - Navigate to Theme Settings 

Go to Online Store → Themes.

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image8_15it9i3.jpg)


###### 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.

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image9_yvzy3f.jpg)


###### Step 10 - Customize Widget Settings

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

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image10_p7vk7f.jpg)


###### 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

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image11_1v1gnfa.jpg)


###### 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)

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image12_chfisw.jpg)


###### 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.

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image13_1vvm4p8.jpg)


###### 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

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image14_le69ew.jpg)


###### 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.

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image15_1tz4678.jpg)


###### Step 16 - Border & Animation Settings

• Choose whether to hide or show the widget border
• Disable animations such as the rotating loader circle if preferred

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image16_1yh804h.jpg)


###### 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.
![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image17_8qydyd.jpg)


###### 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

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image18_1wrv9lu.jpg)


###### 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.

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image19_cxkkzq.jpg)


###### Step 20 - Final Adjustments

Make any last adjustments based on your preferences.
Click Save to apply changes.
Thank you for completing the configuration!

![](https://storage.crisp.chat/users/helpdesk/website/-/d/9/9/4/d9947dc4cf2ed000/image20_10h7n09.jpg)


###### 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. 💚
