阅读导览

  1. 安装Git和Hexo
  2. 使用Hexo进行本地建站
  3. 创建一篇文章
  4. 添加主题
  5. 配置github
  6. 将网站发布到Github
  7. 最后效果展示

1.安装Git和Hexo

安装Hexo前,需要安装Node.js和Git:

安装好以上两个环境之后,打开打开Git-bash,输入

npm install -g hexo-cli

即可完成Hexo的安装。
安装完成后可能提示:

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0
(node_modules\hexo-cli\node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for
fsevents@1.1.2: wanted {"os":"darwin","arch":"any"} (current:
{"os":"win32","arch":"x64"})


后面的安装也会出现类似提示,忽略即可,因为 fsevent是mac osx系统的,在win或者Linux下使用了 所以会有警告。

 

2.使用Hexo进行本地建站

选择一个本地的文件夹,如H:\HexoBlog
依次执行:

hexo init H:/HexoBlog
cd H:\HexoBlog
npm install

如果hexo安装成功,则在C:\hexo文件夹下的文件目录为

.
├── _config.yml // 网站的配置信息,你可以在此配置大部分的参数。
├── package.json
├── scaffolds // 模板文件夹。当你新建文章时,Hexo会根据scaffold来建立文件。
├── source // 存放用户资源的地方
| ├── _drafts
| └── _posts
└── themes // 存放网站的主题。Hexo会根据主题来生成静态页面。

详细文件或文件夹的具体含义见 Hexo官方文档
之后输入

hexo server

此时会启动本地部署好的默认的博客网站,地址是:http://localhost:4000/,打开就可以查看了。

 

3.创建一篇文章

hexo new "文章名" #新建文章
hexo new page "页面名" #新建页面

常用简写
hexo n == hexo new
hexo g == hexo generate
hexo s == hexo server
hexo d == hexo deploy
详细命令请参考Hexo文档

新建一篇文章后就可以预览了,在hexo new之后执行一次生成hexo g再执行hexo s启动本地服务器,此时刷新http://localhost:4000/页面就可以预览了。

 

一种创建文章的简单方式

我们还可以使用Hexo Admin插件,通过网页的方式发布新文章。
它能够管理文章,添加分类和标签,也可以一键部署到pages
有网友修改的版本实现了图片的粘贴上传,请参考hexo-admin-qiniu(根据hexo-admin@2.1.0进行修改,添加粘贴图片上传至七牛)

 

4.添加主题

 

4.1安装主题

Hexo主题官网或者网上找一个自己喜欢的主题,获取它的git clone链接,如yilia主题,
使用下面的命令安装主题:

git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia
 

4.2启动主题

找到目录下的_config.yml 文件,打开找到 theme:属性并设置为yilia,重新发布网站时就会采用新的主题了

 

4.3更新主题

cd themes/yilia
git pull
hexo g
hexo s

此时刷新http://localhost:4000/页面就能看到新的主题了.

 

5.配置github

 

5.1创建GitHub账号

首先需要一个github账号,没有的话先注册一个,网址:https://github.com/

 

5.2创建与账号同名的Repository

然后创建一个与账号同名的Repository
一定要同名的Repository,比如帐号是myid,那新建的Repository名称应该是myid.github.io

当你的仓库名为:用户名.github.io 之后默认开启Github Pages,然后才可以通过用户名.github.io访问

 

5.3配置SSH

检查是否已经有SSH Key,打开Git Bash,输入

cd ~/.ssh

如果没有这个目录,则生成一个新的SSH,输入

ssh-keygen -t rsa -C "your e-mail"

其中,your e-mail是你注册Github时用到的邮箱。
连续几个按回车,密码为空,然后在在~/.ssh/下,得到两个文件id_rsa和id_rsa.pub
复制id_rsa.pub中的所有内容
打开Github官网,登陆后进入到个人设置(点击头像->setting),点击右侧的SSH and GPG keys(或者直接打开网址https://github.com/settings/ssh),点击Add SSH key;填写title之后,将之前复制的内容粘贴到Key框中,最后点击Add key即可。

 

5.4验证证是否能否连接到github

输入

ssh -T git@github.com

如果提示

The authenticity of host 'github.com (192.30.253.112)' can't be established. RSA key fingerprint is SHA256:xxxxxxxxxxxxxxxxxxxxxxxxxx. Are you sure you want to continue connecting (yes/no)? y Please type 'yes' or 'no': yes

或者提示覆盖原来的文件,选择yes回车,只要能看到如下提示:

Hi username! You've successfully authenticated, but GitHub does not provide shell access.

就说明SSH配置成功。

 

5.5配置github账户

git config --global user.name "username"
git config --global user.email "email"

配置完之后输入:

git config --list

查看已设配置,看username ,email是不是都对了。

 

6.将网站发布到Github

 

6.1修改Hexo配置文件

打开H:\HexoBlog文件夹中的_config.yml文件,找到如下位置,填写:

# Deployment
## Docs: http://hexo.io/docs/deployment.html
deploy:
type: git
repo: git@github.com:MyGithub/MyGithub.github.io

(1) 其中MyGithub替换成你的Github账户;
(2)注意在yml文件中,:后面都是要带空格的。

 

6.2安装Hexo deployer

发布Hexo需要用到Hexo deployer,使用如下命令安装:

npm install hexo-deployer-git --save
 

6.3发布网站到github

在git中进入网站根目录

cd H:/HexoBlog
hexo -g #编译本地内容
hexo -d #发布到github

完成后就可以通过MyGithub.github.io域名去访问自己的博客啦!

7.最后效果展示

演示地址:https://leftshine.github.io/

使用 GitHub+Hexo 搭建个人博客的更多相关文章

  1. Linux下使用 github+hexo 搭建个人博客07-next主题接入搜索和站点管理

    这是搭建个人博客系统系列文章的最后一篇,如果你是从第一篇一路跟下来的,那么恭喜你,即将完成整个博客网站的搭建.OK,话不多说,开始我们的收官之战. 不知你想过没有,如果我们的文章少,一眼看完整个目录, ...

  2. Linux下使用 github+hexo 搭建个人博客06-next主题接入数据统计

    之前说了 next 主题的优化和接入评论系统.让我们完成了自己所需的页面风格和排版,也可让访问用户在每篇博文评论,完成博主和访问用户的交互. 本章我们继续讲解其他重要功能. 既然是一个网站,那么我们就 ...

  3. Linux下使用 github+hexo 搭建个人博客05-next主题接入评论系统

    静态站点拥有一定的局限性,因此我们需要借助于第三方服务来扩展我们站点的功能. 而评论系统是最常用于和网站用户交流的,因此本章讲解在 next 主题,如何接入评论系统. 参考网站:Next 使用文档,第 ...

  4. Linux下使用 github+hexo 搭建个人博客04-next主题优化

    上篇我们说了 hexo 的优化,针对的站点的优化. 本篇讲解 next 主题的优化,包括:使用语言.前端页面显示宽度.菜单.侧栏.头像.添加或取消动画效果.打赏功能等等. 让页面排版更符合我们所要的功 ...

  5. Linux下使用 github+hexo 搭建个人博客03-hexo配置优化

    上两张文章,我们说了 hexo 部署.主题的切换.博文的创建.MarkDown 简单使用和 hexo 部署到 GitHub Pages. 也说了我们会使用 next 主题做为我们后期博客的使用和维护. ...

  6. Linux下使用 github+hexo 搭建个人博客02-hexo部署到Github Pages

    之前的这篇文章<Linux下使用 github+hexo 搭建个人博客01-hexo搭建>,相信大家都知道怎么搭建 hexo ,怎么切换主题,并且完成了一篇博文的创建,以及 MarkDow ...

  7. Linux下使用 github+hexo 搭建个人博客01-hexo搭建

    为什么要搭建自己的博客系统? 原因有好几个吧,归类如下:1.自己搭建博客系统很有成就感,可以自己选定页面风格和页面排版: 2.自己搭建博客系统可以根据自己的需要添加各种插件功能,因此整体上比网上的第三 ...

  8. Windows下通过GitHub+Hexo搭建个人博客的步骤

    Windows下通过GitHub+Hexo搭建个人博客的步骤  https://blog.csdn.net/namechenfl/article/details/90442312 https://bl ...

  9. Github+Hexo,搭建专有博客

    前言 记得从大二开始,就一直想搭个专属网站,当时使劲抠页面[前端页面是从QQ空间抠的,现在想抠估计没这么容易了],写代码,忙活半天才把程序弄好. 可惜最终项目还是没上线,因为当时有两问题绕不开 需要购 ...

  10. Github + Hexo 搭建个人博客

    参考博客: 我是如何利用Github Pages搭建起我的博客,细数一路的坑 使用Hexo+Github一步步搭建属于自己的博客(基础) Hexo 准备工作: 本机已安装好 git, npm 和 no ...

随机推荐

  1. OJ2237第k小数题解

    题目描述: 有n个数,请你找出第k小的数. 输入描述: 第一行有2个正整数n,k(n,k<=10^7)第二行有n个非负数ai(ai<=10^5) 输出描述: 输出第k小的数. 输入样例: ...

  2. 使用C#创建Windows服务

    本文属于原创,转载请注明出处,谢谢! 一.开发环境 操作系统:Windows 10 X64 开发环境:VS2015 编程语言:C# .NET版本:.NET Framework 4.0 目标平台:X86 ...

  3. 0001.如何在Windows7(x64)上安装 Sharepoint2010 Fundation

    一.修改Config.xml文件 到目录:"C:\Program Files (x86)\MSECache\SharePoint2010\Files\Setup"下去修改confi ...

  4. Java编程思想总结笔记Chapter 2

    本章介绍Java程序的基本组成部分,体会到Java中几乎一切都是对象. 第二章   一切都是对象 目录: 2.1 用引用操纵对象 2.2 必须由你创建所有对象 2.3 永远不需要销毁对象 2.4 创建 ...

  5. 【3D计算机图形学】变换矩阵、欧拉角、四元数

    [3D计算机图形学]变换矩阵.欧拉角.四元数 旋转矩阵.欧拉角.四元数主要用于:向量的旋转.坐标系之间的转换.角位移计算.方位的平滑插值计算.   一.变换矩阵: 首先要区分旋转矩阵和变换矩阵: 旋转 ...

  6. JMeter 监控和记录&常用功能

    使用https连接时,如果对应站点的CA 证书错误,会直接报连接不到服务器的错误,org.apache.commons.httpclient.NoHttpResponseException,把错误证书 ...

  7. (转)Spring的单例模式底层实现

    单例模式也属于创建型模式,所谓单例,顾名思义,所指的就是单个实例,也就是说要保证一个类仅有一个实例. 单例模式有以下的特点: ① 单例类只能有一个实例 ② 单例类必须自己创建自己的唯一实例 ③ 单例类 ...

  8. IPSP问题

    场景:接触IPSP项目是个学习的过程,在此记录一些自己的认知,让自己更能全面的理解项目! 1 总结 1.1 日志追踪 IPSP工程所在的服务器有GW和Server之分,GW是连接外部服务器和serve ...

  9. swift3.0 coreData的使用-日记本demo

    效果 需求分析 基于官方MasterDetail模板,官方写了很多复杂的coredata逻辑,在此基础上快速开发简单的日记本程序. - 主要功能:增.删.改.查 - 界面用默认的界面,将detail页 ...

  10. Spring-Framework 源码阅读之AnnotationBeanUtils

    Java程序员,就是要学会一个名字叫做"春"的东西,这玩意运用的非常的广泛,现在如果你的业务系统或者软件没有在这个东西上开发,都不要意思拿出来.因为你更不上时代了.在平时的工作的中 ...