Implementation of adding visit count function in github+Jekyll blog in one minute with JS

Add traffic function to github+Jekyll blog in one minute

Preface

There may be some friends who don’t know that github+Jekll can be used to build your own personal blog, right? ? ?
If you feel that the csdn blog is not high-end enough, or the privacy is not good, and you can't express some emotions, then you can set up a github blog, which only takes an hour. For details, see the blog post of the big guy:

One hour to build github blog: https://www.jb51.net/article/138946.htm

Also attached is my personal blog link: https://dongguanting.github.io/.

If you think what I built is good, you are welcome to fork my blog as a framework.
This article of mine is actually based on the github+jekll framework, and a pageview statistics function has been added, which is equivalent to further optimization of the blog of the big boss. This also allows everyone to see how many people have browsed themselves and increase their sense of accomplishment.

1. What is Jekll

1. Jekll is a software introduction

Jekyll is a simple free blog generation tool similar to WordPress. But it is very different from WordPress because Jekyll is just a tool for generating static web pages and does not require database support. But it can cooperate with third-party services, such as discuz. The most important thing is that Jekyll can be deployed on Github for free and can be bound to your own domain name.

Quick installation instructions for Jekll:

gem install jekyll
jekyll new my-awesome-site
cd my-awesome-site
jekyll serve
# => Now browse to http://localhost:4000

Jekyll has many themes to choose from and many plug-ins to install, all of which need to be written in the file _config.yml . However, there are very few plug-ins related to visit statistics. Another big guy said that this function can be achieved through leancloud API, but the registration is very cumbersome and I can never log in. So I found a very simple method, which is to use Busuanzi to increase the Jekyll blog visit statistics.

2. No garlic

1. Introduction to Bu Suanzi:

"Bu Suan Zi" is a minimalist webpage counter that can easily count the total visits and number of visits to your blog.
"Bu Suan Zi" is different from Baidu Statistics and Google Analytics: "Bu Suan Zi" can directly display the number of visits on your web page (or not); for websites that have been online for a while, "Bu Suan Zi" allows you to initialize the first data

2. Official website entrance

Link: http://busuanzi.ibruce.info/.

3. Usage

First, open index.html and add the following code at the appropriate location in the text:

<span id="busuanzi_container_site_pv"> 
	Total visits to this site <span id="busuanzi_value_site_pv"></span> times</span>

Two lines of code, counting done! ! !
I put it directly at the end of the index.html file, and the effect is as follows:

This shows that the number of visits to my blog is 2. Isn’t it very simple?
At the same time, you can also add this code to the appropriate location of post.html according to your needs, which can achieve paginated visits.

4. Personalization

It can also be more beautiful and complete:

Total visits to this site <span id="busuanzi_value_site_pv"></span> times Number of visitors to this site <span id="busuanzi_value_site_uv"></span> times Total readings of this article <span id="busuanzi_value_page_pv"></span> times

Or customize it (I use the one below):

Total <span id="busuanzi_value_site_pv"></span> views.
You are xxx's <span id="busuanzi_value_site_uv"></span>th friend <span id="busuanzi_value_page_pv"></span> Hits

The effect is as follows:

Summarize

Isn’t it great! If it helps, please like and bookmark it!
Welcome to my personal blog: https://dongguanting.github.io/.

This is the end of this article about how to use JS to add traffic to a blog on github+Jekyll in one minute. For more information about adding traffic to a blog on github+Jekyll, please search for previous articles on 123WORDPRESS.COM or continue to browse the following related articles. I hope you will support 123WORDPRESS.COM in the future!