AMP measurement support

[metmarkosaric]

"My website supports AMP. Given that AMP is growing, measuring this would be key for me. The AMP standard is an open one. There were more than 55 analytics providers supporting AMP even in 2018, like Amplitude or Adobe Analytics or New Relic. Here's a link with a bunch of the AMP API spec for many providers."

feedback via email

[gergelyorosz]

There are now 75 analytics vendors who are compatible with AMP (full list is here).

Here is the documentation on how to be added as an AMP vendor: https://amp.dev/documentation/components/amp-analytics/ . Here's an example PR for RudderStack on being added as a vendor or one for BlueConic.

[tckb]

@gergelyorosz I plan to add this in my next PR. Keep a watch

[davidsteeb]

Any news on this? If you need support in testing let me know, eager to try this.

[HopsWrites]

Hey Plausible,

After inspecting my main URL on Search Console, it said the “AMP Page is invalid” due to custom Javascript not being allowed. The only custom script I have is Plausible's.

Google is moving to indexing only mobile-responsive pages.

Any updates on AMP and Plausible?

Thanks, and LOVE Plausible so far! (-:

[metmarkosaric]

Thanks, glad to hear that! We're about to release metadata for goals and after that our roadmap is focused on other popular requests (browser/os versions, API, export/import). After that we'll consider what to do next and see if we can put AMP on the roadmap at that point. Obviously if there's a PR before, we'll happily merge it. You don't have a native mobile responsive page but only an AMP?

[HopsWrites]

Thanks for getting back! Well, I revised my blog using Publii, which offers code injection for both the main site (which is mobile responsive), and AMP. I had placed Plausible code in both Headers, but Google Search Console said the custom Javascript invalidated my AMP page. No idea why. I removed the code from AMP for now. My blog is at blog.hopswrites.com Thanks for your time.

…

-Jordan

On Thu, Oct 29, 2020 at 4:22 AM Marko Saric ***@***.***> wrote: Thanks, glad to hear that! We're about to release metadata for goals and after that our roadmap <https://github.com/plausible/analytics/projects/1> is focused on other popular requests (browser/os versions, API, export/import). After that we'll consider what to do next and see if we can put AMP on the roadmap at that point. Obviously if there's a PR before, we'll happily merge it. You don't have a native mobile responsive page but only an AMP? — You are receiving this because you commented. Reply to this email directly, view it on GitHub <https://github.com/plausible/analytics/issues/220#issuecomment-718469856>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ARRV7IR7GBZ6BUYYBK6FA2DSNEQ43ANCNFSM4OYRMDJQ> .

[metmarkosaric]

Makes sense. Can see that your blog is mobile responsive on its own too. For AMP, we'll need to be added as a vendor before Plausible can be used on AMP pages.

[HopsWrites]

Thanks for checking and replying!

…

On Thu, Oct 29, 2020, 8:42 AM Marko Saric ***@***.***> wrote: Makes sense. Can see that your blog is mobile responsive on its own too. For AMP, we'll need to be added as a vendor before Plausible can be used on AMP pages. — You are receiving this because you commented. Reply to this email directly, view it on GitHub <https://github.com/plausible/analytics/issues/220#issuecomment-718727157>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ARRV7ISGK5B67IPCZRZ3ILLSNFPK7ANCNFSM4OYRMDJQ> .

[kingpalethe]

This is something we need also. AMP is totally anti-competitive, and is one of the reasons the U.S. States are suing Google, but until Google is brought into line, we need to play by their rules, which basically require AMP.

[squareloop1]

I agree. AMP is sadly a must have. Is there any workaround on how we can push some basic metrics into plausible from AMP pages in the meantime?

This is currently a showstopper, especially for larger content websites where almost 90% of traffic is hitting the AMP pages.

[squareloop1]

I will definetly look into this as soon as the API beta is out and will let you know if I can fiddle something together in AMP that works with plausible. Is there any ETA on the beta?

[metmarkosaric]

cool! we don't have any ETA but as mentioned we're working on it right now and it is priority number 1. stay tuned!

[ukutaht]

I'm aiming for next week @squareloop1

[squareloop1]

Is there any news on this? I've seen there is now an API available but only to read and not to push data into it.

[metmarkosaric]

the beta version of our Stats API is now out and we're collecting feedback from users before releasing version 1.0. in the meanwhile we're focusing on some other frequently requested features such as entry/exit pages and user accounts. when the Stats API hits 1.0 we will work on 2.0 version which will also allow you to send pageviews/goals and not only read. i cannot promise any timeline on this as we're taking it one step at a time.

[Bammede]

Is it possible to generate Plausible's tracking code for AMP pages already?

[squareloop1]

Now that the API is in the 1.3.0 release, is there any chance the next step is an API endpoint to push custom data from AMP pages into plausible or any other method to track AMP pages with plausible?

I really want to migrate all sites to plausible but its just not possible while it still does not support at least basic tracking on AMP pages too.

[metmarkosaric]

From next month, there will no longer be any preferential treatment for AMP pages in Google's search results! https://plausible.io/blog/google-amp

[squareloop1]

Yes, this is a big move to finally get rid of AMP again. But I would say we still need at least basic AMP tracking in plausible as it won't get erased instantly from the internet in the next month as many publishers already have a working AMP setup.

As many publishers already have AMP implemented anyways and google will still prefer mobile pages by its performance you'd need to make your non-AMP page is at least as fast as the AMP version to profit from the new ranking algorithm, which is not as simple as it might first look like. AMP is a pain in the ass, I agree, but it is also very performant, making it hard to outperform on a non-AMP page.

Also plausible already has the needed architecture available and implementing basic AMP tracking should not be a big issue. As you can read in the docs (https://amp.dev/documentation/components/amp-analytics/) we would just need to define data getting send to an API endpoint in plausible.

I would devote some time to it and create a PR but sadly I am unfamiliar with Elixir.

[squareloop1]

After finally putting some time into this I figured out it is totally doable to track AMP with plausible already. We don't need to implement any new feature for this. Maybe we could just mention it in the docs on how to do this.

To track AMP request and outbound links with plausible you need to declare an amp-analytics object on your AMP pages like this:

<amp-analytics>
    <script type="application/json">
        {
            "vars": {
                "dataDomain": "example.com"
            },
            "requests": {
                "event": "https://plausible.io/api/event"
            },
            "extraUrlParams": {
                "u": "${sourceUrl}",
                "r": "${documentReferrer}",
                "w": "${viewportWidth}",
                "d": "${dataDomain}"
            },
            "triggers": {
                "trackPageview": {
                    "on": "visible",
                    "request": "event",
                    "extraUrlParams": {
                        "n": "pageview"
                    }
                },
                "trackOutboundLinks": {
                    "on": "click",
                    "request": "event",
                    "selector": "a[href*='https://']:not([href*='${sourceHost}'])",
                    "extraUrlParams": {
                        "n": "Outbound Link: Click",
                        "p": "{\"url\":\"${clickUrl}\"}"
                    }
                }
            },
            "transport": {
                "beacon": true,
                "xhrpost": true,
                "image": false,
                "useBody": true
            }
        }
    </script>
</amp-analytics>

The ${clickUrl} variable needs to be set on outbound links as data attribute. You can also add other events to define custom goals. More details on this can be found here: https://amp.dev/documentation/components/amp-analytics/#send-data-in-house

[iamkingsleyf]

We use the official AMP plugin for Wordpress and here is how the code was able to work https://imgur.com/gUp316w it did not accept
<script type="application/json"> when i tried adding all.

what platform are you using

[iamkingsleyf]

From the source code those script part is being added, but the problem is plausible does not track the amp URL just the normal url

[pawelslabiak]

Thank you @squareloop1 for sharing this here and @metmarkosaric for including this in Plausible's documentation. I run a WP website and use Plausible's WP plugin, but needed to extend it to track posts published via Google's Web Stories plugin, which uses AMP.

@squareloop1's code, combined with code examples by @swissspidy (see https://wordpress.org/support/topic/analytics-not-ga/) gave me the solution. I run this via the Code Snippets plugin, although it could also be implemented as a site-specific plugin.

In case it's useful for anyone else, here's the complete snippet:

<?php
add_action(
	'web_stories_print_analytics',
	static function () {
		?>
		<amp-analytics>
            <script type="application/json"> {
                "vars": {
                    "dataDomain": "yourdomain.com"
                },
                "requests": {
                    "event": "https://plausible.io/api/event"
                },
                "extraUrlParams": {
                    "u": "${sourceUrl}",
                    "r": "${documentReferrer}",
                    "w": "${viewportWidth}",
                    "d": "${dataDomain}"
                },
                "triggers": {
                    "trackPageview": {
                        "on": "visible",
                        "request": "event",
                        "extraUrlParams": {
                            "n": "pageview"
                        }
                    },
                    "trackOutboundLinks": {
                        "on": "click",
                        "request": "event",
                        "selector": "a[href*='https://']:not([href*='${sourceHost}'])",
                        "extraUrlParams": {
                            "n": "Outbound Link: Click",
                            "p": "{\"url\":\"${clickUrl}\"}"
                        }
                    }
                },
                "transport": {
                    "beacon": true,
                    "xhrpost": true,
                    "image": false,
                    "useBody": true
                }
            }
        </script>
    </amp-analytics>
    <?php
    }
);

Remember to replace "yourdomain.com" with your Plausible data domain.

The one wrinkle here is outbound-link tracking. @squareloop1 mentions that

The ${clickUrl} variable needs to be set on outbound links as data attribute.

I'm not sure what this means and haven't done any additional configuration besides running the code shown above, hence the outbound links on web stories are not tracked on the site in question. Would love to understand better how to make this work.

[squareloop1]

The ${clickUrl} variable needs to be set on outbound links as data attribute.

I'm not sure what this means and haven't done any additional configuration besides running the code shown above, hence the outbound links on web stories are not tracked on the site in question. Would love to understand better how to make this work.

Its been a while since I've implemented this, but I think the way is to set a data-vars-click-url attribute on outbound link tags. So e.g. like this:
<a href="https://google.com" data-vars-click-url="https://google.com">

and the variable ${clickUrl} will get populated with the corresponding URL and it will track the outbound link.

[pawelslabiak]

Awesome—thank you, @squareloop1, for explaining this!

[kpnigalye]

@squareloop1 The script worked for me. I have noticed one thing. I opened my site on my mobile browser and its still showed up under desktop device. Its using ${viewportWidth} for calculating width. Not sure why its showing the screen size as desktop. But it identifies the device properly.

[dynamicplus]

That's why the "w" (or "screen_width") parameter is not casted to an integer if passed as numeric string.