Hexo Tutorial再整理

发表于 | 分类于 | | 浏览 次

Hexo入门

Hexo环境配置

Hexo 使用

 hexo init
  • 类似git init 需要新建目录保存博文信息；
  • 执行命令会在当前目录下生产如下文件：
    ├── _config.yml #全局配置文件
├── node_modules #Hexo插件（Node.js 插件默认安装目录）
├── package.json #Node 工程的依赖和基本信息
├── scaffolds  #模板
├── source #博客正文源文件
└── themes
    【重点】如果你有配置，会覆盖你原来的配置；

安装package.json 下面的依赖包

npm install

测试hexo是否正确安装

 hexo init 
 cd folder
 npm install
 npm install hexo-server --save
 hexo server
# 访问是否正常显示 http://localhost:4000/

Mac 快速配置

#node install //brew uninstall nodejs
brew install -g node
#hexo 全局安装
npm install -g hexo-cli

github 关联

  1. ssh key 生成
    ssh-keygen -t rsa -C "zhi.designer@hotmail.com"
  2. 把id_rsa.pub 复制到 github.com
    github.com -> Settings -> SSH and GPG keys

hexo 配置

主题配置

hexo-theme-next主题的配置
最强主题基本上所有的配置信息都能满足,优雅,文档齐全

  • 安装 Next主题 基本和教程走一边,就可以得到一个很牛的网站了

  • 三种主题样式的选择： hexo/themes/next/_config.xml 搜索 scheme

  • 网站logo设置

    通过网站favicon在线制作制作favicon图片，logo最好设置32*32。
    next主题：将图片放在next主题source/images目录下
    在next主题配置文件中添加：favicon: images/favicon.ico

  • 设置首页是否为摘录（不显示所有内容）{your-hexo-dir}/themes/next/_config.yml auto_excerpt true

    注册云存储存储图片

    防止图片链接失效,和在博客迁移过程中导致的图片获取异常,丢失. 统一管理文章中的图片

域名绑定

  • 设置域名的指向的地址
  • 在源文件中增加github page 的设置文件 source/CNAME 并增加你的域名,不带www的,例如:’taobao.com’

Hexo 显示访问次数

hexo页脚添加访客人数和总访问量

代码高亮 hexo-prism-plugin

$hexo_dir/_config.yml

常用的方法

命令简写

hexo n == hexo new
hexo g == hexo generate
hexo s == hexo server
hexo d == hexo deploy

一般的发布步骤

hexo clean #删除产生的文件和缓存
hexo (g)generate # 生成静太文件
hexo (d)deploy # 发布网页

日常维护命令

npm update -g hexo #hexo 更新
cd /{you-blog-dir}/theme/next git pull #更新主题代码
npm update # 更新插件

高级玩法

添加网易云音乐

由于markdown支持HTML, 打开网页版网易云音乐–> 点击生成外链播放器 –> 直接粘贴网易云音乐的外链接iframe代码

### 添加high一下

效果整个页面渐进式摇摆,摇摆

  • 复制header.swig的代码到
    {your-hexo-dir}/themes/next/layout/_custom/header.swig
  • 本地刷新在菜单栏附近出现High一下 点击查看效果

问题解决及记录

记录一下日常解决的问题

  • ERROR Plugin load failed: hexo-server 解决: npm install hexo-server
  • ERROR Deployer not found: Git 解决： npm install hexo-deployer-git –save
  • Cannot GET 解决 npm install

参考

附录

官方资源

Hexo 官网 主页

文档 API 插件 主题 可以在官网找

Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub.

快速直达

文档

Troubleshooting

命令解析

Create a new post

$ hexo new "My New Post"

More info: Writing

Run server

$ hexo server

More info: Server

Generate static files

$ hexo generate

More info: Generating

Deploy to remote sites
More info: Deployment

$ hexo deploy