2019-05-08 | 理论 & 教程 | UNLOCK

Hexo基础教程(三):网站基本配置与主题设置

Hexo基本配置

博客根目录下的_config.yml,是整个Hexo的配置文件,可以在其中修改大部分的配置。这里仅列出部分初期需要注意的内容,详细可参考官方配置文档。需要注意的是配置文件依靠缩进来确定元素间的从属关系,请使用空格缩进,并保证缩进正确,配置才可生效。

网站

参数描述
title网站标题
subtitle网站副标题
description网站描述
author你的名字
language网站使用的语言
timezone网站时区。Hexo默认使用你电脑的时区。时区列表。比如说:America/New_York,Japan,和UTC

其中,description主要用于SEO,告诉搜索引擎一个关于你站点的简单描述,通常建议在其中包含你网站的关键词。author参数用于主题显示文章的作者。

网址

参数描述默认值
url网址
root网站根目录
permalink文章的永久链接格式:year/:month/:day/:title/
permalink_defaults永久链接中各部分的默认值

这里,你需要把url设置成你的网站域名。

permalink即新建文章时生成的链接格式,例如新建文章test.md,此时生成的链接为http://yoursite.com/2019/03/26/test。

以下为官方示例,想要深入了解可以在官方文档中查看永久链接

参数结果
:year/:month/:day/:title/2013/07/14/hello-world
:year-:month-:day-:title.html2013-07-14-hello-world.html
:category/:titlefoo/bar/hello-world

如果你的网站存放在子目录中,例如http://yoursite.com/blog,则需要将url设为http://yoursite.com/blog并把root设为/blog/

分页

参数描述默认值
per_page每页显示的文章量 (0 = 关闭分页功能)10
pagination_dir分页目录page

扩展

参数描述
theme当前主题名称。值为false时禁用主题
deploy部署部分的设置

theme是你所选择的主题,更换主题时,需要将所下载主题文件放在themes文件夹下,再修改这个参数。deploy是部署部分的设置,其中repo表示仓库,branch表示仓库的分支,具体的修改方法在前面的文章中已有提及,这里不再赘述。

Hexo基本操作

Front-matter

Front-matter是文件最上方以---分隔的区域,用于指定个别文件的变量,举例来说:

1
2
3
4
---
title: Hello World
date: 2013/7/13 20:46:25
---

以下是预先定义的参数,可以在模板中使用这些参数值进行设置。

参数描述默认值
layout布局
title标题
date建立日期文件建立日期
updated更新日期文件更新日期
comments开启文章的评论功能true
tags标签(不适用于分页)
categories分类(不适用于分页)
permalink覆盖文章网址

只有文章支持分类和标签。其中,分类具有顺序性和层次性,也就是说Foo, Bar不等于Bar, Foo;而标签没有顺序和层次。

1
2
3
categories:
- Diary
- Life

Hexo不支持指定多个同级分类,也就是说,如果设置上面的指定方法,会使分类Life成为Diary的子分类,而不是并列分类。

布局(Layout)

你可以执行下列命令来创建一篇新文章:

1
hexo new [layout] <title>

Hexo有三种默认布局:postpagedraft,它们分别对应不同的路径,而你自定义的其他布局和post相同,都将储存到source/_posts文件夹。

布局路径
postsource/_posts
pagesource
draftsource/_drafts

Hexo默认的布局是post,新建的文章都保存在source文件夹下_posts里面。你可以在创建文章时指定布局,也可以通过修改_config.yml中的 default_layout参数来指定默认布局。

如果你不想你的文章被处理,可以将Front-Matter中的layout: 设为false

页面(Page)

如果你想另起一页,可以使用:

1
hexo new page pageName

系统会在source文件夹下创建一个pageName文件夹,以及其中的index.md,博客搭建完成后的about页面,分类和标签页面都需要通过此方式自行创建。

草稿(Draft)

draft是草稿的意思,是Hexo的一种特殊布局,这种布局在建立时会被保存到source/_drafts文件夹,默认不会在页面中显示。

1
hexo new draft <title>

如果你的草稿写完了,可通过以下命令进行预览:

1
hexo server --draft

在本地端口中开启服务即可进行预览。

如果草稿确认无误,想要发布,可以通过publish命令将草稿移动到source/_posts文件夹。

1
hexo publish draft <title>

模板(Scaffold)

在新建文章时,Hexo会根据scaffolds文件夹内相对应的文件来建立文件,例如:

1
hexo new photo "My Gallery"

在执行这行指令时,Hexo会尝试在scaffolds文件夹中寻找photo.md,并根据其内容建立文章,以下是可以在模版中使用的变量:

变量描述
layout布局
title标题
date文件建立日期

主题设置

Hexo使用landscape作为默认主题,如果你觉得不符合自己的使用习惯,可以选择喜欢的主题进行修改。

主题选用

目前比较受欢迎为NexT主题,简洁清爽,功能全面,网上关于该主题的教程也较多。如果你不打算用NexT,Hexo官网有200多个主题可供选择,如果你觉得官网主题太多不便筛选,也可以去知乎找找推荐,或者直接在Github搜索hexo theme,按star数量排序,排名靠前的主题都不差。

本站主题使用GodBMWTheme-AD,主题作者提供了详细的中文文档,感兴趣的可以前往查看。

选定主题后,需要在Github下载主题文件,在themes文件夹下新建文件夹存放该文件,然后修改站点根目录下的_config.yml中的theme字段为主题文件夹名称,执行以下命令,重新生成相关文件,引擎会自动搜索themes文件夹中已配置主题进行渲染。在本地查看预览即可看到主题效果。

1
2
3
hexo clean
hexo g
hexo s

主题结构

从Github下载的主题可能有如下结构:

1
2
3
4
5
6
.
├── _config.yml
├── languages
├── layout
├── scripts
└── source

_config.yml

主题的配置文件,修改时会自动更新,无需重启服务器。可在此修改主题的有关配置,需要和Hexo根目录的_config.yml区分。

languages

语言文件夹,存放有关网站语言的配置文件。如果要使用国际化功能,需要先在站点根目录_config.yml中修改language设定。

需要注意的是,不同主题语言文件的命名并不都相同,language设定应以各主题languages下的语言文件命名为准,否则可能会有意想不到的结果。

layout

布局文件夹,用于存放主题的模板文件,决定了网站内容的呈现方式。

scripts

脚本文件夹,在启动时,Hexo会载入此文件夹内的JavaScript文件。

source

资源文件夹,除了模板以外的Asset,如CSS,JavaScript等。

评论加载中