利用最新版本的 hexo+next 重构了个人博客,下面简单记录了搭建博客的完整过程:

一、环境准备

二、在GitHub上创建Github Pages项目

  • 创建新仓库

  • 创建一个名称为 yourusername.github.io 的新仓库
  • 这边的yourusername填写自己的用户名
  • Github会识别并自动将该仓库设为 Github Pages
  • 设置github用户和邮箱
$ git config --global user.name "your name"
$ git config --global user.name "your email"
  • 生成SSH密钥
$ ssh-keygen -t rsa -C "Github的注册邮箱地址"
  • 在C:\Users\ASUS.ssh目录会有两个文件id_rsa和id_rsa.pub,打开id_rsa.pub
  • 复制里面的所有内容到 SSH keys这里 的Key,Title随便填,即完成:Add SSH key

三、安装Hexo

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页

  • 进入任意磁盘创建文件夹,命名为hexo,在该文件夹下鼠标右键选择Git Bash Here,执行命令:
$ npm install -g hexo-cli
$ hexo init
$ npm install
  • 新建完成后,指定文件夹的目录如下:
.
├── _config.yml
├── package.json
├── scaffolds
├── source
| ├── _drafts
| └── _posts
└── themes
  • _config.yml 文件中填上博客的基本信息,网站的详细配置点击这里 查看
  • 注意,冒号后面都要有一个空格

四、部署

  • 在_config.yml文件,找到deploy,进行以下配置
deploy:
type: git
repo: https://github.com/username/username.github.io.git
branch: master
  • 安装部署工具
$ npm install hexo-deployer-git --save
  • 新建一篇博客文章

在hexo/source/_posts文件夹下新建md文件(不用加.md后缀)

$ hexo new 文件名
  • 最后输入以下命令生成网站文件并部署:
$ hexo g //生成网页文件
$ hexo s //localhost:4000本地预览效果
$ hexo d //部署

在浏览器输入https://username.github.io/ 就跳到博客网站

五、用Next美化博客

Hexo 安装后,默认主题是 landscape ,目前很火的一款主题 NexT

  • 在hexo文件夹下鼠标右键选择Git Bash Here,然后 git clone 主题:
$ git clone https://github.com/iissnan/hexo-theme-next themes/next
  • 更新主题 NexT
$ cd themes/next
$ git pull
  • 切换成NexT主题,在hexo根文件夹下,修改_config.yml文件中的 theme

theme: next

//切换后,用命令清除下缓存
$ hexo clean //执行hexo s本地产看NexT主题效果
$ hexo s
  • 切换next主题的风格

修改hexo/theme/next/_config.yml

 # Schemes
# scheme: Muse
# scheme: Mist
# scheme: Pisces
# scheme: Gemini
  • 设置Menu

默认只有首页和归档,如果还要添加,编辑hexo/themes/next/_config.yml

menu:
home: / || home //首页
about: /about/ || user //关于
tags: /tags/ || tags //标签
categories: /categories/ || th //分类
archives: /archives/ || archive //归档
schedule: /schedule/ || calendar //日程表
sitemap: /sitemap.xml || sitemap //站点地图
  • 创建分类文件夹
$ hexo new page categories
  • 成功后输出:INFO Created: ~/Documents/blog/source/categories/index.md
  • 根据上面的路径,找到index.md这个文件,打开后并添加type: "categories"
---
> title: 文章分类
> date: 2019-07-15 23:30:33
> type: "categories"
---
  • 然后给文章添加“categories”属性
---
> title: GitHub+Hexo+Next搭建博客
> date: 2019-07-15 23:43:57
> categories: hexo
---
  • 创建标签文件夹
$ hexo new page tags

成功后输出:INFO Created: ~/Documents/blog/source/tags/index.md

  • 根据上面的路径,找到index.md这个文件,打开后并添加 type: "tags" 保存
---
> title: 文章分类
> date: 2019-07-15 23:54:22
> type: "tags"
---
  • 然后给文章添加“tags”属性
---
> title: GitHub+Hexo+Next搭建博客
> date: 2019-07-15 23:43:57
> tags: hexo
---

根据以上步骤就可以搭建出一个属于自己的博客网站了,赶紧行动吧!

参考教程:

GitHub_Hexo_Next 搭建博客的更多相关文章

  1. 基于Hexo和Github搭建博客

    搭建自己的个人博客. 准备工作 确保电脑需要已下载安装node和npm.查看安装是否成功,windows只需在命令行输入以下两条命令即可. 1 2 $ node -v $ npm -v 安装hexo ...

  2. 手把手教从零开始在GitHub上使用Hexo搭建博客教程(四)-使用Travis自动部署Hexo(2)

    前言 前面一篇文章介绍了Travis自动部署Hexo的常规使用教程,也是个人比较推荐的方法. 前文最后也提到了在Windows系统中可能会有一些小问题,为了在Windows系统中也可以实现使用Trav ...

  3. 手把手教从零开始在GitHub上使用Hexo搭建博客教程(三)-使用Travis自动部署Hexo(1)

    前言 前面两篇文章介绍了在github上使用hexo搭建博客的基本环境和hexo相关参数设置等. 基于目前,博客基本上是可以完美运行了. 但是,有一点是不太好,就是源码同步问题,如果在不同的电脑上写文 ...

  4. 手把手教从零开始在GitHub上使用Hexo搭建博客教程(二)-Hexo参数设置

    前言 前文手把手教从零开始在GitHub上使用Hexo搭建博客教程(一)-附GitHub注册及配置介绍了github注册.git相关设置以及hexo基本操作. 本文主要介绍一下hexo的常用参数设置. ...

  5. 手把手教从零开始在GitHub上使用Hexo搭建博客教程(一)-附GitHub注册及配置

    前言 有朋友问了我关于博客系统搭建相关的问题,由于是做开发相关的工作,我给他推荐的是使用github的gh-pages服务搭建个人博客. 推荐理由: 免费:github提供gh-pages服务是免费的 ...

  6. 利用hexo搭建博客

    利用Hexo搭建博客 以前用Octopress搭过博客,折腾了好久才弄出来,当时看到那巨难看的默认主题,繁琐的操作,一点写东西的欲望都没了. 一次逛微博,看见了Hexo.尝试了一下,真的很好用哦. 下 ...

  7. Github + Hexo 搭建博客

    服务加速 brew 加速 http://blog.suconghou.cn/post/homebrew-speedup/ github加速 http://www.selfrebuild.net/201 ...

  8. gitcafe 使用hexo搭建博客

    --缘由:因为看大家都用github等搭建博客,作为半个程序员的自己,也按捺不住了,终于有空来尝试一把了,选择了和github 相同功能的gitcafe网站,因为在国内比较快,这是大家的看法,下面写一 ...

  9. 在github上搭建博客(使用Jekyll)

    简单说,只需要三步,就可以在 Github 搭建起一个博客: 在 Github 上建一个名为 xxx.github.io 的库: 把看中了的 Jekyll 模板 clone 到本地: 把这个模板 pu ...

随机推荐

  1. 星之小说下载器Android版

    原本是想在酷安上架的,然而审核不通过..只能通过网页方式宣传了 一款使用Jsoup开源库网络爬虫的APP,将在线阅读的小说解析,把小说全本下载为txt文件 由于使用爬虫技术,所以下载的速度不是很理想, ...

  2. mpvue 图片上传预览组件封装

    <template> <div class="j-pic-upload"> <div class="j-upload-btn" @ ...

  3. 基于OAuth 2.0的第三方认证 -戈多编程

    引用(http://www.cnblogs.com/artech/p/oauth-01.html) OAuth 2.0的角色 获得资源拥有者授权的第三方应用请求受保护的资源采用的不是授权者的凭证,所有 ...

  4. macOS10.14.2 gem 更新问题

    macOS10.14.2,最近cocoapods不能正常使用了. 终端输入 sudo gem update –system 显示如下错误 ERROR: While executing gem … (G ...

  5. 在集成环境中修改配置文件php.ini不生效的解决办法

    配置完成之后一定要重启服务,如果重启服务还是不生效. 就去看一下phpinfo(),找到Loaded Configuration File选项,这个才是真正读取的配置文件

  6. C语言基于窗体命令行打包,解包和浏览程序

    #include<stdio.h>#include<stdlib.h>#include<string.h>#include<windows.h>#inc ...

  7. 移动端自动化测试Appium 从入门到项目实战Python版☝☝☝

    移动端自动化测试Appium 从入门到项目实战Python版 (一个人学习或许会很枯燥,但是寻找更多志同道合的朋友一起,学习将会变得更加有意义✌✌)  说到APP自动化测试,Appium可是说是非常流 ...

  8. MySQL学习(三)MySQL锁与事务

    本章我们着重讨论MySQL锁机制的特点,常见的锁问题,以及解决MySQL锁问题的一些方法或建议. 一.MySQL锁概述 相对其他数据库而言,MySQL的锁机制比较简单,其最显著的特点是不同的存储引擎支 ...

  9. 「3D建模」ZBrush如何雕刻头部

    加载项目开始 1. 如果未显示灯箱,请按逗号(,)或灯箱按钮. 2. 单击项目选项卡,然后双击DefaultSphere项目.它将被加载到ZBrush中. 3. 在工具>几何子选项板中,将SDi ...

  10. (19)ASP.NET Core EF创建模型(包含属性和排除属性、主键、生成的值)

    1.什么是Fluent API? EF中内嵌的约定将POCO类映射到表.但是,有时您无法或不想遵守这些约定,需要将实体映射到约定指示外的其他对象,所以Fluent API和注解都是一种方法,这两种方法 ...