How To Show Recent Sales Pop Up Notifications In Shopify (Without Apps)

Meta Description:
Learn how to add recent sales pop-up notifications in Shopify without apps. Boost trust, create urgency, and increase your store’s conversions with step-by-step guidance.

Introduction

If you want to show recent sales pop-up notifications in Shopify without using any apps, this guide will help you. Adding real-time sales notifications builds trust, encourages quick purchases, and can improve your store’s conversion rate. By the end of this tutorial, you’ll know exactly how to set it up on your Shopify store.

Why Show Recent Sales Pop-Up Notifications

Build Trust: Show customers that other people are buying your products.
Create Urgency: Encourage faster purchase decisions.
Increase Conversions: Social proof reduces hesitation and increases sales.

For more tips, check our Shopify Theme Customization Guide.

Option 1: Using a Shopify App (Recommended for Non-Coders)

Popular apps for recent sales pop-ups include:

Sales Pop – Recent Sales Popup
FOMO: Social Proof & Urgency
Trust: Sales Pop Up & Countdown

Steps:

Install the app from the Shopify App Store.
Set up the pop-up appearance and timing.
Preview your store to see live notifications.

Option 2: Manual Code Implementation

If you don’t want to use apps, you can manually add this code to your Dawn theme:

<script>
const products = [
  { name: 'Organic Cotton T-Shirt', price: '$29.99', city: 'New York', time: '2 minutes ago' },
  { name: 'Wireless Headphones', price: '$89.99', city: 'Los Angeles', time: '5 minutes ago' }
];

function showSale() {
  const randomProduct = products[Math.floor(Math.random() * products.length)];
  const notification = document.createElement('div');
  notification.className = 'sales-notification';
  notification.innerHTML = `<p>Someone from ${randomProduct.city} purchased ${randomProduct.name} for ${randomProduct.price} ${randomProduct.time}</p>`;
  document.body.appendChild(notification);
  setTimeout(() => notification.remove(), 5000);
}

setTimeout(showSale, 10000);
setInterval(showSale, Math.random() * 20000 + 20000);
</script>

<style>
.sales-notification {
  position: fixed;
  bottom: 20px;
  right: 20px;
  background: #fff;
  padding: 12px 16px;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  font-size: 14px;
  z-index: 9999;
  animation: fadeIn 0.5s forwards;
}
@keyframes fadeIn { from {opacity:0; transform: translateY(20px);} to {opacity:1; transform: translateY(0);} }
</style>

Option 3: Dynamic Recent Sales Notifications (Advanced)

For real orders using Shopify Metafields:

Create a Metafield
Go to Shopify Admin → Settings → Custom Data → Metafields.
- Name: recent_orders_notifications
- Namespace & Key: global.recent_orders
- Type: JSON
Automate Updates
Use Shopify Flow (Plus) or a Metafields App to update the metafield dynamically with new orders.
Add Snippet in Dawn Theme
Create a snippet recent-sales-notification.liquid and paste:

{%- assign recent_orders = shop.metafields.global.recent_orders.value -%}
{%- if recent_orders -%}
<div class="sales-notification-wrapper">
  <div class="sales-notification">
    <p>🛒 Someone from {{ recent_orders.city }} purchased {{ recent_orders.product_title }} for {{ recent_orders.price }} ({{ recent_orders.time }})</p>
  </div>
</div>
{%- endif -%}