How to Display Loyalty Points on a Product Detail Page (PDP)

Samantha Brown Updated by Samantha Brown

Overview

Friendbuy’s Loyalty Points Preview on PDP feature allows you to dynamically display how many points a shopper will earn for a product purchase—right on the product detail page. This personalized message helps drive loyalty program signups, incentivizes logged-in shoppers to complete purchases, and boosts AOV.

Here is an example of what this looks like on your site for Loyalty Members who are logged in:

Here is an example of what this looks like on your site for customers who are not logged in and not part of the Loyalty Program:

Benefits

  • Incentivize Conversions: Show shoppers the value of their purchase in loyalty points.
  • Drive Loyalty Program Opt-ins: Display persuasive CTAs to join your program.
  • Personalized by Status: Points reflect member tier multipliers and bonus campaigns in real-time.
  • Dynamic Logic: Automatically pulls correct values based on product price, customer status, and promotions.

Common Use Cases

Scenario

Example Message

Logged-in + Loyalty Member

“Earn 58 points with this purchase.”

Logged-in + Not Enrolled

“Join Glow Club and earn 29 points with this purchase.”

Logged-out

“Sign In or Join Glow Club and earn 29 points with this purchase.”

Bonus Campaign Active (2x points)

“Earn 116 points with this purchase.”

Tier Multiplier Active

“Earn 87 points with your Gold tier.”

Setup Guide

  1. Log in to your friendbuy account.
  2. Navigate to Loyalty > Widgets
  1. Click Create Widget → Select PDP Points Widget from the menu.
  1. Use the default template provided

  1. Click View/Edit widget to customize each widget state
  2. Customize messaging for:
    • Logged-in & Loyalty Enrolled
    • Logged-in & Not Enrolled
    • Logged-out

Each widget state has its own message block:

  • You can add custom text, emojis, and markdown-style hyperlinks (e.g., [Join Now](https://example.com/signup)).
  • To make “Login” and “Join” clickable separately, use multiple text components or markdown in a single box.
Default preview message: “You’ll earn points with this purchase.”
  1. Place the Widget on Your Storefront
    1. In your Shopify PDP template, add a container div, e.g.: <div id="pdp-points-widget"></div>
    2. In Friendbuy, under HTML Elements to insert widget into: set this div ID as your widget container target: pdp-points-widget

How Are Points Calculated?

All these values are handled automatically via Friendbuy

Attribute

Description

points_base

Base earning (e.g., 1 pt per $1)

tier_multiplier

e.g., 1.5x for Silver, 2.0x for Gold

bonus_multiplier

e.g., 2.0 for a 2x campaign

How did we do?

Receipt Scanning for Loyalty

How to Create an Earning Event

Contact