Invictus

C'est la vie

Hexo NexT 主题 添加留言本页面

发表于 分类于 阅读次数： Valine：
本文字数： 1.2k 阅读时长 ≈ 1 分钟

留言让博客看起来更加的人性化

NexT 主题官网有给出添加标签页、分类页的方法，其实添加留言本的方式异曲同工。方式稍微会有一点不同。

一、添加留言本 page

进入到博客的根目录，运行命令：

1
hexo new page guestbook

二、留言本页面中添加多说访客代码

上一步中使用 hexo 命令新建了一个 page，进入到博客的source目录，里面会多了一个gusetbook文件夹，里面有一个index.md文件，打开该文件编辑：

1
<div class="ds-recent-visitors" data-num-items="28" data-avatar-size="42" id="ds-recent-visitors"></div>

这段代码加到index.md底部就行。
然后要登录自己多说的站点，进入设置->自定义CSS，添加：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
#ds-reset .ds-avatar img,
#ds-recent-visitors .ds-avatar img {
    width: 54px;
    height: 54px;     /*設置圖像的長和寬，這裏要根據自己的評論框情況更改*/
    border-radius: 27px;     /*設置圖像圓角效果,在這裏我直接設置了超過width/2的像素，即為圓形了*/
    -webkit-border-radius: 27px;     /*圓角效果：兼容webkit瀏覽器*/
    -moz-border-radius: 27px;
    box-shadow: inset 0 -1px 0 #3333sf;     /*設置圖像陰影效果*/
    -webkit-box-shadow: inset 0 -1px 0 #3333sf;
}

#ds-recent-visitors .ds-avatar {
    float: left
}
/*隱藏多說底部版權*/
#ds-thread #ds-reset .ds-powered-by {
    display: none;
}

三、菜单设置中添加留言本

找到NexT主题设置的_config.yml文件里面的menu项

1
2
3
4
5
6
7
menu:
  home: /
  #about: /about
  archives: /archives
  tags: /tags
  categories: /categories
  guestbook: /guestbook

四、添加多语言文件的值

因为这里使用的是中文，找到languages文件夹里面的zh-Hans.yml文件，menu子项中添加留言：

1
2
3
4
5
6
7
8
9
menu:
  home: 首页
  archives: 归档
  categories: 分类
  tags: 标签
  about: 关于
  search: 搜索
  commonweal: 公益404
  guestbook: 留言