How to embed web analytics in your platform

When it comes to product and web analytics, there are a lot of different platforms out there. But what if you want to use those analytics on your own platform to increase your platform's value?

Fortunately, it is possible to embed web analytics in your platform. Doing so can provide you with a wealth of data that can be used to improve your platform.

There are a few different ways to embed web analytics in your platform using Logspot. One way is to use an embeddable dashboard. Another way is to use an API solution.

Whichever method you choose, there are a few things to keep in mind. First, you must ensure that the web tracking is turned on on your platform. Second, you need to ensure that the data collected is accurate.

What are in-app web analytics?

In-app web analytics is all about how users interact with your platform displayed inside your platform.

This data can be used to improve the user experience and conversions. In-app web analytics can be used to track page views, session duration, and bounce rate.

How your customers can benefit from in-app web analytics?

Your customers can benefit from in-app web analytics in several ways.

Perhaps the most obvious way is that they can use the data to improve their marketing efforts. By understanding how users interact with their content, they can segment their audience and target them more effectively.

Additionally, they can use web analytics to track conversions and other key metrics. This data can be used to improve their content, for example, by redesigning the app to make it more user-friendly or by adding features that users are requesting. // TODO

Ultimately, by using Logspot's web analytics, you can quickly increase the value of your platform which will result in an increase in the number of customers.

How to embed analytics in your platform?

If you want to embed web analytics in your platform, there are a few things you need to do.

Adding web tracking

First, you need to start tracking your platform with Logspot. There are many different ways of doing that, but the simplest is to start with the web snippet.

Defining unique identifier

Once you have installed the web tracking, you will need to add some super properties to distinguish each customer's data e.g. customerId or any other unique id which makes sense to you. If you serve customer content on different domains, you can distinguish it by the domain.

Getting access token

Next, you will need to get the one-time access token to enable viewing selected data.

You will need to make a POST request to https://api.logspot.io/embed/ott.

Example

axios.post('https://api.logspot.io/embed/ott', {}, {
    headers: {
        'x-logspot-sk': 'YOUR_PROJECT_SECRET'
    }
});

You can also apply filters to the embedded analytics. By default, the generated token will allow viewing of all data.

Example with filters

axios.post('https://api.logspot.io/embed/ott', {
    filters: [{
        fieldName: "hostname",
        operator: "=",
        value: "my-customer.platform.com"
    }],
}, {
    headers: {
        'x-logspot-sk': 'YOUR_PROJECT_SECRET'
    }
});

Embed dashboard

Finally, you can embed web analytics into your platform by simplifying embedding the following code snippet.

<iframe
    src="<https://embed.logspot.io/?token=YOUR_ACCESS_TOKEN>"
    width="100%"
    height="800px"
    frameborder="0">
</iframe>

You can also use our In-app analytics library which allows you to customize the user experience.

Customized widgets

Things you can customize with your dashboard:

• filters
• widgets
• theme
• primary color

You can build your own dashboard based on what you need.

Install JS snippet

The basic setup will result in what you can get from the IFrame solution - default widgets from Logspot's dashboard.

<script>
    !function(e,t,s,n,o,c,p){e[o]=e[o]||function(){(e[o].q=e[o].q||[]).push(arguments)},c=t.createElement(s),p=t.getElementsByTagName(s)[0],c.async=1,c.src=n,p.parentNode.insertBefore(c,p)}(window,document,"script","<https://embed.logspot.io/d.js","LogspotEmbed>");

    LogspotEmbed({
        elementId: "HTML_ELEMENT_ID",
        accessToken: "YOUR_ACCESS_TOKEN",
    });
</script>

<div style="width:100%" id="HTML_ELEMENT_ID"></div>

Defining your custom widgets

You can embed the following widgets into your dashboard:

• DAU - displays unique users chart with live users count
• EVENT - displays line chart with an event count
• AGGREGATION_BY_PROPERTY - allows you to display a breakdown by event properties
• REFERRER - displays information about pageview referrers
• COUNTRY - displays country statistics
• CAMPAIGNS - displays UTM tags breakdown

LogspotEmbed({
    ...
    widgets: [{
            type: "DAU",
        },
        {
            type: "EVENT",
            params: {
                title: "Pageview",
                eventName: "Pageview",
            },
        },
        {
            type: "REFERRER",
            params: {
                title: "Top sources",
            },
        },
        {
            type: "COUNTRY",
            params: {
                title: "Country",
            },
        },
        {
            type: "AGGREGATION_BY_PROPERTY",
            params: {
                title: "OS",
                property: "_os",
                eventName: "Pageview",
            },
        },
        {
            type: "AGGREGATION_BY_PROPERTY",
            params: {
                title: "Language",
                property: "_language",
                eventName: "Pageview",
            },
        },
        {
            type: "CAMPAIGNS",
            params: {
                title: "Campaigns",
            },
        },
    ],
});

Adjusting to your branding

The embedded dashboard has a transparent background, so it can adjust to your site. What's more, you can customize the primary color to match your branding perfectly.

Dark theme

If your site does support dark mode, you can also enable it on the embedded dashboard.

There are two modes that you can use:

• forced theme
• automatic theme

Does your platform need embedded product analytics?

As more and more platforms are created, the need for web/product analytics will continue to rise. By embedding web analytics in your platform, you can make sure that your platform is providing the most accurate and up-to-date data possible. This will help your clients make better decisions while using your platform, and ultimately improve their content experience.