使用Hexo搭建个人博客+主题更换

前言

关于个人博客的搭建过程,个人在这里面踩了很多的坑,初次搭建的不算成功,还好有团队的教学与学长的经验相助,在努力下搭建了我的个人博客。在此总结我在搭建的一些过程。

正文

本次过程只适用于windows的用户。用于个人学习记录。

搭建流程

一、Nodejs的安装

二、Git安装

三、GitHub创建个人仓库

四、配置SSH key

五、Hexo安装

六、发布网站

七、更改主题

一、Nodejs的安装

Hexo基于Node.js的,搭建博客网站首先需要安装Node.js环境。
Image text

下载地址:http:\nodejs.cn\download
测试安装:命令行使用node -v 、npm -v,查看显示版本号即成功。
打开cmd命令行,成功界面如下
Image text

二、Git安装

网站在本地搭建好了,需要使用Git同步到GitHub上。

首先访问https:\git-scm.com\ 下载完毕后进入安装界面进行安装。
Image

Image

正常安装后使用git –version的命令来测试git是否安装成功。

Image

到这里git就已经安装成功了!

三、GitHub创建个人仓库

1.首先登录https:\github.com 进行账户注册和新建项目。此处由于之前创建过所以无法创建。在这里需要注意目必须要遵守格式:你的账户名.github.io。并且需要勾选Initialize this repository with a README。

Image

在建好的项目右侧有个settings按钮,点击它,向下拉到GitHub Pages,你会看到那边有个网址,访问它,你会现该项目已经被部署到网络上,能够通过外网来访问它。如下图所示:

Image

四、配置SSH key

为了要拥有你的github权限,但是直接使用用户名和密码太不安全了,所以我们使用ssh key来解决本地和服务器的连接问题。
Image使用$ cd ~. ssh #检查本机已存在的ssh密钥。
Image

如果提示:No such file or directory 说明你是第一次使用git。然后连续3次回车,最终会生成一个文件在用户目录下,打开用户目录,找到.ssh\id_rsa.pub文件,记事本打开并复制里面的内容,打开你的github主页,进入个人设置 -> SSH and GPG keys -> New SSH key:Image

之后进行测试是否成功!Image
如果提示Are you sure you want to continue connecting (yes\no)?,输入yes,然后会看到:Image
看到这个信息说明SSH已配置成功!

五、Hexo安装

1.首先在自己认为合适的地方创个文件夹,个人是在D盘建了一个hexo然后再建立了blog文件夹。也可以直接建立一个blog文件然后使用DOS命令进入到该文件夹里面。然后输入输入npm install hexo -g,开始安装Hexo.
![Image] (hello-world\hexo01.png)
完成后,继续输入命令 cnpm install -g hexo-cli
![Image] (hello-world\hexo02.png)

等待完成,再输入命令 cnpm install hexo –save
Image

至此Hexo安装完成,使用查看版本命令 hexo -v 检查是否正常安装。Image

六、发布网站

1、本地启动
创建一个新文件夹(我的是在E盘创建的Blog),进入该文件夹,右键Git Bash Here,输入 hexo init 命令。
接下来输入 hexo s -g 命令启动,启动后浏览器访问localhost:4000查看博客效果。

2、部署到Github
本地成功后下面就要部署到Git了,打开_config.yml进行配置,如下图,复制你的仓库地址给repo参数
Image
在Git命令窗口输入 npm install hexo-deployer-git –save 安装hexo-deployer-git自动部署发布工具,等待安装完成,输入 (hexo clean) (hexo g) (hexo d) 命令发布到Github,这里注意第一次发布的话会需要输入你的Github账号跟密码,等待出现下图的信息就说明发布成功了,在浏览器输入yourname.github.io就可以看到你的博客了。Image

七、更改主题

部署完毕后,可以根据自己的喜好更改自己的主题在hexo的官网中有主题选项然后进行配置更改找到自己喜欢的网站主题。完成配置就好了。

对于上传图片的问题解决

前一段搭建好的个人博客 图片怎么传也传不上去,把图片放在github的库中也没有操作好 ,甚至找了一个破解版的MarkdownPad 2 插入图片也没有成功,对此 差点自闭。 后来在学长的指导下得出了如何简单的上传图片。放下如下

1、cd到博客根目录下 查看_config.yml文件
查找 post_asset_folder
字段确定post_asset_folder
设置为true -> post_asset_folder:true

2、当你设置 post_asset_folder 参数后,在建立文件时,Hexo 会自动建立一个与文章同名的文件夹,你可以把与该文章相关的所有资源都放到此文件夹内,这样就可以更方便的使用资源。

3、到博客的根目录下执行 npm install https://github.com/CodeFalling/hexo-asset-image –save 命令来进行插件的安装。

4、然后创建一文章 hexo new “test” 然后查看博客的 ../source/_posts 目录下的文件,会看到存在一个test 文件夹 和 test.md 文件

5、将需要显示在test.md文件中的图片放到上面命令生成的test文件夹中
在test.md文件中使用命令显示文件,其中中括号的内容会是你在md文件中图片的名字,小括号中的地址的格式为 文件夹名/图片名,例如 test/test.png

在此终于解决了图片上传的问题,由衷感谢学长的帮助。
个人博客,希望能够帮助到一些人,小白第一次发博,还请大佬轻喷。


 上一篇
LSB隐写 LSB隐写
前言平台上自己尝试着解了一些有关于图片隐写的问题,对于LSB隐写题目的一些学习与理解,以及个人的解题思路。 LSB简介LSB,称为:最低有效位,它的英文是Least Significant Bit 。我们知道图像像素一般是由RGB三原色(即
2019-04-05 Greypotato
本篇 
使用Hexo搭建个人博客+主题更换 使用Hexo搭建个人博客+主题更换
前言关于个人博客的搭建过程,个人在这里面踩了很多的坑,初次搭建的不算成功,还好有团队的教学与学长的经验相助,在努力下搭建了我的个人博客。在此总结我在搭建的一些过程。 正文本次过程只适用于windows的用户。用于个人学习记录。 搭建流程
2019-03-16 Greypotato
  目录