Add google analytics to your jekyll website

Table of Contents

<a id="1"></a>Introduction

Google Analytics is a freemium web analytics service offered by Google that tracks and reports website traffic. You can visit here for more information.

In this post, we are going to add goole analytics to a jekyll website. This blog is an example website, having contained google analytics code already.

<a id="2"></a>Method

<a id="21"></a>Step One

To add google analytics, you should visit google analytics website and sign up a google account:

![image](https://raw.githubusercontent.com/LinShiwei/linshiwei.github.io/master/images/屏幕快照 2016-07-20 09.24.04.png)

![image](https://raw.githubusercontent.com/LinShiwei/linshiwei.github.io/master/images/屏幕快照 2016-07-20 09.26.22.png)

For Chinese version, you can visit here. If you have had a google account, you can log in and go to next step.

<a id="22"></a>Step Two

After you have a google account and log in google analytics website, you need to follow the guide to register for google analytics.

Choose website in this page:

![image](https://raw.githubusercontent.com/LinShiwei/linshiwei.github.io/master/images/屏幕快照 2016-07-20 09.28.39.png)

Fill in website name and website url. Select one industry category.

Then click Get Tracking ID.

Now in your google analytics page, you will get a track ID such as UA-80935640-1 and some code for website tracking:

![image](https://raw.githubusercontent.com/LinShiwei/linshiwei.github.io/master/images/屏幕快照 2016-07-20 09.30.07.png)

<a id="23"></a>Step Three

Copy the tracking code, create a google-analytics.html file in your jekyll website's _includes folder:

![image](https://raw.githubusercontent.com/LinShiwei/linshiwei.github.io/master/images/屏幕快照 2016-07-19 23.19.11.png)

Put the code in this .html file:

![image](https://raw.githubusercontent.com/LinShiwei/linshiwei.github.io/master/images/屏幕快照 2016-07-20 09.32.53.png)

<a id="24"></a>Step Four

After creating google-analytics.html with tracking code from google analytics website, you can open the footer.html file in _include folder and add include google-analytics.html in it like the following:

![image](https://raw.githubusercontent.com/LinShiwei/linshiwei.github.io/master/images/屏幕快照 2016-07-19 23.16.44.png)

This step will simply add analytics code to all pages in your website, which helps google to analyse.

<a id="25"></a>Final Step

We have added analytics code to website step by step. Now in Terminal of your website folder,let's run:

$ jekyll build

After that, you can preview your website at http://localhost:4000 by running:

$ jekyll serve

<a id="3"></a>Ending

If you use github to manage your website code, you can use github desktop to commit changes to master. The google analytics will work in no time. You can see the analytics report in your google analytics page.

By the way, if you want to know how to build your own blog in Github, here is another post for you.

My Github:LinShiwei (Lin Shiwei) · GitHub

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • PLEASE READ THE FOLLOWING APPLE DEVELOPER PROGRAM LICENSE...
    念念不忘的阅读 14,599评论 5 6
  • Correctness AdapterViewChildren Summary: AdapterViews can...
    MarcusMa阅读 12,872评论 0 6
  • 不敢去想你,怕回到那个不堪一击的自己。将自己的日程定的满满的,没有空没有缝隙去想你,只能在夜晚的梦里。
    木她西阅读 1,414评论 0 0
  • 场景:在一个java类中,需要使用某个service,但是这个类不是单例,并且无法直接取得spring中的bean...
    else05阅读 10,844评论 0 2
  • 看到标题是不是以为我把周字写错了,应该是舟,但并没有。这个词是昨天我一个同事新造出来的,为了我们每周要和老板一起开...
    杨大离阅读 2,662评论 0 0

友情链接更多精彩内容