Hexo 系统 BlueLake 主题安装与设置

文章目录

• 安装与初始化
• 给自己的Hexo博客加上图片
• Hexo中提供文件下载功能
• 添加本地搜索
• 设置阅读全文
• 解决busuanzi无效的方法

安装与初始化

• 安装hexo：
  Windows

  1	npm install hexo-cli -g

macOS

1	sudo npm install hexo-cli -g

• 创建网站目录：

  1	mkdir blog

• 通过blog目录创建站点：

  1	hexo init blog

• 安装过程：

  1 2 3 4 5 6 7 8

  admindeMacBook-Pro:~ admin hexo init blog INFO Cloning hexo-starter to ~/blog [email protected] /Users/admin/blog ... 部分省略 ├── [email protected] └── [email protected] INFO Start blogging with Hexo!

• 安装完成后,进入blog站点目录,安装一下npm插件支持(如果是其他电脑克隆了这个项目，需要执行下面的安装命令)：

  1 2	cd blog $ npm install

• 启动站点：

  1 2 3

  $ hexo server INFO Start processing INFO Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.

• 查看站点：
  在浏览器中查看http://localhost:4000/

• 配置GitHub
  在blog目录,打开_config.yml

  1	$ vim _config.yml

• 修改配置文件_config.yml中deploy下的内容

  1 2 3 4 5 6 7

    # Deployment ## Docs: https://hexo.io/docs/deployment.html deploy: type: git repo: https://github.com/CoderDream/coderdream.github.io.git branch: master

• Github部署配置参数详解

  1 2 3 4 5

  deploy: 表示部署设置 type: 部署类型,支持git,heroku repo: 部署位置 git仓库项目的位置 branch: 部署到Github的分支名称 message: 自定义提交信息

• 设置语言

  1	language: zh-CN

• 安装部署插件
  配置修改完成后,需要安装部署插件:
  安装 hexo-deployer-git 插件: 在blog目录执行以下命令即可

  1	$ npm install hexo-deployer-git --save

• 插件安装完成后,执行项目清理和静态网页生成

  1 2	$ hexo clean $ hexo genarate

• 安装完成后进行部署

  1	大专栏  Hexo 系统 BlueLake 主题安装与设置class="code"> $ hexo deploy

• 一键发布

  1	hexo clean; hexo generate; hexo deploy

• 查看结果
  然后到你的Github上项目的主页,看看master分支上的代码更新时间

给自己的Hexo博客加上图片

• 首先把blog（hexo）目录下的_config.yml里的psot_asset_folder:设置为true

• 在blog（hexo）目录下执行:

  1	npm install hexo-asset-image --save

• 在blog（hexo）目录下Git Bash Here，运行hexo n “博客名”来生成md博客时，会在_post目录下看到一个与博客同名的文件夹。

• 将想要上传的图片先扔到文件夹下，然后在博客中使用markdown的格式引入图片：

  1	

Hexo中提供文件下载功能

• 在source目录下新建dounload文件夹，将需要上传的文件xx.xls复制到该目录。
• 在_posts博文中，插入：

  1	[点击下载](/download/xx.xls")

添加本地搜索

默认本地搜索是用原生JS写的，但还需要HEXO插件创建的JSON数据文件配合。安装插件hexo-generator-json-content来创建JSON数据文件：

1	$ npm install [email protected] --save

• 然后在根_config.yml添加配置：

  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: true

• 最后在主题_config.yml添加配置(themes/BlueLake/_config.yml)：

  1	local_search: true

设置阅读全文

• 您可以在文章的 front-matter 中添加 description，并提供文章摘录，或在文章中使用下面的代码手动进行截断（Hexo推荐的方式）。

  1	<escape><!-- more --></escape>

解决busuanzi无效的方法

• 使用nodepad++的【搜索】->【查找】->【文件查找】的【在文件中替换】：

  1	dn-lbstatics.qbox.me 替换为 busuanzi.ibruce.info

• 如图所示
  

 
 
参考文档：

1. Hexo 创建“关于我”界面
2. 给自己的Hexo博客加上图片
3. Hexo中提供文件下载功能
4. BlueLake官网
5. 解决 busuanzi 无效的方法（hexo-theme-next）
6. bash devtty No such device or address