我的博客搭建日志

博客地址：绵绵小站

该篇博客原文：我的博客搭建日记-绵绵小站

我的博客搭建是以Github Pages为托管，使用Hexo的NexT模板，博客内容编写利用MarkDown排版方式，图片放在七牛云上，评论插件使用Hypercomments，文章阅读量统计使用LeanCloud。

本篇主要记录我在搭建中所遇到的问题以及着重想讲的部分，具体的搭建步骤，我会提供我所参考的设置文章。

Github Pages

账号注册

安装git

新建仓库(两种方式)

博客源码托管到Coding

参考Hexo博客(10)部署到Coding.net

Hexo

安装Hexo

发表文章

选择主题

配置修改主题

阅读全文：

参考 Hexo-设置阅读全文

文章进入是否定位到more标签后，设置修改

# Automatically scroll page to section which is under <!-- more --> mark.
scroll_to_more: false

图标设置（fonticon）字体设置

设置代码高亮主题

背景的设置

参考【置顶】Hexo搭建博客教程-背景的设置

一点优化，移动端不加载背景图。
在_layout.swig底部</body>标签前，加上移动端浏览器内核判断语句，当为PC端浏览器时，加载背景js

<!--移动端判断，是否引入背景-->
<script>
var browser={
versions:function(){
var u = navigator.userAgent, app = navigator.appVersion;
return {//移动终端浏览器版本信息
trident: u.indexOf('Trident') > -1, //IE内核
presto: u.indexOf('Presto') > -1, //opera内核
webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或者uc浏览器
iPhone: u.indexOf('iPhone') > -1 , //是否为iPhone或者QQHD浏览器
iPad: u.indexOf('iPad') > -1, //是否iPad
webApp: u.indexOf('Safari') == -1 //是否web应该程序，没有头部与底部
};
}(),
language:(navigator.browserLanguage || navigator.language).toLowerCase()
}
 
if(browser.versions.mobile || browser.versions.ios || browser.versions.android ||
browser.versions.iPhone || browser.versions.iPad){
 
}else{
document.write("<script type=\'text/javascript\' src=\'/js/src/particle.js\'><\/script>");
}
 
</script>

 

博文压缩 

MarkDown排版

基本语法

编辑器选择(不存在真正使用感良好的产品)

七牛云

注册

设置

域名绑定cdn

图片样式使用

Hypercomments评论

注册设置

LeanCloud文章阅读量统计

设置

阅读量数字不显示的bug修复方案，参考

最简便的方法搭建Hexo+Github博客,基于Next主题-中给文章添加阅读量的部分

以上方案和最新hexo版本中阅读统计方法重复，

• 删除对\themes\next\layout\_scripts下lean-analytics.swig文件以及\themes\next\layout\_macro post.swig中代码的修改；

• 修改\themes\next\layout\_third-party\analytics目录下的lean-analytics.swig文件（不知是否为初始版本，可先验证再觉得是否修改）

{% if theme.leancloud_visitors.enable %}
  {# custom analytics part create by xiamo #}
  <script src="https://cdn1.lncld.net/static/js/av-core-mini-0.6.1.js"></script>
  <script>AV.initialize("{{theme.leancloud_visitors.app_id}}", "{{theme.leancloud_visitors.app_key}}");</script>
  <script>
    function showTime(Counter) {
    var query = new AV.Query(Counter);
    $(".leancloud_visitors").each(function() {
        var url = $(this).attr("id").trim();
        query.equalTo("url", url);
        query.find({
            success: function(results) {
                if (results.length == 0) {
                    var content = $(document.getElementById(url)).text() + ': 0';
                    $(document.getElementById(url)).text(content);
                    return;
                }
                //删除多余的一重循环，该项循化将当前点击率和之前该文章的错误点击率字符串链接
                //for (var i = 0; i < results.length; i++) {
                    var object = results[0];
                    var content = $(document.getElementById(url)).text() + ': ' + object.get('time');
                    $(document.getElementById(url)).text(content);
                //}
            },
            error: function(object, error) {
                console.log("Error: " + error.code + " " + error.message);
            }
        });
    });
}
    function addCount(Counter) {
      var $visitors = $(".leancloud_visitors");
      var url = $visitors.attr('id').trim();
      var title = $visitors.attr('data-flag-title').trim();
      var query = new AV.Query(Counter);
      query.equalTo("url", url);
      query.find({
        success: function(results) {
          if (results.length > 0) {
            var counter = results[0];
            counter.fetchWhenSave(true);
            counter.increment("time");
            counter.save(null, {
              success: function(counter) {
                var $element = $(document.getElementById(url));
                $element.find('.leancloud-visitors-count').text(counter.get('time'));
              },
              error: function(counter, error) {
                console.log('Failed to save Visitor num, with error message: ' + error.message);
              }
            });
          } else {
            var newcounter = new Counter();
            /* Set ACL */
            var acl = new AV.ACL();
            acl.setPublicReadAccess(true);
            acl.setPublicWriteAccess(true);
            newcounter.setACL(acl);
            /* End Set ACL */
            newcounter.set("title", title);
            newcounter.set("url", url);
            newcounter.set("time", 1);
            newcounter.save(null, {
              success: function(newcounter) {
                var $element = $(document.getElementById(url));
                $element.find('.leancloud-visitors-count').text(newcounter.get('time'));
              },
              error: function(newcounter, error) {
                console.log('Failed to create');
              }
            });
          }
        },
        error: function(error) {
          console.log('Error:' + error.code + " " + error.message);
        }
      });
    }
    $(function() {
      var Counter = AV.Object.extend("Counter");
      if ($('.leancloud_visitors').length == 1) {
        addCount(Counter);
      } else if ($('.post-title-link').length > 1) {
        showTime(Counter);
      }
    });
  </script>
{% endif %}

 

引擎索引

提交网址百度和Google

站点地图

第三方分享

jiathis

使用感较差，分享测试失败

百度分享

使用方法相较于hexo配置的官方文档，有所差别
正确开启模式如下：

baidushare: 
  type: button

微信分享报错，QQ分享登录不上账号，测试的微博以及豆瓣正常使用；

日常问题总结

域名无法访问

打开网址，报错：dial tcp: lookup zhenxin1994.com: getaddrinfow: No such host is known.
以下是尝试过程，第二天网站恢复正常访问状态，因为有延迟，不清楚是哪一种方法奏效：

 

1. 参考阿里云的文章域名问题自助排查工具，但排查工具检测进行到dns就请求失败了；
2. 刚注册的域名，才几天怎么就不能用了？ 据此添加了个人实名信息
3. 考虑到使用蓝灯代理的原因，参考【网络】dns_probe_finished_nxdomain 错误。当中，谷歌浏览器地址栏输入 chrome://net-internals/#dns 清除 dns 缓存即可
4. 注意,打开chrome://net-internals/#dns 右上角有个箭头，下拉，需要点击Clear cache 和 Flush sockets 两项才能清除域名解析设置。
5. 目前设置如下，域名zhenxin1994.com同时指向zhenxin1994.coging.me以及zhenxin111.github.io: