Ever been on your homepage, or your blog and wanted to show the number of visitors currently on this page? Let’s find out how to make that happen.
Using the GoSquared API, you can use GoSquared’s real-time analytics engine to grab the data for a specific page. This can be shown on the page to engage your visitors, or even be used to optimise the page. If there are a lot of people viewing a certain product on your Ecommerce site, could you offer them a discount to help them convert? If lots of people are highly engaged, why not push them to share or browse more content?
Note: this tutorial requires jQuery!
We strongly recommend using a simple proxy to get the API data so your API key isn’t exposed publicly and using a cache so you won’t hit your API limits if you have a lot of visitors.
Getting the real-time data and displaying the current number of visitors on a certain page can be done using the following code.
Get data for the current page
To display the stats for the currently active page, you can use
window.location.href to get the URL and pass that as the
href parameter to our API. For the Team Fortress 2 demo site this would look as follows…
Update on an interval
The number of people online updates in real-time, so when new people come online or when people leave we can update our figure.
Animate the updates
Animating numbers looks nice, especially if the number is changing by a few visitors every time.
Using Engaged Time
On a per-page level, we track the total amount of time the current visitors have been engaged (actively interacting with the page). This can be great for blogs to adapt content based on how engaged their current visitors are.
In the wild
We’re using the GoSquared API on the new Global Metrics section of the site. Check out our iOS 8 adoption page – the counter is at the bottom. We’ve also seen lots of our customers implement a huge range of ideas with the API. One cool use – a few customers have integrated the per page API metrics with their CMS to display the current number of people online while they’re editing a page.
What are you waiting for? Start using the GoSquared API today! We can’t wait to see what you build.