I love stats

If you are like me, then you will also be fascinated in the visitor stats to your website. You will get excited when there are more than a certain number of visitors to your site.

You might spend a while looking at the realtime stats watching it, waiting to see the numbers go up. You might miss it when there are a lot of visitors to your site and you might wish there was a way you could be notified of a large volume of users on your site in realtime.

Well with this code you can set it up to send you a notification when the number of realtime visitors gets to the amount you are interested in.

enter image description here

Using Google Analytics Realtime Metrics

With this code, you can open up google analytics, go to the realtime overview page, right click on the realtime number of visitors and click on inspect. Then go to the console tab and paste in this code. You will need to replace the slack webhook url with your own.

Give me the code

(function checkStats() {
    var threshold = 10;
    var waitTimeInSeconds = 30;
    var number=document.getElementById("ID-overviewCounterValue").innerHTML;
    if(number > threshold) {
        var url = "https://hooks.slack.com/services/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"; //replace this with your slack webhook url
        var text = "There are " + number + " visitors on the site right now.";
        $.ajax({
            data: 'payload=' + JSON.stringify({
                "text": text
            }),
            dataType: 'json',
            processData: false,
            type: 'POST',
            url: url
        });
    }
    setTimeout(checkStats, waitTimeInSeconds * 1000);
})();

Registering for your WebHook Url with Slack

Click here to set up an incoming WebHook

  • Sign in to Slack
  • Choose a channel to post to
  • Then click on the green button Add Incoming WebHooks integration
  • You will be given a WebHook Url. Keep this private.

Make sure you replace the url in the code with your slack webhook url

Too many notifications?

Edit the threshold number and the number of seconds to suit your site volume and frequency of checking.

If it annoys you, just refresh the page and repeat the steps and edit the threshold and seconds to do the check less frequently.

Chrome Extension?

You might be thinking this should be a chrome extension. There are already some out there, some are free and some are paid for. I just wanted to get something simple that works for me. Feel free to take my code and use it in a Chrome Extension, but if you do, please make it a free one.

Want to thank me?

If I've helped you out and you want to thank me, why not buy me a coffee?

About the author

Paul Seal

Umbraco MVP and .NET Web Developer from Derby (UK) who specialises in building Content Management System (CMS) websites using MVC with Umbraco as a framework. Paul is passionate about web development and programming as a whole. Apart from when he's with his wife and son, if he's not writing code, he's thinking about it or listening to a podcast about it.

Related Posts

How to include scripts from partial views in MVC and Umbraco

This post will show you how you can include scripts from inside an MVC partial view rather than havi…

Read Post

How to get the swagger JSON file from a Web API

If you need to know the url to get the swagger json file, then this is the post for you.

Read Post

What is Visual Studio Live Share and how do you use it?

This post shows you how to get set up to start using Visual Studio Live Share for remote pair progra…

Read Post

3 Features of ES7 (and Beyond) That You Should Be Using, Now

JavaScript is anything but a "static" language (pun intended). It seems everything is changing - eve…

Read Post