原文地址:→传送门

写在前面

在五月出捣腾了一把个人博客,但是刚开始只做了一些基础设置,套路也没摸清,基础安装篇请看hexo从零开始到搭建完整,里面讲到了基础工具的安装及blog项目的文件夹含义,以及RSS添加、域名的绑定等操作,后来想着加点功能,但是奈何我选的主题集成的东西比较少,需要一比一步自己添加,于是摸索了一番。。。现在真是发现了next主题的好处,不仅持续更新,而且作者已经在主题中集成了各种功能,简直爽歪歪,不过我还是默默的接着摸索吧!下面介绍几种好用的东西。

  1. 推荐七牛云
  2. 添加百度SEO
  3. 添加谷歌SEO
  4. 添加评论系统来必力
  5. 百度统计
  6. 文章统计leanCloud
  7. 引入站长统计不蒜子

七牛云

先给大兄弟们极力推荐个好用的图床工具七牛云。么么



注:上传后的图片尽量不要修改和删除额,不然之前添加的链接就会失效啦

添加百度SEO

为了增加文章的曝光率,让别人更容易搜到你的文章,那就添加SEO吧,不过好像要下面介绍下加入百度SEO的步骤:

在百度中输入site:yourwebsite,好像要绑定了域名的网址才可以额,直接github.io的好像不行,百度站长平台

填写要提交的网址:

选择站点的相关属性:

验证你的网站(这里有三种方法,你任选一种就好了,我试了后面两种,操作简单方便。我最后使用的是第三种添加一条解析):



CNAME验证方式如下,记录类型选CNAME,主机记录就填百度给的,记录值为zz.baidu.com。

接下来要让你的网站生成网站地图,及生产sitemap,将sitemap提交到百度,先安装地图生成插件:

npm install hexo-generator-sitemap --save
npm install hexo-generator-baidu-sitemap --save

然后查看是否在根目录的_config.xml配置文件下添加了你的url:



重新部署后即可在public文件下看到sitemap.xml和baidusitemap.xml文件,在浏览器中输入你的网址/sitemap.xml即可看到所生成的地图文件,表示安装成功。

接着是提交你的sitemap到百度,点击链接提交进行提交。分为自动提交和手动提交。自动提交提供了3中方式,可以都使用,也可以只使用其中的一种:



根据提示操作即可。建议采用自动提交额,手动提交会累死人

然后进行死链提交:



提交完了等着就好了,可能要很久才生效。。。

添加谷歌SEO

作为程序boy,google是少不了的,所以也把你的网站加到谷歌SEO吧,添加到谷歌的话很快就能生效的额,大概只要几分钟吧,添加起来也是比较简单滴。当然要先自备天梯。。。

敲黑板!首先得有个谷歌账号,自由发挥吧,然后到这里添加地址去添加你的网址。

也可以现在google总共输入如下内容,然后进入到添加网站的地址:

点击添加属性后即可添加你的博客地址。

添加完成之后进行网站验证,我使用的貌似是备用方法,比较便捷。



添加好之后稍等一会儿再Google中输入关键字,就可以看到效果啦

添加评论系统来必力

评论系统真是个令我伤心的东西,我用的hueman主题也是集成了几种评论系统的,但是都是坑啊,disqus是国外的额。畅言是要备案的,友言的感觉不是很好看,之前很强大多说在6月1号关了,转战云更贴,结果宣布在8月1号正式停用。嗯!就是今天,八一建军节九十周年!此处比心~

其实后面才知道有来必力这玩意儿的,第一眼看它还有点不顺眼,原因你懂的,后来发现用的人还挺多的,于是最后还是被它征服了

官网传送门,注册的时候会出现点韩语,不过莫慌,该看懂的还是看的懂额,嗯就酱。

注册好后到管理页面去:

代码管理中获取安装代码:



(此处针对的是hueman主题,其他的应该类似)获取安装代码后,在主题的comment下新建一个文件放入刚刚那段代码,再找到article文件,找到如下代码,若没有则直接在footer后面添加即可。livebe即为刚刚所创文件名称。

<%- partial('comment/livebe') %>

完成上面步骤之后可选择性进行一些相关配置,如下:

重新部署博客后即可看到效果:

添加百度统计

百度统计也是个好东西,因为可以看到一些很详细的信息!

百度统计传送门

在管理这一栏先把要统计的网站添加进来:

然后找到代码获取,进行代码安装:

代码安装好后重新部署,再回到百度统计中进行代码安装检查,安装正确即可。

差不多等个半小时吧,再进入到报告这一栏即可查看相关数据了。

文章阅读量统计leanCloud

对于文章数量的统计,leanCloud是个好东西,官网传送门,leanCloud功能繁多,你可以好好的利用一番,这里主要讲文章阅读数量。

乖乖注册好账号之后去添加一个应用:

点击你的应用右上角的齿轮,进入到配置页面:

在存储这一栏中创建一个新的Class Name:

新的Class Name为Counter:

然后在设置页面的应用Key可查看到你的App ID及App Key:

在主题的配置文件下添加如下:

//若主题已集成则只需要加此段
leancloud_visitors:
enable: true
app_id: 你的id
app_key: 你的key

在article中适当的位置添加如下(取决于你要将它显示在何处):

阅读数量:<span id="<%= url_for(post.path) %>" class="leancloud_visitors" data-flag-title="<%- post.title %>"></span>次

在footer的最后添加如下代码:

<script src="//cdn1.lncld.net/static/js/2.5.0/av-min.js"></script>
<script>
var APP_ID = '你的app id';
var APP_KEY = '你的app key';
AV.init({
appId: APP_ID,
appKey: APP_KEY
});
// 显示次数
function showTime(Counter) {
var query = new AV.Query("Counter");
if($(".leancloud_visitors").length > 0){
var url = $(".leancloud_visitors").attr('id').trim();
// where field
query.equalTo("words", url);
// count
query.count().then(function (number) {
// There are number instances of MyClass where words equals url.
$(document.getElementById(url)).text(number? number : '--');
}, function (error) {
// error is an instance of AVError.
});
}
}
// 追加pv
function addCount(Counter) {
var url = $(".leancloud_visitors").length > 0 ? $(".leancloud_visitors").attr('id').trim() : 'icafebolger.com';
var Counter = AV.Object.extend("Counter");
var query = new Counter;
query.save({
words: url
}).then(function (object) {
})
}
$(function () {
var Counter = AV.Object.extend("Counter");
addCount(Counter);
showTime(Counter);
});
</script>

重启之后即可看到效果。

引入站长统计不蒜子

文章阅读量可以用leanCloud,那么整站统计用不蒜子还是比较方便的,只需要在footer中适当的位置添加如下代码不蒜子传送门,重新部署即可:

<script async src="//dn-lbstatics.qbox.me/busuanzi/2.3/busuanzi.pure.mini.js"></script>
<span id="busuanzi_container_site_pv">本站总访问量<span id="busuanzi_value_site_pv"></span>次</span>

不蒜子可自行DIY~

小结

  1. 搞完这些之后你会发现满满的都是账号,/(ㄒoㄒ)/~~

  2. 这些可自行选择用一些,不需要都用上额

  3. 终于要告一段落了,有的时候为了这个东东,也是很费时啊,不过弄完之后也是挺开心的,加油吧少年!

Hexo博客添加SEO-评论系统-阅读统计-站长统计的更多相关文章

  1. hexo博客添加gitalk评论系统

      经过了一天的折腾,我终于为自己的博客添加上了评论系统.坦率的讲,为什么网上那么多方案我还要自己写一篇博客,那就是因为他们说的都有bug,所以我要自己总结一下.   我选用的是gitalk评论系统, ...

  2. Jekyll博客添加Valine评论

    Jekyll博客添加Valine评论 关于github搭建jekyl博客,在这里不做过多描述,详情参考: 百度搜索关键字:github搭建jekyll博客 官网:https://www.jekyll. ...

  3. 【干货】2个小时教你hexo博客添加评论、打赏、RSS等功能 (转)

    备注:该教程基于Hexo 2.x版本,目前Hexo是3.x版本,照本教程实现有可能会出现404错误,笔者目前还未找时间去解决,待笔者找时间解决该问题后,再写一篇该问题的解决教程,给各位读者带来困扰,还 ...

  4. 为hexo博客添加基于gitment评论功能

    关于gitment gitment其实就是利用你的代码仓库的Issues,来实现评论.每一篇文章对应该代码仓库中的 一个Issues,Issues中的评论对应你的博客每篇文章中的评论.如果你是用git ...

  5. 为博客添加 Gitalk 评论插件

    背景 Disqus需要翻墙才能正常使用 畅言有广告 2种评论系统都很难统一管理 优化 使用Gitalk评论插件 , gitalk 使用 Github 帐号登录,界面干净整洁,支持 MarkDown语法 ...

  6. VuePress 博客之 SEO 优化(六)站长工具

    前言 在 <一篇带你用 VuePress + Github Pages 搭建博客>中,我们使用 VuePress 搭建了一个博客,最终的效果查看:TypeScript 中文文档. 本篇接着 ...

  7. Hexo 博客快速整合gitalk组件,给静态博客添加动态评论功能!

    什么是 hexo-plugin-gitalk

  8. hexo博客添加功能

    设置Hexo主题模式 Hexo主题中,有三种不同的模式,通过切换模式,让NexT主题显示不一样的样式.在NexT根目录下有一个同样名称为_config.yml,为了区分hexo根目录下的_config ...

  9. [转]Hexo博客添加访问统计 - 记录

    引入不蒜子 <script async src="//dn-lbstatics.qbox.me/busuanzi/2.3/busuanzi.pure.mini.js"> ...

随机推荐

  1. JSON 转换异常 multipartRequestHandler servletWrapper

    下面出现红色的字还有警告,解决方法:本人项目是struts1 from类继承了“extends ActionForm” .把它去掉就行了.如果你是其它的框架一定是继承引起的作个参考吧. ....... ...

  2. 删除iPhone图片,提示“没有删除此项目的权限”

    解决方法:设置-照片与相机-iCloud照片图库-关闭 (IOS10)

  3. Scrapy中使用cookie免于验证登录和模拟登录

    Scrapy中使用cookie免于验证登录和模拟登录 引言 python爬虫我认为最困难的问题一个是ip代理,另外一个就是模拟登录了,更操蛋的就是模拟登录了之后还有验证码,真的是不让人省心,不过既然有 ...

  4. 移动端响应式布局+rem+calc()

    1.媒体查询:@media only screen and (max-width: ) {},在最初做pc端时,使用各种媒体查询,因为pc的屏幕分辨率总共就几种,不嫌麻烦的重复使用类名.有很大的缺陷就 ...

  5. React Native 仿天猫物流跟踪时间轴

    最近心血来潮开始学习ReactNative,正好最近有一个项目可能会用到时间轴,页面原型类似于天猫的物流跟踪,如下图 分析之后决定使用ListView来实现,左边的时间轴则使用Art来绘制. 分析左边 ...

  6. JS如何实现真正的对象常量

    前言 众所周知ES6新增的const关键字可以用来声明常量,但是它只对基本数据类型生效(Number.String.Boolean等),那如果我们想声明一个常量对象呢?该如何实现,Object内置对象 ...

  7. JAVA反射原理

    什么是反射? 反射,一种计算机处理方式.是程序可以访问.检测和修改它本身状态或行为的一种能力.java反射使得我们可以在程序运行时动态加载一个类,动态获取类的基本信息和定义的方法,构造函数,域等.除了 ...

  8. MySQL如何有效的存储IP地址及字符串IP和数值之间如何转换

    mysql> select inet_aton('192.168.0.1'); +--------------------------+ | inet_aton('192.168.0.1') | ...

  9. 常用PHP函数的封装

    PHP获取文件扩展名(后缀) function getExtension($filename){ $myext = substr($filename, strrpos($filename, '.')) ...

  10. ajax请求返回数据,模板中的数据处理

    /*ajax请求返回数据,模板中的数据处理*/ function QueryGameAsset(){ var new_start_time=$('#new_start_time').val();//开 ...