安装 Hexo
在安装 Hexo 之前,你需要安装以下两个工具:
安装 Git
-
Windows:下载并安装 git.
-
Linux (Ubuntu, Debian):
sudo apt-get install git-core
-
Linux (Fedora, Red Hat, CentOS):
sudo yum install git-core
-
Linux (Arch 系列):
sudo pacman -S git
提醒
由于墙的原因,从上面的链接下载 git for windows 最好挂上一个代理,否则下载速度十分缓慢。也可以参考这个页面,收录了存储于百度云的下载地址。
提醒
如果你是 CentOS 服务器上的,可以直接使用 HexoOneClickInstallation 这个脚本快速安装 Hexo。
安装 Node.js
安装 Node.js 的最佳方式是使用 nvm。
cURL:
$ curl https://raw.github.com/creationix/nvm/v0.33.11/install.sh | sh
Wget:
$ wget -qO- https://raw.github.com/creationix/nvm/v0.33.11/install.sh | sh
安装完成后,重启终端并执行下列命令即可安装 Node.js。
$ nvm install stable
或者您也可以下载 安装程序 来安装。(最好下载带LTS版本的)
提醒
在中国大陆由于某些众所周知的网络原因,推荐使用淘宝 NPM 镜像:
npm install -g cnpm --registry=https://registry.npm.taobao.org
使用
cnpm install
来代替所有npm install
指令。
开始安装 Hexo
安装好后,即可使用 npm 完成 Hexo 的安装。
$ npm install -g hexo-cli
如果安装太慢,则可以使用上面的淘宝镜像
$ cnpm install -g hexo-cli
启动和美化 Hexo
首先建立一个文件夹。进入文件夹,右键选择Git Bash Here
(注意:要安装Git才会有此命令)然后输入下面的命令往这个文件夹里安装 Hexo。
$ hexo init
运行 Hexo
$ hexo g
$ hexo s
在浏览器中输入 http://localhost:4000/
即可看到Hexo在本地部署完成
Hexo 命令详解
该部分如已了解,可自行跳过
下面介绍一些 Hexo 的基本命令。
hexo init [folder]
这个命令是 Hexo 初始化命令。 [folder]
表示你要初始化的文件夹。如果你要初始化本地,直接 hexo init
。
hexo new [layout] <title>
这个命令是新建文章或页面用的命令。其中 [layout]
表示他的模板(即页面或者文章), <title>
表示标题。
用法:
hexo new post 001
,表示新建了一个标题为001
的文章。hexo new page 001
,表示新建了一个标题为001
的页面。
如果你不想在终端中新建文章或页面,可以直接在 博客根目录/source/_post/
目录下创建 Markdown 文件写文章。或者在 博客根目录/source/
目录下创建一个文件夹,然后在新文件夹里创建 index.md
写页面即可。
提醒
当你新建页面后,页面的链接就是你页面所在的文件夹的名字。
例如:我在 博客根目录/source/
下新建了一个名为 test
的文件夹,然后在 test
文件夹下写 Markdown 文件,那么这个页面的链接就是 网址/test
。
$ hexo server (可缩写为 hexo s)
当你要在本地查看网站的时候,就可以用这个命令。
默认在 http://localhost:8080/
这里,可能会不同,注意提示信息即可。
提醒
如果你想要换端口号(上面的 8080
就是端口号),可以在终端里输入 hexo s -p 端口号
。
$ hexo generate (可缩写为 hexo g)
这个命令是生成网站静态文件的时候用的,生成后网页将会放在根目录下面的 public
文件夹里。
$ hexo deploy (可缩写为 hexo d)
这个命令用来部署网站,使用此命令将会把生成好的页面(即 public
文件夹里的内容)部署到指定的地方上。
$ hexo clean (可缩写为 hexo cl)
这个命令用来清空 public
文件夹。
$ hexo version
这个命令用来输出你所使用的 Hexo 目前的版本号。
配置 Hexo
注:如果使用下面黑石大佬魔改的``Volantis`主题,这部分的内容了解即可,不用配置
警告
此部分内容可能过期,请见 Hexo 官方文档。
没错,就是在 Hexo 根目录 _config.yml
这个文件里配置!
警告
在 YAML 语法中,冒号后面必须要有一个空格才能继续写下去。
网站
# Site
title:
subtitle:
description:
keywords:
author:
language:
timezone:
参数 | 描述 |
---|---|
title | 网站标题 |
subtitle | 网站副标题 |
description | 网站描述 |
keywords | 网站关键词 |
author | 作者名字 |
language | 网站使用的语言 |
timezone | 网站时区:详见时区列表 |
URL
# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url:
root:
permalink: :year/:month/:day/:title/
permalink_defaults:
pretty_urls:
trailiing_index: true
参数 | 描述 |
---|---|
url | 网址 |
root | 网站根目录 |
permalink | 文章的永久链接格式 |
permalink_defaults | 永久链接中各部分的默认值 |
pretty_urls | 改写 permalink 的值来美化 URL |
pretty_urls.trailing_index | 是否在永久链接中保留尾部的 index.html , false 时去除 |
提醒
如果你的网站在子目录中,如:
https://yoursite.com/blog
,就把你的url
设为http://yoursite.com/blog
并把root
设为/blog/
。
例如:
# 比如,一个页面的永久链接是 http://example.com/foo/bar/index.html
pretty_urls:
trailing_index: false
# 此时页面的永久链接会变为 http://example.com/foo/bar/
目录
# Directory
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render: README.md
参数 | 描述 |
---|---|
source_dir | 资源文件夹 |
public_dir | 公共文件夹 |
tag_dir | 标签文件夹 |
archive_dir | 归档文件夹 |
category_dir | 分类文件夹 |
code_dir | Include code 文件夹 |
i18n_dir | 国际化文件夹 |
skip_render | 跳过文件的渲染。匹配到的文件将直接复制到 public 目录中。您可使用 glob 表达式来匹配路径。 |
提醒
一般情况下,这部分是不需要修改的。
例如:
skip_render: "mypage/**/*"
# 将会直接将 `source/mypage/index.html` 和 `source/mypage/code.js` 不做改动地输出到 'public' 目录
# 你也可以用这种方法来跳过对指定文章文件的渲染
skip_render: "_posts/test-post.md"
# 这将会忽略对 'test-post.md' 的渲染
文章
# Writing
new_post_name: :title.md # File name of new posts
default_layout: post
auto_spacing: false
titlecase: false # Transform title into titlecase
external_link: true # Open external links in new tab
enable: true
field: site
exclude: []
filename_case: 0
render_drafts: false
post_asset_folder: true
relative_link: false
future: true
highlight:
enable: true
line_number: true
auto_detect: false
tab_replace:
参数 | 描述 |
---|---|
new_post_name | 新文章的文件名称 |
default_layout | 预设布局 |
auto_spacing | 在中文和英文之间加入空格 |
titlecase | 把标题转换为 title case |
external_link | 在新标签中打开链接 |
external_link.enable | 在新标签中打开链接 |
external_link.field | 适用于整个网站或仅文章 |
external_link.exclude | 排除主机名。在适用时指定子域,包括 www |
filename_case | 把文件名称转换为 (1) 小写或 (2) 大写 |
render_drafts | 显示草稿 |
post_asset_folder | 启动 Asset 文件夹 |
relative_link | 把链接改为与根目录的相对位址 |
future | 显示未来的文章 |
highlight | 代码块的设置 |
highlight.enable | 开启语法高亮 |
highlight.auto_detect | 如果未指定语言,则启用自动检测 |
highlight.line_number | 显示行数 |
highlight.tab_replace | 用 n 个空格替换 tabs;如果值为空,则不会替换 tabs |
分类 & 标签
# Category & Tag
default_category: uncategorized
category_map:
tag_map:
参数 | 描述 |
---|---|
default_category | 默认分类 |
category_map | 分类别名 |
tag_map | 标签别名 |
日期 / 时间格式
# Date / Time format
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-MM-DD
time_format: HH:mm:ss
use_date_for_updated: true
参数 | 描述 |
---|---|
date_format | 日期格式 |
time_format | 时间格式 |
use_date_for_updated | 如果前面没有提供更新日期,则使用 post.updated 中的发布日期。通常与 Git 工作流一起使用。 |
提醒
Hexo 使用 Moment.js 来解析和显示时间。
分页
# Pagination
## Set per_page to 0 to disable pagination
per_page: 10
pagination_dir: page
参数 | 描述 |
---|---|
per_page | 每页显示的文章量 (0 = 关闭分页功能) |
pagination_dir | 分页目录 |
扩展
# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme:
theme_config:
deploy:
meta_generator:
参数 | 描述 |
---|---|
theme | 当前主题名称。值为 false 时禁用主题 |
theme_config | 主题的配置文件。在这里放置的配置会覆盖主题目录下的 _config.yml 中的配置。 |
deploy | 部署的设置 |
meta_generator | Meta generator 标签。 值为 false 时 Hexo 不会在头部插入该标签。 |
使用黑石大佬魔改的Volantis主题
先给出原文链接:https://www.heson10.com/volantis/posts/3882.html
自己使用的配置**(建议非本人不要使用我的配置,去上面的链接原文处使用大佬的配置一步一步的来)**
进入博客根目录,右键Git Bash Here
打开Git
下载主题
git clone https://gitee.com/colzry/volantis-heson.git themes/volantis-heson
更换主题
打开根目录_config.yml
文件
theme: volantis-heson
安装依赖
改根目录下的package.json
文件
{
"name": "hexo-site",
"version": "0.0.0",
"private": true,
"scripts": {
"build": "hexo generate",
"clean": "hexo clean",
"deploy": "hexo deploy",
"server": "hexo server"
},
"hexo": {
"version": "5.1.1"
},
"dependencies": {
"hexo": "^5.1.1",
"hexo-abbrlink": "^2.2.1",
"hexo-deployer-git": "^2.1.0",
"hexo-generator-archive": "^1.0.0",
"hexo-generator-category": "^1.0.0",
"hexo-generator-feed": "^3.0.0",
"hexo-generator-index": "^2.0.0",
"hexo-generator-json-content": "^4.2.3",
"hexo-generator-tag": "^1.0.0",
"hexo-related-popular-posts": "^5.0.1",
"hexo-renderer-ejs": "^1.0.0",
"hexo-renderer-marked": "^3.0.0",
"hexo-renderer-stylus": "^2.0.0",
"hexo-server": "^2.0.0",
"hexo-wordcount": "^6.0.1"
}
}
然后输入下面命令,本地预览
npm install && hexo cl && hexo g && hexo s
修改主题配置
在主题目录的config.yml中找到☆
符号
这些都是必须修改的项目,在修改的内容在里面已经说明
FAQ
Q1:首页文章的头图怎么添加?
A1:在md文章头部的frontmater
里面添加headimg: 链接地址
Q2:怎么添加分类
、标签
和说说
页面?
A2:输入命令:
hexo new page categories
hexo new page tags
hexo new page bb
hexo new page links
hexo new page guestbook
然后分别在生成的两个index.md里的frontmater
里面添加layout: category
和layout: tag
和layout: bb
和layout: friends
命令 | 对应模板 |
---|---|
hexo new page categories | layout: category |
hexo new page tags | layout: tag |
hexo new page bb | layout: bb |
hexo new page links | layout: friends |
hexo new page guestbook | 无 |
Q3:怎么调用友情链接?
A3:我用的是gitee动态调用,这样的好处是:可以直接申请审核,不用动代码加友情链接。
我得调用代码:
{% issues sites | api=https://gitee.com/api/v5/repos/heson525_admin/links/issues?sort=created&direction=asc&labels=active&state=open&page=1&per_page=100 | group=group:技术大佬,朋友们 %}
其中api要换成自己的gitee链接,我这个链接中heson525_admin
是我的用户名,links
是仓库名后面的group
是分组,active
是判断是否显示的标签。
Q4:如何在分类和标签页面添加分类和标签?
A4:在文章xxx.md里的frontmater
里面添加 tags: 标签名
categories: 分类名
即可。例如:
# 一个标签和分类
title: 初次安装Git的配置
author: Colzry
tags: Git
categories: Git
headimg: 链接地址
# 多个标签和分类
title: 树莓派4B无显示器开机
author: Colzry
tags:
- Linux
- 树莓派
categories:
- 树莓派
headimg: 链接地址
部署到 Gitee
打开Gitee
将ssh公钥添加到Gitee(这个不会的百度)
新建一个仓库
仓库名和路径必须和用户名一致
点击服务的Gitee Pages
勾选强制使用HTTPS然后启动
安装部署插件
$ npm install hexo-deployer-git --save
$ npm install hexo-server --save
配置 Git
如果你只是安装好了 Git 但没有配置过你的 Git ,那么现在需要做的第一件事情就是设置你的 Git 用户名和邮箱。 在 Git Bash 中执行以下两条命令配置你的用户名和邮箱,这里建议用户名和邮箱与你的 GitHub 用户名和邮箱保持一致。
$ git config --global user.name "Your_user_name"
$ git config --global user.email Your_email@example.com
提醒
每次 Git 提交时都会附带这两条信息,用于记录是谁提交的更新,并且会随更新内容一起被记录到历史记录中。简单说,是用来标记的你的身份的~
配置站点 _config.yml
文件
deploy:
type: git # 类型填git
repo: <repository url> # 你的Gitee仓库地址(https和ssh都可以)
branch: master # 分支名称。
message: # 提交信息可以自定义,不填的则默认为提交时间
发布到 Gitee
在本地的 Hexo 站点根目录下,执行如下命令即可部署到 GitHub Pages 上。
$ hexo clean && hexo d -g
提醒
如果是第一次使用,会弹出一个登录框,需要登录你的 GitHub 账号。
之后来到Gitee Pages
页面,点击更新按钮,重新部署一下即可
推荐:想了解更多Hexo的教程和内容请打开Easy Hexo