Show Recent Sales on Product and Collection Pages

Updated Oct 26, 20263 min read
On this page · 5 sections

The Recent Sales inline notification shows who recently bought a product, inside the product page or under each product on a collection page.

Install the inline code first (see Inline Notification Install Code), then follow the steps below. The collection page steps are at the end.

Step 1: Create an Inline Notification

  1. Log in to your WiserNotify dashboard.
  2. After installing the inline code, navigate to the Social Proof section and select Sales Detail Page Notification from the Product Detail Page Section options.
  3. Click the “Customize” button on the Sales Detail Page Inline Notification to begin

Step 2: Customize Your Notification

In the Design Section, customize the notification to align with your brand and preferences:

  1. Text Editor:
    • Modify the text content, such as product details or location.
    • Use dynamic placeholders like {Name}, {Location}, and {Product}.
  2. Position & Animation:
    • Select animation styles for mobile (e.g., Fade) and desktop (e.g., Slide).
    • Position the notification on your website (e.g., Left Bottom or Center).
  3. Style:
    • Adjust the shape, color scheme, and size for desktop and mobile.
    • Add shadow effects to make the notification visually appealing.
  4. Embed Code:
    • Add custom HTML or CSS if needed.
  5. Data Control:
    • Choose the duration for displaying notifications and define the number of records to display.
    • Skip seen data to avoid repeating the same notification for users.
  6. Timing Control:
    • Set delays for showing notifications (e.g., initial delay of 4 seconds, display time of 8 seconds).
    • Randomize delays for more dynamic notifications.

Here, you can see all the options in the designs section in detail.

Step 3: Configure Display Settings


Under the Display Section, define where and how your notification will appear:

  1. Select Pages: Choose specific pages or display notifications across all pages.
  2. Multiple Websites: Configure settings for notifications on multiple domains.
  3. Advanced Targeting: Target users based on visitor behavior, location, UTM parameters, cookies, or referrer.

Here, you can see all the options in the display section in detail.

Step 4: Integrate Data Source & Publish

  1. Navigate to the Data Sources tab.
  2. Select your integration (e.g., Shopify, WooCommerce, or custom webhook) for pulling sales data.
  3. Configure data filtering options to refine the displayed records.

Here, you can see all detail option of data-source in details.

Click “Save” and then “Publish” your notification.

On Product Collection Pages

The collection page version shows recent sales under each product in your collection or category grid. It works the same way:

  1. In the Social Proof section, select Sales Collection Page Notification from the Product Collection Page Section options.
  2. Click “Customize” and set the design, as in Step 2:

  1. Configure the display settings, as in Step 3:

  1. Connect the data source, as in Step 4, then Save and Publish:


Now, visit your site.

Important: After making changes, check your notification in a private browser to avoid cache issues.

Was this guide helpful?

Related guides

Still stuck? We'll set it up with youLive chat or a free screen-share call, every day of the year.Chat with support

Small nudges, big impact

Show your visitors what others are doing right now, and turn hesitation into checkout.

WiserNotify customerWiserNotify customerWiserNotify customerWiserNotify customer
Trusted by 20,000+ sites ·★ 5 onCapterraCapterra34 people signed up today