Hexo-yilia-Valine-GitHub Pages博客搭建

个人博客Faye’s Blog

一、Hexo 安装、yilia主题、GitHub部署

​ Hexo的安装和部署以及yilia主题的配置可参照Hexo官方文档、yilia以及CodeSheep的视频教程。

根据官方文档和yilia的GitHub，可以自己进行个性化配置。

二、Valine评论系统

​ 添加Valine评论系统，首先需要注册LeanCloud并创建应用，可参考Deserts博客。然后在yilia中进行配置。

​ 首先，在hexo\themes\yilia_config.yml中加入Valine的相关配置：

valine: 
 appid:  #Leancloud应用的appId
 appkey:  #Leancloud应用的appKey
 verify: false #验证码
 notify: true #评论回复提醒
 avatar: mm #评论列表头像样式：''/mm/identicon/monsterid/wavatar/retro/hide
 placeholder: Just go go #评论框占位符
 #(valine行顶格，其他行一个空格)

​ 然后，在hexo\themes\yilia\layout\_partial\article.ejs中添加下方代码，应将下方代码放到<% if (!index && post.comments){ %>的下面

<% if (theme.valine && theme.valine.appid && theme.valine.appkey){ %>
<section id="comments" class="comments">
  <style>
    .comments{margin:30px;padding:10px;background:#fff}
    @media screen and (max-width:800px){.comments{margin:auto;padding:10px;background:#fff}}
  </style>
  <%- partial('post/valine', {
    key: post.slug,
    title: post.title,
    url: config.url+url_for(post.path)
    })