github+hexo来搭建个人博客——保姆级教程

简介: github+hexo来搭建个人博客——保姆级教程

1. 在github创建仓库

  • 仓库名字一定是:用户名.github.io的模式,如我的用户名是hxd250,故该仓库名为 “hxd250.github.io” 。
  • b72e0f97bc0f050a9446358879f8cae0.png
  • 将 “Add a README file” 勾上,然后点击 “Create repository”

b937b8990f30ed297e9f330199450658.png

  • 创建成功后进入仓库主页,点击“setting”进入设置


b937b8990f30ed297e9f330199450658.png

  • 在最后面哪里点击Change theme选择主题

1aefc68c0588c592ee7407db409d609c.png


  • 任意选择一个主题,到此你的仓库就创建成功了!

  • b589ba725184c05983fba6343dec541d.png

2. 下载安装Git和node.js

  • git : 在官网下载很慢,可以使用阿里巴巴的镜像源下载,地址:

https://npm.taobao.org/mirrors/git-for-windows/, 选择最新的就好了。


git安装成功会在你的鼠标右键的列表中多出Git GUI here 和 Git Bash here


node.js : https://nodejs.org/zh-cn/download/, 根据你的系统选择就好了


在终端运行 node -v 和 npm -v ,安装node.js成功会显示:

31fda7ad9b2eeedd325536fbe23cdfa2.png

3. 安装hexo

  • 在你觉得适合的位置创建一个blog文件夹,进入该文件夹,右键点击Git Bash here,会进入如下界面:

4097a4639de32096c2c97ae8a8f60379.png

更新npm


换成阿里源:npm config set registry https://registry.npm.taobao.org


验证命令: npm config get registry //返回https://registry.npm.taobao.org, 说明镜像配置成功。

23b08a9d11f8e683b80c2245380a40dd.png

  • 使用 “npm m -g hexo" 命令来安装hexo主题

db27405ca6e945a19c00ad62bf4c5664.png


  • 使用 "hexo -v"来查看hexo是否安装成功,成功就会返回hexo的相关信息


ee808f4871a3ad463207fdedd0385924.png

  • 输入 “hexo init” 初始化文件夹,需要等好一会,最后会出现 “Start blogging with Hexo!" 字样。4c65d7826b3f9cbdfdbab5fa47ab59e0.png

  • 输入 npm install,安装所需组件


77c207e373ae74747ce6aa29a472adb2.png

  • 输入 “hexo g”

3f1019d29e60067333fbd7937e9149e0.png


  • 输入“hexo s” , 启动本地服务器,通过“http://localhost:4000”来访问


39eb8faded6e62c4d27fb89520e1b1d7.png

  • 成功界面如下:

image.png


  • 更换主题:

首先你要先找到你需要的主题,可以去百度或者github搜索hexo主题,找到你喜欢的主题,得到其github地址。如我找到的:https://github.com/Fechin/hexo-theme-diaspora.git


2a491c038852a4727afc1fe805975f57.png

在git终端输入:git clone + 你找到的主题的git地址 + themes/主题名, 来下载该主题。你下载的主题都会保存在themes文件夹内。如:git clone https://github.com/Fechin/hexo-theme-diaspora.git themes/diaspora


8becdf09654dda547deea3410e698a8d.png

  • 上一步操作我们把主题下载好了,然后就得修改配置文件。
  • 4c969c2d7e4c865498c855d707ac635f.png

  • 在你创建的blog文件下有_config.yml文件,打开该文件,将里面的"theme: "后面接的主题修改为你下载的主题名。如:theme: diaspora

4. 部署到GitHub上

  • 使用Hexo deploy 部署到github
  • 编辑根目录(我们创建的blog目录)下_config.yml文件,翻到最后修改为代码(hxd250换成自己的用户名),并进行保存。注意:冒号和后面的内容有一个空格!


45bba3c74d2c649fb52357a9f5034d02.png

在git终端输入:npm install hexo-deployer-git --save 来安装Git部署插件

检查SSH Keys设置


在git终端输入cd ~/.ssh , 如果出现“bash: cd: /c…” 的错误,说明不存在.ssh


解决办法:


输入:ssh-keygen -t rsa -C “xxxxxxx”(自己邮箱),提示你输入时不用管,回车就完了

在输入 cd ~/.ssh 没有报错,说明成功了

输入eval “$(ssh-agent -s)” , 添加密匙到ssh-agent(以下两个操作可有可无)


e7072e0e0c756fb0177319fb9ecef2c3.png

  • 输入 ssh-add ~/.ssh/id_rsa , 添加生成的SSH key到ssh-agent


d838fea4a17667f465bbc92b000302ea.png

  • 添加SSH Key到GitHub
  • 进入你的主页设置(右上角):



8bf21b9b5110502fdb23ea56529d0943.png

  • 点击“SSH and GPG keys”,然后点击“New SSH key”新建SSH keys

a04ea9632182abddda54780276ef6a1f.png


  • 在终端输入cat id_rsa.pub , 复制显示出的所有文本



6b7230d6282d52cca4b73fb5a634909c.png


3ec6aece4675db1bb41313549c290ed4.png

输入ssh -T git@github.com,测试添加ssh是否成功。如果看到Hi后面是你的用户名,就说明成功了(有一个会让你输入 yes)


2841851d6a6dfe5d580b0234fc5b7610.png


设置账号信息,需要你的你的用户名和注册时使用的邮箱


d3998e8a18c92e7c1f3af67e11d1814a.png


部署到GitHub上,输入hexo d -g , 使用网址:https://你的用户名.github.io 访问博客。


32d43c9d9be1bd7347175e7691389555.png


好了,安装完毕了,如果想使用阿里云的ECS实例+hexo来搭建博客,请参考大神的博客:


https://zhuanlan.zhihu.com/p/126243913

https://blog.csdn.net/qq_44747221/article/details/105045390


目录
相关文章
|
10月前
|
JavaScript 网络安全 开发工具
[保姆级-从0到1]利用hexo+github托管实现搭建个人博客
[保姆级-从0到1]利用hexo+github托管实现搭建个人博客
|
自然语言处理 JavaScript Shell
【保姆级】利用Github搭建自己的个人博客,看完就会
作为一名喜欢技术的爱好者,平时喜欢把自己学习技术的心得或者一些踩坑、易错的过程记录下来,首选的是技术平台(博客),今天辰哥来教大家如何利用Github来搭建一个自己的个人博客平台。
723 0
|
JavaScript 搜索推荐 程序员
Vuepress + gitee五分钟免费搭建个人博客(保姆级教程)
前言 作为一个程序员,没有折腾过个人博客是不算完整的。技术文章的输出是我们程序员能力的一种体现,也是一种非常好的个人总结。 市面上有很多搭建个人博客的工具或框架,包括hexo、wordpress等等。不可否认,市面上有些博客系统做得很好,博客主题也很丰富,但是往往存在一个问题:比较重。 作为一个Vue程序员,我就比较推荐使用vuepress搭建个人博客,因为它毕竟是Vue出品的,大家熟知的vue官方就是利用vuepress搭建的。 本篇文章就从零开始教大家搭建一个免费的博客,零基础小白也可以学习哦!
2986 0
Vuepress + gitee五分钟免费搭建个人博客(保姆级教程)
|
JavaScript 开发工具 git
Hexo+Gitee静态博客保姆级搭建教程
Hexo+Gitee静态博客保姆级搭建教程
169 0
Hexo+Gitee静态博客保姆级搭建教程
|
搜索推荐 Shell 开发工具
github + hexo 小白超快搭建功能强大的个人博客网站(2)
github + hexo 小白超快搭建功能强大的个人博客网站(2)
175 0
github + hexo 小白超快搭建功能强大的个人博客网站(2)
|
索引
github + hexo 小白超快搭建功能强大的个人博客网站(3)
github + hexo 小白超快搭建功能强大的个人博客网站(3)
162 0
github + hexo 小白超快搭建功能强大的个人博客网站(3)
|
缓存 JavaScript Shell
|
网络安全
手把手教你搭建GitHub个人博客网站(中)
手把手教你搭建GitHub个人博客网站(中)
176 0
手把手教你搭建GitHub个人博客网站(中)
|
JavaScript 安全 网络安全
手把手教你搭建GitHub个人博客网站(上)
手把手教你搭建GitHub个人博客网站(上)
275 0
手把手教你搭建GitHub个人博客网站(上)
手把手教你搭建GitHub个人博客网站(下)
手把手教你搭建GitHub个人博客网站(下)
134 0
手把手教你搭建GitHub个人博客网站(下)