18-10-15 建博指南

Hexo

Posted by Wangchenchen on 2018-10-15
目的:

​ 本地通过WordPress编写blog然后git进行版本的管理,在浏览器上只需要输入自己购买的域名就可以成功访问。

准备工作:

​ 1.本地下载安装git :git官网下载地址

​ 2.本地下载安装node:node官网下载地址

​ 3.本地下载安装Hexo:

​ 安装好上面的两项后直接打开cmd输入:npm install hexo-cli -g

安装HexoCMD

​ 4.创建github账号 格式 - 你为仓库取的名字.github.io(例如:blog.github.io因为普通的github会混淆)

创建仓库-1

创建仓库-2

主要过程:

​ 确定存放blog的路径,我的是e:/Blog;

​ Git Bash Here 打开:右键你的文件单击Git Bash Here;

​ 在保证Git是在你的blog下操作的前提,开始初始化Hexo的文件夹:hexo init 你的仓库名字.github.io

初始化

​ 稍等一会之后目录下就会有个文件夹,文件夹的名字就是你初始化的名字也就是仓库的名字

初始化后

​ 里面的文件及每个文件的作用如下:

本地文件含义

​ 走到这里就表示本地的简单搭建已经好了,默认的主题是landscape的主题

​ 生成静态页面

​ 进入到blog.github.io里面输入创建 hexo输入如下:

hexo创建

​ 启动本地服务器,开启端口默认是4000.

hexo开启服务器

​ 浏览器输入http://localhost:4000/

​ 下面会出先两种情况,一种顺利通过(跳过下面内容),另一种显示加载失败(端口被占/检查名字是否和仓库中一样)如果端口被占先Ctrl+C停止程序更改端口这里我改成5000。

该端口

本地4000预览命令

​ 这时候你就可以进行预览了。

本地4000预览博客

提交到GitHub

​ 更改全局配置可以让hex直接和远端仓库连接打开_config.yml(注意格式,顺序,空格)

全局github库配置

​ 上面的repository填写的就是仓库的地址,下图位置复制进来就可;

拿到地址

​ 首次部署附加内容:

首次部署内容

​ 添加完成后github的库就会增加一定的内容。看上图

​ 下次更新时只需要先删除hexo在创建一个然后将配置上传就好

重新上传

​ 常用命令解释:

常用命令

​ 直接访问github博客 Settings->Github Pages ->Source-> master branch

ssettings访问-2

settings访问-1

​ 打开后因为css和js路径不对所以更换自定义的域名最好;

失败Hexo

​ 买域名->解析->添加俩A类记录 WWW 和 @ 服务器IP就填github的IP固定的151.101.72.133

​ 在仓库中新建CNAME,文中写上你的域名,果断时间就可以直接访问了。

​ 由于每次提交都会覆盖前一次,所以最好的是在本地留个位置,进入source看到_posts添加CNAME文件,加上自己的域名;

本地添加Blog地址

添加域名

结束

​ 到这里你在浏览器上输入自己的域名就能直接访问自己的bolg了,最后恭喜你成功入坑,如果有什么不好的欢迎指教。如果对你有帮助希望有机会可以互相学习。