【记录向】hexo不蒜子统计阅读量和站点信息
2020-11-05 837 字  

1、Orange主题下插入页面内阅读量

orange 主题没有自带不蒜子计数,我们可以添加几行代码就解决。是个十分简单的操作。

1.1、相关代码

<script asyncsrc="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>

<span id="busuanzi_container_site_pv">
本站总访问量<span id="busuanzi_value_site_pv"></span>次</span>

第一行代码是在所需要用到不蒜子计数(页面内阅读、总站点计数)引入脚本。

这里为防止网址失效,建议将打开网址后对应的内容下载到本地并保存为.js格式放入你所选用的主题对应的js文件夹。

不蒜子提供两种算法模式:

pv方式计算点击量,同一个用户连续点击n篇文章,记录n次访问量:

<span id="busuanzi_container_site_pv">

uv方式计算ip地址(用户),同一个用户多次点击n篇文章,只算1次访问量:

<span id="busuanzi_container_site_uv">

1.2、页面阅读量

在Orange主题或其他非next主题的post.ejs文件里合适的位置插入:

<script async src="/js/busuanzi.pure.mini.js"></script>

<i class="iconfont icon-eye"> </i><span id="busuanzi_value_page_pv"> </span> 次

第一项是我本地保存busuanzi.pure.mini.js文件的路径。这里我为了和字数统计保持一致,稍微修改了一点,没有使用汉字。效果图:

image-20201105102221371

本地调试时可能数字无限大,等部署到网络就会正常了。

2 、引入站点信息

2.1、站点信息没有居中对齐

理论上站点信息就是在footer.ejs文件内做如上相同就好了,但我遇到一个奇妙的bug。bug体质再次发作。

我引入脚本和代码调试,文字信息出是出来了……但,它好难看!它没有像其他文字一样居中对齐,而是跑到了最左边……这是什么毛病!!

经过各种作死尝试,发现了是Orange这个主题的footer文件写的时候都强调了居中,于是稍微改了一下代码:

 <div class="vistor">
          您是某西的第<span id="busuanzi_value_site_uv"></span>个小伙伴
  </div>

我也跟着强调一下,并把这一行文字做了一个类。

三联之后无事发生……因为我定义了class后没去css文件里修改了……

2.2、页脚的站点信息美化

当然你想放在页头header也行,看你的博客布局,我这是比较适合放在页脚。

要是站点信息能和看板娘结合就更美妙了,比如猫猫说“欢迎第XX位客人来撸我”停下来你在想什么不要给自己挖坑!~~

打开主题文件source里css文件夹,寻找到可能性最大的那个文件,什么main,base这种命名,大致就是用来渲染页面文字效果的。

找到页脚信息:

image-20201105104902256

依葫芦画瓢插入vistor项,我只设置了居中,其他文字大小颜色这种也可以按喜好调整。

然后,三联,站点信息居中对齐了。效果图:

还是不好看,不过最初目的达到了,接下来就慢慢调整咯。