博客修复

实在不能忍受博客出现的一些问题了,于是开始修复。

侧边栏社交栏中的github图标不显示

参考github的图标不显示
不显示的的原因是原文件中GitHub图标的地址已经失效了,如图

解决方案:在这里下载一个github图标放到/yelee/source/img/下并命名为GitHub.png,然后在/yelee/source/css/_partial/customise/social-icon.styl的img-logo中加入GitHub black 75,接着删掉46-50行的即可。

1
2
3
4
.GitHub
background url(//cdn.bootcss.com/logos/0.2.0/github-octocat.svg) no-repeat white
background-size 90%
background-position 50% 100%

社交栏部分被挡住

这是宽度被限制了
main.styl中修改

1
2
3
4
5
6
7
8
9
10
11
.switch-area{
position: relative;
width: 100%;
overflow: hidden;
min-height: 300px;
font-size: (14/16)rem;
.switch-wrap{
transition: transform .3s ease-in;
position: relative;
}
}

评论系统从Disqus到Valine

Yelee主题默认支持三款评论系统:Disqus,多说和友言评论。而目前多说和友言已经不能用了,Disqus也需要科学上网才可以加载使用。参考suixin的方案将评论系统从Disqus换成了基于Leancloud的valine。样式不错,非常干净,可以后台管理评论、反垃圾。

Github关联

之前换过主题之后失效了
参考关联 GitHub, 让 Hexo 支持查看文章更新历史
开个repo把hexo/sources/_posts放到Github上。修改./themes/yelee/layout/_partial/post/nav.ejs文件,相应位置修改并添加如下代码:

1
2
3
4
5
6
7
8
9
10
11
<!-- 不设置 backup: false 则默认显示 -->
<% if (post.backup != false){ %>
<p>
<span>更新历史:</span><i class="fa fa-github"></i>
<!-- 不同功能替换前面超链接即可,文件名不变 -->
<!-- 文件名生成: <%= post.date.format("YYYY-MM-DD") %>.<%= post.slug %> -->
<a href="https://github.com/wmwwmv/BlogBackup/blame/master/_posts/<%= post.slug %>.md" title="顺序查看文章各部分修改记录" target = "_blank">Blame</a>,
<a href="https://github.com/wmwwmv/BlogBackup/commits/master/_posts/<%= post.slug %>.md" title="查看文章有关更新记录" target = "_blank">History</a><span class="raw">文本模式:</span><i class="fa fa-file-text-o"></i>
<a href="https://raw.githubusercontent.com/wmwwmv/BlogBackup/master/_posts/<%= post.slug %>.md" title="查看 & 下载文章 Markdown 原始文本" target = "_blank"> .md Raw</a>
</p>
<% } %>

文章目录
  1. 1. 侧边栏社交栏中的github图标不显示
  2. 2. 社交栏部分被挡住
  3. 3. 评论系统从Disqus到Valine
  4. 4. Github关联