hexo搭建github个人博客简明教程
从零开始搭建github个人博客,基于window系统(linux同理),适合大众。
整体上,在Github Pages的基础上使用hexo框架来搭建博客,代码存本地,上传github,方便迁移。
搭建好后,使用Markdown来书写博客,如果不懂Markdown,没关系,很好入门。
安装git
去git官网下载对应的版本,点击安装就好。
安装完成后,在cmd上输入 git version
查看是否安装成功,成功会输出对应的git版本。
之后使用的时候,只需要在需要操作的文件目录下点击鼠标右键,菜单栏中就会出现Git GUI here
和 Git Bash Here
,一般我们选择 Git Bash Here
来进行命令行操作。 后续的命令行操作都是在 Git Bash
中进行了,防止出错。
安装node.js
去node官网 下载对应的版本,win最好选64位的msi, 双击安装就OK了。
创建Github仓库
- 首先需要一个github账号,邮箱注册并验证;
- 创建Repositories,登入个人账户后,有个绿色的
new repository
按钮,点击创建创库,或者输入:https://github.com/new
注意: 创建的仓库名为:你的github用户名.github.io,比如我的zekizz.github.io - 仓库创建成功不会立即生效,需要过一段时间,创建成功后默认会在你这个仓库里生成一些示例页面,以后你的网站所有代码都是放在这个仓库里啦。
配置SSH key
配置的目的是方便提交代码,否则每次都需要输入用户名和密码很麻烦。
首先在任意位置右键打开Git Bash
, 输入
cd ~/.ssh #检查本机是否已存在的ssh密钥
如果提示:No such file or directory
,说明是第一次使用git,如果是,生成key
ssh-keygen -t rsa -C "你的github注册邮件地址"
一路回车,最终会在
C:\Users\你的用户名\
文件夹下生成密钥文件。
用文本编辑器(或记事本)打开.ssh\id_rsa.pub
, 复制里面的内容
打开你的github主页,进入 setting -> SSH and GPG keys -> New SSH key
将刚才复制的内容粘贴到Key中,title随便填,保存。
测试是否成功
ssh -T git@github.com # 注意邮箱地址不用改
如果提示
Are you sure you want to continue connecting (yes/no)?
,输入yes,然后会看到Hi XXX! You've successfully authenticated, but GitHub does not provide shell access.
说明SSH配置成功
最后配置git用户信息
git config --global user.name "username"// 你的github用户名,非昵称
git config --global user.email "email"// 填写你的github注册邮箱
安装hexo
安装只需要一条命令,在git bash中输入
npm install -g hexo
下一步是创建博客项目和初始化
首先,在你喜欢的地方创建一个文件夹,用于存放博客项目代码,比如 E:\git_code\blog\Hexo
,路径上最好不要有中文吧
然后在该目录下,右键打开git bash
, 输入
hexo init
hexo会自动下载一些文件到这个目录,我们首先不管内容
继续在git bash
中输入
hexo g # 生成
hexo s # 启动服务
hexo s
是开启本地预览服务,于是可以打开浏览器,访问 http://localhost:4000,预览生成的博客。
然后…
你就会看到一个巨丑的博客页面!!!
这个页面是hexo默认生成的,主题很丑,所以我们需要修改主题。
Hexo提供了一系列主题,进入主题专栏,挑选主题。
挑好主题后,进入主题的github页,需要克隆主题项目,比如主题Anisina
进入Hexo文件夹下的themes目录,右键打开git bash
,输入
git clone https://github.com/Haojen/hexo-theme-Anisina.git(此处地址替换成你需要使用的主题的地址)
注意!!!
这里clone项目后,需要修改下文件夹的名字,比如目前的文件夹为hexo-theme-Anisina
,需要修改为Anisina
,因为主题名为Anisina
,防止之后设置主题的时候出错或无效。
然后修改hexo目录下的_config.yml
,将theme: landscape
修改为theme: Anisina
,然后重新hexo g
来生成新的文件。
如果出现一些莫名其妙的问题,可以先执行hexo clean
来清理一下public的内容,然后再来重新生成和发布。
其次,按照主题的github Readme来设置主题的一部分参数,这里暂不做描述,自行按照喜好配置,配置的文件为themes
目录下,主题文件夹下的_config.yml
。
需要特别注意的地方是,冒号后面必须有一个空格,否则可能会出问题。
这里唯一需要注意的是关于留言页的设置,我倾向于配置为gitalk
或者gitment
,这个要看主题是否支持,这里放在之后叙述。
上传github
首先配置hexo目录下的_config.yml
,
修改deploy
部分
deploy:
type: git
repository: git@github.com:zekizz/zekizz.github.io.git
branch: master
这里替换成你自己的,在clone or download那里
其次,安装一个插件
npm install hexo-deployer-git --save
如果前面都OK了,在hexo目录下,打开git bash
,然后输入
hexo d
就OK了。
一般上传可以采用组合键
hexo d -g #生成并上传
这里给出常用hexo命令
hexo new "postName" #新建文章
hexo new page "pageName" #新建页面
hexo generate #生成静态页面至public目录
hexo server #开启预览访问端口(默认端口4000,'ctrl + c'关闭server)
hexo deploy #部署到GitHub
hexo help # 查看帮助
hexo version #查看Hexo的版本
对应的简写
hexo n == hexo new
hexo g == hexo generate
hexo s == hexo server
hexo d == hexo deploy
写新博客并上传
首先定位到hexo根目录,打开git bash
hexo new 'my-first-blog' # 替换为你的取得博客文件名
然后就会在source\_posts
文件夹下生成my-first-blog.md
文件,打开该文件进行书写。
这里书写采用的是markdown,不熟的,这里给出两个教程
认识与入门 Markdown
怎样引导新手使用 Markdown?
书写markdown的工具
win: MarkdownPad
mac: Mou(目前最新mac版本好像不支持)、MacDown
写完后,组合键
hexo d -g #生成并上传
完成上传,或者
hexo clean
hexo g
hexo g
hexo d
博客内容
最前面的页面设置,举一个栗子
---
title: your title
date: 2018-09-17 22:50:10
tags:
- machine learning
- blog
mathjax2: true
categories: ML
---
line 1 xxx
line 2 xxx
<!--more-->
line 3 xxx
这里<!--more-->
是分割摘要的,line 1 xxx
和line 2 xxx
将作为摘要显示在主页中。
配置留言功能
我使用的主题是maupassant,主题中已经支持了多种留言方式,只需要对应配置而已,这里推荐使用gitalk。
如果主题未支持,参考:
如果像主题maupassant这样已经提供了如下的gitalk功能支持,只需要简单配置一下。如果gitalk功能自己已配置好,后续的配置也同理
disqus: ## Your disqus_shortname, e.g. username
uyan: ## Your uyan_id. e.g. 1234567
livere: ## Your livere data-uid, e.g. MTAyMC8zMDAxOC78NTgz
changyan: ## Your changyan appid, e.g. cyrALsXc8
changyan_conf: ## Your changyan conf, e.g. prod_d8a508c2825ab57eeb43e7c69bba0e8b
gitment:
enable: false ## If you want to use Gitment comment system please set the value to true.
owner: ## Your GitHub ID, e.g. username
repo: ## The repository to store your comments, make sure you're the repo's owner, e.g. imsun.github.io
client_id: ## GitHub client ID, e.g. 75752dafe7907a897619
client_secret: ## GitHub client secret, e.g. ec2fb9054972c891289640354993b662f4cccc50
gitalk:
enable: false ## If you want to use Gitment comment system please set the value to true.
owner: ## Your GitHub ID, e.g. username
repo: ## The repository to store your comments, make sure you're the repo's owner, e.g. gitalk.github.io
client_id: ## GitHub client ID, e.g. 75752dafe7907a897619
client_secret: ## GitHub client secret, e.g. ec2fb9054972c891289640354993b662f4cccc50
admin: ## Github repo owner and collaborators, only these guys can initialize github issues.
valine: ## https://valine.js.org
enable: false ## If you want to use Valine comment system, please set the value to true.
appid: ## Your LeanCloud application App ID, e.g. pRBBL2JR4N7kLEGojrF0MsSs-gzGzoHsz
appkey: ## Your LeanCloud application App Key, e.g. tjczHpDfhjYDSYddzymYK1JJ
notify: false ## Mail notifier, see https://github.com/xCss/Valine/wiki/Valine-评论系统中的邮件提醒设置
verify: false ## Validation code.
placeholder: Just so so ## Comment box placeholders.
avatar: 'mm' ## Gravatar type, see https://github.com/xCss/Valine/wiki/avatar-setting-for-valine
pageSize: 10 ## Number of comments per page.
guest_info: nick,mail,link ## Attributes of reviewers.
首先创建新应用OAuth application和Personal access tokens,具体位置在Settings -> Developer settings
- 点击
new OAuth Apps
创建新应用
参数说明- Application name: 随便填
- Homepage URL: 网站URL,https://你的github用户名.github.io
- Application description : 随便填
- Authorization callback URL: 网站URL,https://你的github用户名.github.io
- 注册成功后,就会得到
Client ID
和Client Secret
,这个填到上文所示的配置中 一般以上配置好后,第一次需要手动登陆初始化一下就OK了,如果有的主题配置完后出现gitalk未初始化,参考 自动初始化 Gitalk 和 Gitment 评论,这个时候就需要获取token了。
注意:这里的配置需要sitemap,hexo默认没有添加sitemap功能,需要添加一下,
参考 hexo(3)-生成sitemap站点地图
推送到百度和谷歌检索
本博客所有文章除特别声明外,均采用 CC BY-SA 4.0 协议 ,转载请注明出处!