Recent Sales Counter

What is the Recent Sales Counter?

The Recent Sales Counter is an inline widget that displays how many units of a product have been sold in the last 24 hours. It appears as a compact message like "39 items sold in the last 24 hours" alongside a shopping cart icon, providing instant social proof that encourages customers to buy.

This real-time sales velocity indicator helps convert hesitant shoppers by showing that others are actively purchasing the product.

How Sales Data is Tracked

Ultimate Social Proof automatically tracks sales through Shopify order webhooks. Here's how it works:

1. Order received - When a customer completes a purchase, Shopify sends an order webhook to Ultimate Social Proof.
2. Line items processed - Each product in the order is recorded with a timestamp.
3. 24-hour window - The system maintains a rolling 24-hour count for each product, automatically expiring older sales data.
4. Real-time updates - When customers view your product page, the widget fetches the current count from our servers.

The count is product-specific, so each product displays its own unique sales velocity based on actual orders from your store.

How the 24-Hour Count is Calculated

The Recent Sales Counter uses a sliding time window approach:

• Each sale is recorded with a precise timestamp when the order is placed.
• When the widget loads, it counts all sales from the past 24 hours (86,400,000 milliseconds).
• Older sales automatically expire and are removed from the count.
• The count updates in real-time as new orders come in and old ones age out.

This means the number shown is always current and reflects actual recent purchasing activity for that specific product.

Adding the Recent Sales Counter to Product Pages

The Recent Sales Counter is designed for product pages and can be added through your Shopify theme editor:

1. Go to Online Store > Themes in your Shopify admin.
2. Click Customize on your active theme.
3. Navigate to a product page using the page selector dropdown.
4. Click Add block in the product section where you want the counter to appear.
5. Search for and select USP Inline Recent Sales from the app blocks.
6. Position the block where you want it displayed (typically near the Add to Cart button).
7. Click Save.

The widget automatically hides itself when there are zero sales in the last 24 hours, so new products won't show an empty counter.

Customization Options

The Recent Sales Counter offers several customization settings to match your store's branding and product terminology:

Singular Noun

The word used when exactly one item has sold. Default is "item" but you can change it to match your products (e.g., "pair", "bottle", "unit").

Plural Noun

The word used when multiple items have sold. Default is "items" but you can customize it to match your singular noun (e.g., "pairs", "bottles", "units").

Icon Color

The color of the shopping cart icon and its background. Default is green (#22c55e) but can be changed to match your store's color scheme. The background automatically uses a lighter tint of your chosen color.

Icon Corner Radius

Controls how rounded the icon background appears, from 0px (square) to 40px (fully circular). Default is 20px for a circular appearance.

Display Behavior

The widget includes smart display logic:

• Auto-hide on zero - When a product has no sales in the last 24 hours, the widget automatically hides to avoid showing "0 items sold".
• Singular/plural handling - The noun automatically switches between singular and plural forms based on the count (e.g., "1 item" vs "5 items").
• Server-side rendering - Initial counts are rendered server-side via metafields for fast page loads, then updated via API for accuracy.

Best Practices

• Position near the buy button - Place the counter close to your Add to Cart button to reinforce purchase decisions at the moment of conversion.
• Use relevant nouns - Customize the singular and plural nouns to match what you sell (e.g., "pair/pairs" for shoes, "box/boxes" for subscriptions).
• Match your brand colors - Adjust the icon color to complement your theme while remaining visible.