miho

一. 主题简介

  MiHo 是一款单栏响应式的Hexo主题；基于 Hexo 3.0+ 制作，兼容移动端浏览；主题的代码托管在GitHub上，
欢迎Star和Fork；如遇到问题或发表建议，可以提Issues，也可以在博客中留言给我。

二. 安装

2.1 安装主题

1
$ git clone https://github.com/WongMinHo/hexo-theme-miho.git themes/miho

MiHo 主题需要Hexo 3.0或以上版本，请先升级。

2.2 更新

1
2
cd themes/miho
git pull

2.3 依赖安装

如下依赖如果已经安装，请看配置介绍。

Json-content

生成站点文章静态数据，用于站内搜索。

1
npm install hexo-generator-json-content --save

三. 站点配置

站点配置文件_config.yml在hexo根目录下。

3.1 启用主题

1
`theme: miho`

3.2 网站基本配置

以下配置是站点的全局配置，更多配置，请查看

1
2
3
4
5
6
title: MinHow's Blog
subtitle: 网站副标题
description: 专注 WEB 开发的技术博客
author: MinHow
language: 网站使用的语言
timezone: 网站时区

3.3 jsonContent配置

详细的配置请查看hexo-generator-json-content

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
jsonContent:
  meta: false
  pages: false
  posts:
    title: true
    date: true
    path: true
    text: true
    raw: false
    content: false
    slug: false
    updated: false
    comments: false
    link: false
    permalink: false
    excerpt: false
    categories: false
    tags: false

四. 主题配置

编辑主题配置文件，themes/miho/_config.yml。

4.1 属性

下面将介绍几个比较重要的配置。

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
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
# hexo-theme-miho
# https://github.com/wongminho/hexo-theme-miho

# Favicon of your site | 网站icon
favicon: /favicon.ico

# Header

# Keywords of your site | 网站关键字
keywords: MinHow,MinHow's Blog
# Head headline | 头部标题
header_title: MinHow's Blog
# Head description | 头部描述
header_description: 一个专注 WEB 开发的技术博客
# Link to your logo | logo地址
logo: images/logo.png
# Link to your banner_img | 首页banner图地址
banner_img: images/banner.jpg
# Menu setting | 菜单设置
#  name:                  Font Awesome icon | Font Awesome 图标
#    title: Home          Title | 标题
#    url: //minhow.com    Url, absolute or relative path | 链接，绝对或相对路径
#    target: true         Whether to jump out | 是否跳出
menu:
  home:
    title: Home
    url: /
    target: false
  archive:
    title: Archives
    url: /archives
    target: false
  user:
    title: About
    url: /about
    target: false
# Social setting, use to display social information | 社交设置，用来展示社交信息
#  name:                  Font Awesome icon | Font Awesome 图标
#    title: Home          Icon title | 图标标题
#    url: //minhow.com    Url, absolute or relative path | 链接，绝对或相对路径
#    target: true         Whether to jump out | 是否跳出
social:
  home:
    title: MinHow
    url: //minhow.com
    target: true
  github:
    title: Github
    url: //github.com/wongminho
    target: true
  weibo:
    title: Weibo
    url: //weibo.com/WongMinHo
    target: true
  twitter:
    title: Twitter
    url: //twitter.com/huangminhow
    target: true
  #qq:
  #weixin:
  #snapchat:
  #telegram:
  #envelope-o:
  #facebook:
  #google:
  #linkedin:

# Content

# Excerpt length | 摘录长度
excerpt_length: 190
# Excerpt link | 摘录链接
excerpt_link: more>>
# New window open link | 新窗口打开文章
open_new_link: false
# Article default cover picture，size：350*150 | 文章默认封面图，尺寸：350*150
cover_picture: images/banner.jpg
# Open background particles | 开启背景粒子
open_bg_particle: true
# Open animation in homepage and head | 开启主页及头部动画
open_animation: true

# Article

# Open toc | 是否开启toc
toc: true
# Open share | 是否开启分享
share: true

# Style customization | 样式定制
style:
  # Main color tone | 主色调
  main_color: '#0cc'

# Reward | 打赏

reward:
  # 0-close, 1-All articles are rewarding, 2-Article's md file has reward:true attribute, only reward
  # 0-关闭, 1-所有文章均有打赏, 2-文章的md文件里有reward:true属性，才有打赏
  status: 1
  # 标题
  title: 请我吃糖~
  # 微信，关闭设为 false
  wechat: images/wechat_code.jpg
  # 支付宝，关闭设为 false
  alipay: images/alipay_code.jpg

# Comments | 评论

# 畅言，输入appid和appkey
changyan_appid: false
changyan_appkey: false
# 友言，输入id
youyan_id: false
# disqus
disqus: false

# Analytics | 分析
# 站长分析，输入站点id
cnzz_analytics: false
# 百度分析，输入key值
baidu_analytics: false
# google analytics | google分析
google_analytics: false

# Footer

# Access statistics | “不蒜子”访问量统计
access_counter:
  on: true
  site_uv: 总访客数：
  site_pv: 总访问量：

# Copyright Information | 版权信息
copyright: 2017 MinHow

4.2 文章封面图

文章默认封面图，尺寸：350*150，当文章基本配置没有cover_picture时才显示。

1
cover_picture: images/banner.jpg

4.3 开启背景粒子

是否开启背景粒子。

1
open_bg_particle: true

4.4 开启主页及头部动画

是否开启主页及头部动画。

1
open_animation: true

4.5 评论

支持畅言、友言、disqus。

1
2
3
4
5
6
7
8
9
10
11
12
13
# 畅言，输入appid和appkey
changyan_appid: false
changyan_appkey: false
# 友言，输入id
youyan_id: false
# disqus
disqus: false
# gitment  https://github.com/imsun/gitment
gitment:
  owner: false   #你的 GitHub ID
  repo: ''   #存储评论的 repo
  client_id: '' #client ID
  client_secret: ''  #client secret

4.6 数据统计

支持站长、百度、google三种数据统计，正确填写配置信息即可。

1
2
3
4
5
6
# 站长分析，输入站点id
cnzz_analytics: false
# 百度分析，输入key值
baidu_analytics: false
# google分析
google_analytics: false

4.7 文章基本配置

1
2
3
4
5
6
7
8
9
10
11
12
---
title: Hello World
date: 2017-06-18
categories: First
author: MinHow
tags:
    - First
    - Second
cover_picture: /images/banner.jpg
---
 MinHow-This is a summary
<!-- more -->

可以参考[blog]的写法。

说明：

  • 需要注意tags和摘要的写法，不然首页不能正确显示标签和摘要；
  • cover_picture文章封面图，不填默认显示_config.yml配置的图片。

4.8 创建 about 页面

在 Hexo 目录执行如下命令：

1
hexo new page about

然后编辑source/about/index.md文件即可，可以参考我写好的[about]页面。

4.9 打赏

支持微信和支付宝打赏，修改wechat和alipay两个图片路径配置即可，支持全局开启打赏或指定文章开启打赏功能，详情查看配置文件。

最后更新： 2018年04月22日 10:05

原始链接： http://blog.minhow.com/articles/blog/installation-configuration/

赏
× 请我吃糖~
打赏二维码