← All articles
Tutorials

How to Add Sales Notifications to Any Website (No Code Required)

You don't need a developer to show real-time purchase notifications on your site. Here's how to do it with a single line of JavaScript.

5 min read · February 28, 2026

The barrier to adding social proof used to be a developer and a sprint. A custom-built notification system required backend infrastructure, a data pipeline from your order management system, a front-end widget, and ongoing maintenance.

It's now one line of JavaScript.

Modern social proof tools handle the infrastructure. You handle the placement. If you can add a Google Analytics tag to your site, you can add real-time sales notifications.

What You Need

Three things.

A social proof tool. This is the layer that stores notification data, handles the display logic, and serves the widget. It's where you configure what notifications look like and when they fire.

A data source. Your notifications have to come from somewhere. The most common sources are an e-commerce platform (Shopify, WooCommerce), a payment processor (Stripe), or a custom webhook that sends purchase events when they happen. If you have a data source, you can show real purchase notifications. If you don't have one yet, most tools also support manual data entry or CSV upload for demos.

A website you can add a script to. This is the only real technical requirement: the ability to paste a script tag somewhere in your site's HTML. Most website platforms support this — WordPress, Webflow, Squarespace, Wix, Framer, and any hand-built site all give you a way to add scripts. If you can add Google Analytics or a Facebook Pixel, you can add this.

Step-by-Step: Adding to Any Website

Step 1: Create an Activly account. Go to app.activly.io and sign up. The onboarding flow walks you through initial setup. You'll name your website and configure your first notification campaign.

Step 2: Connect your data source. In the Activly dashboard, navigate to Integrations. Connect your platform:

  • Shopify: Install the Activly app from the Shopify App Store. Order data syncs automatically.
  • WooCommerce: Install the WordPress plugin or connect via the WooCommerce REST API using an API key.
  • Stripe: Connect via OAuth. Activly listens for payment_intent.succeeded events and turns them into notifications.
  • Custom webhook: Activly provides a webhook endpoint. Send a POST request with order data whenever a purchase completes on your platform. Works with any e-commerce system that supports outbound webhooks.

Once connected, Activly pulls historical order data to populate notifications from day one. New orders sync in real time.

Step 3: Customize the notification design. In the campaign editor, configure what your notifications look like. Choose the position (bottom-left is the most common), the widget size, font, background color, and border radius. Preview on both desktop and mobile before saving.

Configure the notification template — what it says. A typical purchase notification: {first_name} from {city} just purchased {product_name}. You can show or hide each field. Add a product thumbnail if your data source provides image URLs.

Set timing: how long each notification stays on screen (typically 5-7 seconds), how long to wait between notifications (typically 8-12 seconds), and whether to loop through recent purchases or show them in strict chronological order.

Step 4: Copy the one-line script tag. Navigate to the Install section of the Activly dashboard. You'll see a script tag that looks like this:

<script src="https://cdn.activly.io/widget.js" data-site-id="your-site-id" async></script>

That's the entire installation. Everything else is handled remotely.

Step 5: Paste it before </body> in your HTML. Where you paste the script depends on your platform. The rule is consistent across all of them: place it before the closing </body> tag so it loads after the main page content. Avoid placing it in the <head> — notifications don't need to block page rendering.

  • WordPress: Go to Appearance > Theme Editor > footer.php and paste before </body>. Better: use a plugin like Insert Headers and Footers to add it without editing theme files directly.
  • Webflow: Go to Project Settings > Custom Code > Footer Code and paste there.
  • Squarespace: Go to Settings > Advanced > Code Injection > Footer and paste.
  • Wix: Use the Wix Velo code editor or the Tracking & Analytics section under Marketing Integrations.
  • Framer: Go to Site Settings > General > Custom Code > End of </body>.
  • Raw HTML: Paste directly before </body> in each page's HTML file, or in your shared template/layout file.
  • Google Tag Manager: Create a new Custom HTML tag, paste the script, and set it to fire on All Pages (or specific pages using page path triggers). No access to your site's codebase required.

Step 6: Go live. Save and publish. Visit your site and wait for the first notification to fire. Activly has a test mode in the dashboard that forces a notification to appear immediately so you can verify placement and styling before real orders start triggering them.

Works With

Any platform that lets you add a script tag. The list is long: WordPress, Webflow, Squarespace, Wix, Framer, Shopify, BigCommerce, Carrd, Ghost, Notion (published pages), raw HTML sites, and any custom-built site using a standard HTML template.

The only platforms that don't support this are fully locked environments that prohibit external scripts — some enterprise CMS platforms or highly restricted hosted pages.

Troubleshooting: What If Notifications Don't Show

Check script placement. The most common issue is a script placed in the wrong location. Open your browser's developer console (F12) and look for the Activly script in the Network tab. If it's not loading, the placement is wrong.

Check ad blockers. Ad blockers sometimes intercept social proof scripts. Test in an incognito window without extensions enabled. If notifications appear there but not in your normal browser, an ad blocker is the cause. Most tools, including Activly, offer a first-party proxy option that routes the script through your own domain to avoid this.

Use testing mode. The Activly dashboard includes a testing mode that bypasses timing logic and fires a notification immediately on page load. Use this to verify the widget is loading correctly before troubleshooting data or timing issues.

Verify your data source connection. If the script loads but no notifications appear after real orders come in, check the integration status in the Activly dashboard. Most connection issues are caused by API key expiration or webhook misconfiguration, both of which are logged and flagged in the dashboard.

The Threshold Is Low

The technical ask here is minimal. Paste a script tag. Connect a data source. Configure a design. That's it.

The result — real-time purchase notifications that show visitors your store is active and trusted — would have taken a development team weeks to build from scratch a few years ago.

If you can add a Google Analytics tag, you can add Activly. The setup time is the same. The conversion impact is not.