学而时习之实践验证真理

hueman主题使用补充

,
阅读次数: 1000000

_config.yml说明

Customize

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
customize:
    logo:
        width: 165
        height: 60
        url: images/logo-header.png
    theme_color: '#4169E1'
    highlight: tomorrow-night-eighties
    sidebar: left # sidebar position, options: left, right
    thumbnail: true # enable posts thumbnail, options: true, false
    favicon: css/images/favicon.png # path to favicon
    social_links: # for more icons, please see http://fontawesome.io/icons/#brand
        github: https://github.com/helllllp
        weibo: /
        qq: /524311610
        weixin: /
        rss: /

定义了自定义选项：
logo：网站头部和脚部的logo，width和height是显示在网页上的大小，图片路径按照images/xxx.png来获取
theme_color：主题色，影响关注我的banner颜色，超链接颜色和侧边栏文章标题颜色
highlight: 代码高亮，可以ls themes/hueman/source/css/_highlight/查看有多少个主题样式，效果可以到highlightjs官网根据预览效果来选取：https://highlightjs.org/static/demo/
favicon：网站图标，图片路径按照css/images/xxx.png来获取

1
2
3
4
search:
    insight: false # you need to install `hexo-generator-json-content` before using Insight Search
    swiftype: xxxxxxxxxx # enter swiftype install key here
    baidu: false # you need to disable other search engines to use Baidu search, options: true, false

搜索引擎，当前版本配置了三个搜索引擎，insight需要npm安装hexo-generator-json-content，我这里安装后没有效果，故使用swiftype，百度官方不推荐
1、申请swiftype账号：https://app.swiftype.com/
使用邮箱注册，貌似使用qq和139邮箱申请不行，我用了自己阿里云域名的邮箱才行：crontab@hellshan.top
2、点击create new engine，创建新引擎，填上你的域名，进入后点击Setup and integration，复制install key到配置文件就OK

Comment

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
comment:
    disqus: # enter disqus shortname here
    duoshuo: # enter duoshuo shortname here
    youyan: # enter youyan uid here
    facebook: # enter true to enable
    isso: # options for isso.
    changyan:
    valine: # Valine Comment System https://github.com/xCss/Valine
        on:  true # enter true to enable valine
        appId: 4O7x2fxxxxxxrdxFIAJn3v-gzGzoHsz # enter the leancloud application appId here
        appKey: k2d5KmEjtQeLw5IuRficyYsN # enter the leancloud application appKey here
        notify: # enter true to enable <Mail notifier>, default: false; https://github.com/xCss/Valine/wiki/Valine-%E8%AF%84%E8%AE%BA%E7%B3%BB%E7%BB%9F%E4%B8%AD%E7%9A%84%E9%82%AE%E4%BB%B6%E6%8F%90%E9%86%92%E8%AE%BE%E7%BD%AE
        verify: true # enter true to enable <Validation code>, default: false
        placeholder: Just Do It # enter the comment box placeholder
        avatar: identicon # (''/mm/identicon/monsterid/wavatar/retro/hide), more to see https://valine.js.org/avatar.html
        avatar_cdn: https://gravatar.loli.net/avatar/ # avatar CDN address, default gravatar.cat.net
        pageSize: 10 # comments of one page
        visitor: true # count reading numbers; If true, the numbers will also show below the title of every post
        recordip: #false # If true, record commenter's ip, which is shown in LeanCloud pannel
    gitalk:

评论系统，这里使用了valine，详见https://valine.js.org/avatar.html操作指引
1、请先登录或注册 LeanCloud, 进入控制台后点击左下角创建应用：

2、应用创建好以后，进入刚刚创建的应用，选择左下角的设置>应用Key，然后就能看到你的APP ID和APP Key了：

3、把ID和KEY复制到配置文件即可

其他配置

source/css/style.styl

1
2
3
4
5
6
7
8
code
    margin: 0 2px
    color: #3CB371
    padding: 3px 5px
    font-size: 0.8em
    border-radius: 2px
    font-family: font-mono
    background-color: #F0F8FF

定义了代码的颜色，大小和边距，以及背景色

source/css/_variables.styl

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
// Colors
color-default = #555
if hexo-config("customize.theme_color")
    color-theme = convert(hexo-config("customize.theme_color"))
else
    color-theme = #3b8dbd
color-grey = #aaa
color-header-background = #2F4F4F
color-main-background = #fff
color-background = #eaeaea
color-mobile-nav-background = #191919
color-border = #ddd
color-border-light = #eee
color-nav-foreground = rgba(255,255,255,0.7)
color-nav-background = #33363b
color-nav-hover-background = rgba(0,0,0,0.1)
color-sidebar-background = #f0f0f0
color-sidebar-text = #777
color-sidebar-text-dark = #444
color-footer-background = #2F4F4F

// Fonts
font-sans = "Titillium Web", "Helvetica Neue", Helvetica, Arial, "Microsoft Yahei", sans-serif
font-serif = Georgia, "Times New Roman", serif
font-mono = "Source Code Pro", Consolas, Monaco, Menlo, Consolas, monospace
font-icon-profile-size = 24px
font-size = 14px
font-size-article = 16px
line-height = 1.6em
line-height-title = 1.3em

定义头部背景色，脚背景色，主页背景色，字体大小等。

通过https访问出现“您与此网站建立的链接并非完全安全”提示的问题

已经开启https，访问时还会提示您与此网站建立的链接并非完全安全，原因是我们的页面存在一些不安全的http请求，比如图片、js等静态文件。我们只需要将其升级为https请求即可。
vim /app/blog/themes/hueman/layout/common/head.ejs
页面的head中加入：

1
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
分享到