How-to Add Fathom Analytics to Jekyll

In this tutorial I'll show you how-to add self-hosted Fathom Analytics to  your Jekyll theme.

First, open the default.html file and add the following code between the <head></head> HTML tags:

{% if site.fathom_analytics %}
<script>
(function(f, a, t, h, o, m){
	a[h]=a[h]||function(){
		(a[h].q=a[h].q||[]).push(arguments)
	};
	o=f.createElement('script'),
	m=f.getElementsByTagName('script')[0];
	o.async=1; o.src=t; o.id='fathom-script';
	m.parentNode.insertBefore(o,m)
})(document, window, '//domainname.com/tracker.js', 'fathom');
fathom('set', 'siteId', '{{ site.fathom_analytics }}');
fathom('trackPageview');
</script>
{% endif %}

Remember to change domainname.com with the hostname where your Fathom Analytics is installed.

Next open the _config.yml file and add your Fathom Analytics tracking ID.

fathom_analytics: ABCDE

That's it, you're done!

Brandon Himpfen
Blogger. Developer. Designer. Programmer. Photographer. Traveller. Digital Marketer. Gamer.