基于Hexo+Github搭建属于自己的博客

Informalessay
基于Hexo+Github搭建属于自己的博客：

本文介绍了如何使用Hexo + github搭建一个属于自己的博客平台·，简易上手，操作简单。

Hexo + Github 搭建属于自己的个性化博客

一直想写自己的博客，但又不想使用CSDN或者博客园之类的拿来即用的博客网站，思来想去还是想搭建出一个适合自己风格，稍有些技术向的博客。查阅了好些的文章，找到了“T9的第三个三角”大佬的如何从零开始搭建自己的博客（通俗易懂）这篇文章，从而开始了自己的博客之旅，感谢文章作者！！！

话不多说，现在就开始搭建属于自己的博客

首先介绍下我本身的搭建环境：

系统：windows 10

软件：

​ git ：一款免费、开源的分布式版本控制系统

​ node.js：建立在Chrome上的JavaScript运行引擎

平台：

​ Hexo ：一款快速、简洁且高效的博客框架

​ Github：一款面向开发者的云端开发平台，提供代码托管，运行空间，质量控制，项目管理等功能

所需的软件就是以上这些，不是太难寻找，为了提升各位大佬搭建博客的速度，附上各官网下载链接node.js官方中文下载网站、git官方网站。

首先我们需要下载软件，搭建环境。

进入node.js中文官方界面，因为是中文网站，直接点击下载界面，选择相应的版本下载，安装时只有安装位置可自行选择更改，其余默认即可。



进入git官网，点击Downloades选择适合自己的版本开始下载，安装步骤大同小异，无太大区别。



软件安装好后，我们需要去github，如果已经有的话直接登录就可以，如果没有的话，输入用户名、邮箱、和密码注册一个属于自己的github账号



登录成功后，点击右上方头像旁边的下三角，点击Your repositories进入自己的仓库



点击New新建仓库，会弹出如下界面仓库名字输入自己的用户名+github+io，例如我的用户名是Draculaspider，那么我新建的仓库名就是Draculaspider.github.io，下方选择Pubblic，并且点击Create repository完成仓库创建，这个仓库名就是以后访问博客的域名



创建成功后，进入新仓库，找到Settings选项，下拉在GitHub Pages中选择一个主题，之后一个托管在github上的博客就搞定了，大概过一会后，例如我的个人博客：http://draculaspider.github.io 就可以访问了，注意，将其中的用户名换成你创建的仓库名，这时候你就可以访问自己的博客了



这个时候，看着官方自带的博客主题是不有些难受呢，觉得这不是我想要的博客，太难看了

别着急，接下来我们来配置自己个性化的博客

Hexo

前面我们已经安装了Git、Node.js，然后使用npm，安装hexo:

打开git-bash

1
$ npm install -g hexo-cli

安装完毕，我们就需要对自己的仓库进行配置了，首先使用Git，将自己的仓库克隆到本地

克隆仓库

复制仓库地址，在本地创建一个个人博客的文件夹，例如GitHub_Blog，进入文件夹，使用git命令

1
$ git clone git@github.com:Draculaspider/Draculaspider.github.io.git

配置Hexo

1
2
3
$ hexo init <替换为当前博客文件夹，例如我的是/e/GitHub_Blog/Draculaspider.github.io/android_Dra >
$ cd /e/GitHub_Blog/Draculaspider.github.io/android_Dra
$ npm install

新建完成后，指定文件夹的目录如下：

1
2
3
$ ls -D
_config.yml  node_modules/  package-lock.json  scaffolds/  themes/
db.json      package.json   public/            source/

我们大部分的操作都在_config.yml中，打开_config.yml，查看信息：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/

# Site
title: 小白的个人博客		#你博客的标题
subtitle: 工作，生活，缺一不可		#显示在浏览器上搜索的时候显示的标题
description: 喜欢未知的生活		#描述
author: LH		#显示作者
email: 821859204@qq.com		#邮箱
language: zh-Hans		#语言
timezone: Asia/Beijing		#时区

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://Draculaspider.github.io     #填写你的博客地址
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:

# Directory
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render:

# Writing
new_post_name: :title.md # File name of new posts
default_layout: post
titlecase: false # Transform title into titlecase
external_link: true # Open external links in new tab
filename_case: 0
render_drafts: false
post_asset_folder: false
relative_link: false
future: true
highlight:
  enable: true
  line_number: true
  auto_detect: false
  tab_replace:

# Home page setting
# path: Root path for your blogs index page. (default = '')
# per_page: Posts displayed per page. (0 = disable pagination)
# order_by: Posts order. (Order by date descending by default)
index_generator:
  path: ''
  per_page: 10
  order_by: -date

# Category & Tag
default_category: uncategorized
category_map:
tag_map:

# Date / Time format
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-MM-DD
time_format: HH:mm:ss

# Pagination
## Set per_page to 0 to disable pagination
per_page: 10
pagination_dir: page

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: black-blue

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

我们要修改的就是有注释的地方

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
# Site
title: 小白的个人博客					 #你博客的标题
subtitle: 工作，生活，缺一不可		   #显示在浏览器上搜索的时候显示的标题
description: 喜欢未知的生活			 #描述
author: LH							 #显示作者
email: 821859204@qq.com				  #邮箱
language: zh-Hans					 #语言
timezone: Asia/Beijing				 #时区

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://Draculaspider.github.io     #填写你的博客地址
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
#如果要修改主题的话，就修改theme,后续会讲到下载自己喜爱的主题
theme: black-blue

# Deployment
## Docs: https://hexo.io/docs/deployment.html
#Github仓库地址
deploy:
  type: git
  repo: https://github.com/Draculaspider/Draculaspider.github.io.git
  branch: master

添加文章

将上面的信息都修改成自己的后，就可以开始写文章了，进入source/_posts，新建一个Markdown文件，献给写作者的Markdown新手指南，在安利一波我个人用的，感觉比较好用的Markdown写作软件——Typora(下载链接)

比如，我新建一个hello.md文件，内容很简单

1
2
3
4
5
$ cat hello-world.md
---
title: Hello World
---
hello world

保存之后，就需要把添加好的博客上传至Github上了

上传GitHub

在GitHub_Blog文件下，执行命令(建议每次都按照这个做)

1
2
3
$ hexo clean      #清除缓存和public文件夹下的文件
$ hexo generate   #将.md文件编译为静态页面
$ hexo deploy     #上传所做的更改

搞定！这时候去浏览器输入你的域名，是不是成功看到了你的博客呢

风格不适合自己，不喜欢，简单，去更换主题，挑一个自己喜欢的，去Hexo查看缤纷多彩的主题

这个Adagio不错，蛮好看的，就他了，点击姓名即可进入主题的github，找到github地址



1
https://github.com/Hanlin-Dong/hexo-theme-adagio    #浏览器地址栏复制粘贴

进入到GitHub_Blog，进入到themes文件夹下，克隆这个主题

1
2
$ cd GitHub_Blog/themes
$ git clone https://github.com/Hanlin-Dong/hexo-theme-adagio.git

然后回到博客文件夹下，找到并修改主配置文件_config.yml

1
2
## Themes: https://hexo.io/themes/
theme: hexo-theme-adagio

保存，然后重新上传至GitHub

1
2
3
$ hexo clean      
$ hexo generate   
$ hexo deploy

成功！！

可能遇到的问题

1、上传时碰到Warning: Permanently added the RSA host key for IP address ‘***‘ ……Permission denied（publickey）的问题。

首先打开git-bash

1
2
3
$ cd C:          #进入C盘
$ cat ~/.ssh/id_rsa.pub
ssh-rsa AAAAB3NzaC1yc2EAAAADAQABAAABAQDDDn+qVbCtJ7qvk9D1f8jwuyHUSLLrHSFZjyOhtWWUl+EUMY9lL8T/I0nSCgtCxb0xWZGS6xO4KM8bT3MKFyn1i0q15I8anPNqrOEkzkMyY6WEXSshhRi8za9IT6O/VsJb0zczBHi8jeAnsmZXyA8H4vFmATKJs/zOtTfXYrw/SAElJsBIeO3uUmsBE/19OLaE7KDbxGOyUUFuWzvkLfQCq0396ZkMaw4a/Us1qGirG51q11Nt8ZPp0WTZFqvn87R/7TUByU2FLQCDdoX8ftTAcVZSTdi4z8cT3KjollFEDJvH6PgMyZRcqzVUSUvTv0UI4ozi4/Ciy9eIlPeQ6xBF 82185@DESKTOP-3TQEIVR

输入第二行后，应该会出现如图所示的一大段字符，如果没有的话，说明没有公钥，我们需要自己创建一个

1
$ ssh-keygen

输入上述代码后，一直回车就行，最后会出现一个矩形框一样的东西，就说明公钥已经生成了，然后继续输入命令cat ~/.ssh/id_rsa.pub，弹出来的一大段即是公钥，右键复制即可

然后打开浏览器登录进github，还是点击头像旁边的下拉框，点击settings



进入后，找到SSH and GPG keys，点击进入，点击New SSH key新建，title自己取名，key中粘贴刚才的公钥，然后保存成功，进入git-bash再次连接就好了



2、上传时报错，提示输入用户名，和邮箱，首先需要为自己配置身份信息

1
2
$ git config --global user.name "yourname"               #你的github用户名
$ git config --global user.email "youremail"             #你的github绑定的邮箱

输入完以上这些后，删除掉根目录下的文件夹：.deploy_git(隐藏文件夹，需用 ls -a 查看)，重新deploy就可以了。

3、使用命令”npm install -g hexo-cli”安装hexo时出现错误

在命令行前加上sudo即可

1
$ sudo npm install -g hexo-cli

4、出现ERROR Deployer not found: github

安装hexo-deployer-git

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

在”_config.yml”配置中将deploy 的 type由github改为git后，重新deploy

转载请注明来源，谢谢合作！！

本文标题:基于Hexo+Github搭建属于自己的博客

文章作者:LH

发布时间:2019年09月19日 - 15时22分

最后更新:2019年10月09日 - 15时23分

原始链接:http://Draculaspider.github.io/2019/09/19/基于Hexo-Github搭建属于自己的博客/

许可协议: "署名-非商用-相同方式共享 3.0" 转载请保留原文链接及作者。

文章目录
  1. 1. Hexo + Github 搭建属于自己的个性化博客
    1. 1.1. 话不多说，现在就开始搭建属于自己的博客
    2. 1.2. 首先我们需要下载软件，搭建环境。
  2. 2. Hexo
    1. 2.1. 克隆仓库
    2. 2.2. 配置Hexo
    3. 2.3. 添加文章
    4. 2.4. 上传GitHub
  3. 3. 可能遇到的问题
  4. 4. 转载请注明来源，谢谢合作！！
dn-lbstatics.qbox.me