pic
如果一只鸟在周围没有任何生物的情况下唱了一首歌 后来她死了
这首歌存在吗?
Environment
Required
- OS X
此教程基于 OS X ，Windows 用户仅供部分参考
- HomeBrew
- Node.js
- Git
- Hexo
- GitHub account
- Disqus account 或多说账户
Optional
- Swiftype account
- 百度统计账户
- 域名
- DNSPod account
Installation
HomeBrew
打开你的 Terminal 或 iTerm ，输入
$ ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
Git & Node.js
Terminal 输入
$ brew install git
安装完成后再输入
$ brew install node
npm 会跟 node 一同装好
Hexo
Terminal 输入
$ npm install -g hexo-cli
至此安装完毕
Setup
Initialize
以创建于 ~/Desktop/Joe 为例
$ hexo init ~/Desktop/Joe
$ cd ~/Desktop/Joe
$ npm install
项目结构如下：
.
├── _config.yml
├── package.json
├── scaffolds
├── scripts
├── source
| ├── _drafts
| └── _posts
└── themes
Configuration
yaml语法严谨，千万不要忘记空格!
打开~/Desktop/Blog/_config.yml
填入以下内容
# 博客名称
title: Joe's Room
# 描述
description: 井蛙语海 夏虫语冰
# 作者
author: Joe
# 博客语言
language: zh-Hans
# 博客地址
url: http://joehill.me
#主题名称
theme: next
# 多说
duoshuo_shortname: your-duoshuo-shortname
# Disqus 帐号(多说 Disqus 二选一)
disqus_shortname: your-disqus-shortname
##增加以下内容##
# 社交链接，将在侧栏中显示
social:
GitHub: your-github-url
Twitter: your-twitter-url
Weibo: your-weibo-url
DouBan: your-douban-url
ZhiHu: your-zhihu-url
# ID 为百度统计提供脚本中 hm.js? 后字符串，非百度统计帐号
baidu_analytics: 41f2ac3e7c22ef73312321800c11b369
# 站点起始时间
since: 2011
# swiftype 站内搜索
swiftype_key: EKNBn-kdy2Bpu7SQLsGp
# Creative Commons 4.0 International License.
# http://creativecommons.org/
# Available: by | by-nc | by-nc-nd | by-nc-sa | by-nd | by-sa | zero
creative_commons: by-nc-sa
Theme
本文推荐使用 next 主题，下文仅以 next 为例。
Installation
$ cd ~/Desktop/Joe
$ git clone https://github.com/iissnan/hexo-theme-next themes/next
Configuration
_config.yml
打开~/Desktop/Blog/themes/next/_config.yml
# 控制主题导航栏显示内容
menu:
home: /
categories: /categories
archives: /archives
tags: /tags
# 设置为紧凑型主题
scheme: Mist
Navi
目前导航栏中「分类」和「标签」是无法正常显示的
$ cd ~/Desktop/Joe
$ hexo new page tags
$ hexo new page categories
会在 ~/Desktop/Joe/source 下创建 tags 与 categories 目录
编辑 ~/Desktop/Joe/source/tags/index.md
# 设置当前 page 类型为 tags
type: "tags"
# 设置当前页评论关闭
comments: false
编辑 ~/Desktop/Joe/source/categories/index.md
# 设置当前 page 类型为 categories
type: "categories"
# 设置当前页评论关闭
comments: false
Avatar & Favicon
头像文件 default_avatar.jpg 放入 ~/Desktop/Joe/themes/next/source/iamges 目录下
favicon 文件 favicon.ico 放入 ~/Desktop/Joe/themes/next/source 下
First Blog
$ cd ~/Desktop/Joe
$ hexo new firstblog
~/Desktop/Joe/source/_posts 下生成 firstblog.md 文件
编辑 firstblog.md
# 文章题目
title: 在GitHub上搭建基于Hexo的静态Blog
# 所属分类
categories:
- Web
# 标签(多个标签如下所示)
tags:
- Hexo
- GitHub
- Disqus
`` 以上为文章列表显示摘要部分
正文书写参考 Markdown 语法
Generate
$ cd ~/Desktop/Joe
$ hexo generate // 生成静态文件
$ hexo server // 启动本地服务器
访问 http://localhost:4000 即可访问blog
Hexo Plugins
Hexo 为我们提供了很多 Plugins ，让我们可以更专注于博客的内容书写
hexo-deployer-git
用于git部署
$ cd ~/Desktop/Joe
$ npm install hexo-deployer-git --save
hexo-generator-sitemap
生成sitemap便于搜索引擎抓取
$ cd ~/Desktop/Joe
$ npm install hexo-generator-sitemap --save
Deployment
只在本地可以看博客怎么会是我们的终极目的，下一步我们要将 blog 部署到 github 的仓库中
Repository
登录 GitHub 账户，新建一个 repository
Repository name 起成 name.github.io
_config.yml
打开 ~/Desktop/Blog/_config.yml
# 部署信息
deploy:
type: git
# https://github.com/GitHubName/RepositoryName.git
repo: https://github.com/Joe-Hill/joe-hill.github.io.git
branch: master
Go!
$ cd ~/Desktop/Joe
$ hexo deploy
访问 https://RepositoryName (如 https://joe-hill.github.io)
即可访问Blog
Domain name Resolution
如果你拥有一个域名，比如 joehill.me 可以将其解析到你的Blog上
以域名joehill.me,DNS解析万网为例
创建一个 A 记录，主机记录为 @ ，解析线路选择默认，记录值为 103.245.222.133
~/Desktop/Joe/source 下创建无扩展名内容为 joehill.me 文件 CNAME
$ cd ~/Desktop/Joe
$ hexo generate
$ hexo deploy
等待解析成功，既可访问http://joehill.me
Tips
常用指令
$ hexo server
$ hexo generate
$ hexo deploy
可以简写成
$ hexo s
$ hexo g
$ hexo d
那么静态化 + 部署就可以写成
$ hexo d -g
开启你的美妙Blog之旅吧！
网友评论