Skip to main content

How to Add Real-Time Sales Alerts to Your OBS Live Stream ✨📈

Updated

Learn how to set up a live sales notifications on your OBS live stream with our step-by-step guide. Ideal for content creators.

We will be using SpicyFanz Webhook from your Dashboard to add a Sales Notification as a web overlay. The overlay looks professional, is straightforward to set up, updates in real-time and the basic version is completely free!

💡 NOTE: Although this guide focuses on OBS, it will also work with any streaming software that allows you to add a web overlay to the stream!

How does it work?

Let’s get this party started—it’s as easy as 1, 2, 3! 🎉 Here’s the quick rundown:

1. Become a Content Creator & Check Your Dashboard (https://spicerack.market/spicyfanz)

Sign up, create your awesome creator profile, and hop over to your shiny new dashboard. 🚀

2. Grab Your Magic Webhook URL (https://spicerack.market/spicyfanz/streaming)

This URL is your secret sauce! Copy the overlay webhook URL.

3. Pop the URL into Your Streaming Software

Simply drop that magical URL into your streaming software, and voilà—you’re set!

 
Ready to make it happen? Let’s dive deeper! 🥳

Step 1: Get Webhook URL for Streaming Software

In this step we create and customize the donation goal overlay:

  1. Go to this page (make sure you are logged in)
  2. Select Twitch or Youtube (You can use Youtube for all others)

You should then see the following. This is your "control panel".

Step 2: Get hold of the overlay URL

Next, we will obtain the overlay URL — which is another way of saying a "link". It will look something like this: https://spicerack.market/spicyfanz/webhooks/obs/525912702525912702d2e?twitch. This is all you need to insert the overlay into your stream.

"COPY TO CLIPBOARD" (CMD + C) button. The required link should now be copied to your clipboard.

Onto the final step!

Step 3: Insert the overlay URL into OBS

The image below shows the main OBS window with a placeholder image instead of the live stream. Some docks have been disabled to keep things simple. We are now going to go through the steps to add our new overlay.

 

First we are going to add a new "source". Go to the source window at the bottom and click on the "+" button. Then click on "browser".

Accept the defaults in the modal dialog by clicking on "OK".

In the next screen you paste the URL you created in step 2 into the "URL" field. You should also adjust the width field to 1200 and the height field to 1000. See below:

Click on OK, and your new browser source should be added and visible as below:

You can use the red frame to adjust the size of the overlay and position it as you require.
IMPORTANT: Click de Interaction Button to start getting the orders! 

Once you’ve clicked Start Stream Alerts, feel free to close this window and get back to your stream—it’s showtime!

 

Have fun! 🎬✨

Every sale pops up on your stream in real-time! 🪄✨

 

Related articles