.. meta:: :description lang=en: How to use Google Analytics with a beacon image :description lang=fr: Comment utiliser Google Analytics avec une petite image :keywords: Google, Google Analytics, beacon, image, picture, without javascript, Google Analytics without javascript, Google Analytics with a picture, Google Analytics with an image, beacon analytics, beacon Google Analytics ################################################# How to use Google Analytics with a beacon image ################################################# .. warning:: I no longer advise to use Google Analytics, and I have entirely removed it from my webpages, and I will no longer update these tutorials. As they would still be available from Google Cache or Archive.org websites, I prefer to keep this page online. .. note:: This short page is focusing on *Google Analytics* For more information, it might be useful to consult first one of these pages: * `en.wikipedia.org/wiki/Google_Analytics `_, * `www.google.com/analytics `_. This page will explain to you how to use Google Analytics when you do not have support for Javascript, and how to use Google Analytics with an image (a picture) loaded from a web-page. « Vanilla » Google Analytics code --------------------------------- The default code to add in every page is the following piece of JavaScript (at least, it was the case in January 2015): .. code-block:: javascript (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','//www.google-analytics.com/analytics.js','ga'); ga('create', 'UA-38514290-15', 'ga-beacon.appspot.com'); ga('send', 'pageview'); ------------------------------------------------------------------------------ .. sidebar:: A popular page? Apparently, this `very page `_ became quite popular *recently* (fall 2014), receiving more visitors than any of my other webpages. `Any feedback about it is therefore most surely welcome! `_. For example, `that page <#>`_ comes as the **second** Google result for "google analytics beacon" in English, and **First** in French (cf. `this search result `_ in English or `this one `_ in French) and also `forth DuckDuckGo French result `_. A smaller piece of code ----------------------- And also easier to maintain! You just have to create a small ``ga.js`` script containing the previous piece of code, and add it somewhere on your website. For instance: `ga.js `_. Then you have to load it in every webpage with one-line of ``HTML`` code at the end of the file (in the ```` paragraph or at the end of ````): .. code-block:: html (Moreover, the ``async`` tag will improve the speed of the page, by loading asynchronously the ``ga.js`` script. Cool!) ------------------------------------------------------------------------------ A pretty nice idea ------------------ That `blog post`_ explains how to use **one** image, or even a single pixel to emulate a communication with Google Analytics. This tutorial explain how to add Google Analytics spying capacity to any piece of HTML, as any webpage, but even for an email ! The main example he gives is for a `Github `_ project homepage, that have to be written in ``Markdown``, without any ``