增加博客运行时间和阅读统计 | Blog 折腾小记（2）

博主： WithdewHua
发布时间：2018 年 09 月 16 日
1044次浏览
暂无评论
1477字数
分类：笔记•记录

## 博客运行时间

为博客添加运行时间，效果如图所示：  
  <img  src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAABS2lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4KPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxMzggNzkuMTU5ODI0LCAyMDE2LzA5LzE0LTAxOjA5OjAxICAgICAgICAiPgogPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4KICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIi8+CiA8L3JkZjpSREY+CjwveDp4bXBtZXRhPgo8P3hwYWNrZXQgZW5kPSJyIj8+IEmuOgAAAA1JREFUCJljePfx038ACXMD0ZVlJAYAAAAASUVORK5CYII=" data-original="https://i.loli.net/2018/09/16/5b9d71e97a2e7.png" />

具体[实现代码](http://www.52xybk.top/post/2)如下，将该段代码加入到`footer.html`里面即可。

```javascript
<center>
露水已存留 <SPAN id=span_dt_dt style="color: #0196e3;"></SPAN>  //名字自己修改
<SCRIPT language=javascript>
function show_date_time(){
window.setTimeout("show_date_time()", 1000);
BirthDay=new Date("9/13/2018 00:00:00");//日期自己修改
today=new Date();
timeold=(today.getTime()-BirthDay.getTime());
sectimeold=timeold/1000
secondsold=Math.floor(sectimeold);
msPerDay=24*60*60*1000
e_daysold=timeold/msPerDay
daysold=Math.floor(e_daysold);
e_hrsold=(e_daysold-daysold)*24;
hrsold=Math.floor(e_hrsold);
e_minsold=(e_hrsold-hrsold)*60;
minsold=Math.floor((e_hrsold-hrsold)*60);
seconds=Math.floor((e_minsold-minsold)*60);
span_dt_dt.innerHTML=""+daysold+"天"+hrsold+"小时"+minsold+"分"+seconds+"秒";
}
show_date_time();
</SCRIPT>
</center>
```

## 利用[不蒜子](http://busuanzi.ibruce.info/)增加阅读量统计

**感谢[不蒜子](https://busuanzi.ibruce.info/)提供的免费服务**

### 安装脚本

```html
<script async src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>
```

该脚本文件同样添加到`footer.html`中，如图  
  <img  src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAABS2lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4KPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxMzggNzkuMTU5ODI0LCAyMDE2LzA5LzE0LTAxOjA5OjAxICAgICAgICAiPgogPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4KICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIi8+CiA8L3JkZjpSREY+CjwveDp4bXBtZXRhPgo8P3hwYWNrZXQgZW5kPSJyIj8+IEmuOgAAAA1JREFUCJljePfx038ACXMD0ZVlJAYAAAAASUVORK5CYII=" data-original="https://i.loli.net/2018/09/16/5b9d7717ca803.png" />

### 安装标签

* 网站访问量

代码如下：

```html
<span id="busuanzi_container_site_uv">
您是本站第<span id="busuanzi_value_site_uv"></span>位小伙伴
</span>
```

写在 `footer.html`中，位置如图，里面的文字可以自己修改。

* 单页面访问次数

代码如下，出自[LingLinyp的`Github`](https://github.com/LingLinyp/LingLinyp.github.io)

```html
<span class="meta"><i class="fa fa-user" aria-hidden="true"></i>&nbsp;{% if site.author %}{{ site.author }}{% else %}{{ site.title }}{% endif %}&nbsp;&nbsp;&nbsp;<i class="fa fa-calendar" aria-hidden="true"></i>&nbsp;&nbsp;{{ page.date | date: "%Y-%m-%d" }}&nbsp;&nbsp;&nbsp;<i class="fa fa-check-square-o" aria-hidden="true"></i>{{ content | strip_html | strip_newlines | size }}&nbsp;words&nbsp;&nbsp;<span id="busuanzi_container_page_pv">
                    <i class="fa fa-eye" aria-hidden="true"></i>&nbsp;<span id="busuanzi_value_page_pv">&</span>&nbsp;views</span>
```

该段代码写在 `post.html`中，位置如图：

最后修改：2019 年 12 月 21 日 12 : 44 AM