一、博客安装
1.安装hexo包
1 | $ npm install -g hexo-cli |
2.初始化
1 | hexo init blog |
稍微等待下,速度有点慢。成功提示
INFO Start blogging with Hexo!
速度太慢解决
- 到码云把:
https://github.com/hexojs/hexo-starter.git
复制过去 - 从码云下载:
git clone https://gitee.com/pasaulis/hexo-starter.git
3. 安装依赖
1 | cd blog |
4.本地查看
因为你初始化hexo 之后source目录下自带一篇hello world文章, 所以直接执行下方命令
1 | $ hexo generate |
现在已经搭建好本地的 Hexo 博客了,执行完下面的命令就可以到浏览器输入 localhost:4000 查看到啦
在浏览器输入 http://localhost:4000/ 就可以看见网页和模板了
5.配置github的SSH keys(略过)
二、配置博客
_config.yml是配置文件,这个文件我们会经常用到,后面也会介绍具体可以配置哪些信息。
- source是资源文件夹,用来存放我们的markdown文件。
- themes文件夹是用来放置主题的
- 博客名字及作者信息:_config.yml
- 个人介绍页面:about.md
- 代表作页面:milestone.md
2.1 配置_config.yml
Extensions 这里配置站点所用主题和插件,暂时默认1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16title: **My Blog** #博客名
subtitle: to be continued... #副标题
description: My blog #给搜索引擎看的,对网站的描述,可以自定义
author: **Yourname** #作者,在博客底部可以看到
email: yourname@yourmail.com #你的联系邮箱
language: **zh-CN** #中文。如果不填则默认英文
timezone: Asia/Shanghai
# URL #这项暂不配置,绑定域名后,欲创建sitemap.xml需要配置该项
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://yoursite.com
# Writing 文章布局、写作格式的定义,不修改
# Archives 默认值为2,这里都修改为1,相应页面就只会列出标题,而非全文
# Server 不修改
# Date / Time format 日期格式,可以修改成自己喜欢的格式
# Pagination 每页显示文章数,可以自定义,贴主设置的是10
# Disqus Disqus插件,我们会替换成“多说”,不修改
2、配置 Deploy
接下来配置 GitHub 设置,类型设置为 git ,指定好 repo 地址,branch 必须设置为master,因为 GitHub Page 只会从 mater 分支生成。(注意有坑:这里我们需要单独设置好在 GitHub 上使用 name 和 email ,否则将会使用 global 的user.name 和 user.email ,囧~~):
Deployment 站点部署到 github 要配置
1 | deploy: |
三、推送到 github
- 在github新建仓库:仓库名必须为
<user-name>.github.io
格式,其中<user-name>
是你 github 的昵称
1.安装自动推送到github工具
完成上述配置后,在终端执行
1 | $ cnpm install hexo-deployer-git --save # 安装该工具 |
这个操作主要是为了把我们写好的文章部署到 github 服务器上并可以被别人浏览。
题外话,这里简单说一下 hexo-deployer-git 插件的工作流程:当执行部署操作的时候,
- 首先会自动初始化 git 仓库(位置在 .deploy_git 中),并关联到指定 repo 与 branch ,后续 public 文件夹中自动生成的页面代码将会拷贝至此目录中进行代码管理。
- 若修改了 name 和 email ,需要删掉整个 .deploy_git 再重新部署才会生效。有兴趣的可以看下 hexo-deployer-git 的源码。
2.推到git仓库
1 | //清除? |
打开查看:https://chenxi188.github.io
四、写新文章及清除原数据
1.创建一篇名为test.md的文章
1 | hexo new test_md |
这步完成会生成文章 test-md.md 说明:
1 | title: Hello World |
1.2 修改文章模板
在新建文章时,Hexo 会根据 scaffolds 文件夹内相对应的文件 post.md 来建立文章,因此我们可以修改它建立自己的文章模板,我的模板如下:
1 | title: {{ title }} |
2.编写文章
- 一步完成会生成文章 test-md.md
- 找到该文章,打开,
- 在 test_md.md 中输入内容后,保存一下。
使用 Markdown 语法,该语法介绍可以查看利用HEXO搭建的博客及Markdown语法介绍
3.清除原数据,为发布新文章做准备
然后执行下列步骤
1 | hexo clean |
INFO Deleted database.
INFO Deleted public folder.
五、发布新文章
1.发布
1 | hexo generate |
2.本地查看文章
1 | $ hexo server |
即可在本地查看新发布的文章
3. 发布到网上,执行:
1 | $ hexo deploy |
即可在网上查看新发布的文章
六、换主题
1.下载主题
1 | $ cd your-hexo-site |
2. 启用主题
启用新下载的主题,在刚打开的的 _config.yml 文件中(hexo根目录中),找到“# Extensions”,把默认主题 landscape 修改为刚刚下载下来的主题名:
修改主目录下的 _config.yml,指向我们刚刚 clone 的主题:
1 | theme: next # 启用 NexT 主题 |
到此,NexT 主题安装完成。
3.验证(可选)
1 | hexo clean |
4.更新最新主题(可选)
git bash 里执行
1 | $ cd themes/主题名 |
5、本地查看调试
每次修改都要 hexo g 生成一下
1 | hexo clean |
浏览器输入
localhost:4000 预览效果
6.发布到网上
1 | hexo d |
七、主题设定(这一部分的修改都在该theme下的config.yml 文件中)
1、选择 Scheme
Scheme 是 NexT 提供的一种特性,借助于 Scheme,NexT 为你提供多种不同的外观。同时,几乎所有的配置都可以 在 Scheme 之间共用。目前 NexT 支持三种 Scheme,他们是:
- Muse - 默认 Scheme,这是 NexT 最初的版本,黑白主调,大量留白
- Mist - Muse 的紧凑版本,整洁有序的单栏外观
- Pisces - 双栏 Scheme,小家碧玉似的清新
- 搜索 scheme 关键字。 你会看到有三行 scheme 的配置,将你需用启用的 scheme 前面注释 # 去除即可。
https://www.jianshu.com/p/2511a362f5d1
总结:常用说明/命令
1 | hexo generate // 简写:hexo g,生成静态文件,会在当前目录下生成一个public文件夹 |
目录说明
1 | . |
全局配置:根目录/__config.yml
1 | # Hexo Configuration |
注意
• 配置文件的冒号“:”后面有一个空格
• repo: 刚刚 github 创库地址 .git