栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 系统运维 > 运维 > Linux

github+git+hexo-matery博客搭建(详细教程)

Linux 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

github+git+hexo-matery博客搭建(详细教程)


我的个性化博客: http://xiaolan1.icu


一、创建github账号

有github账号和使用经历的可直接跳过

首先进入github官网 https://github.com/

注意:github可能需要梯子进入,要不然可能进不去

Sign up 创建账号,跟着步骤注册即可,注册完登陆,登陆后,进入第二个,你的仓库,

NEW 一个新的存储库

注意:名称填写: 你的用户名.github.io

填写完在最下面点创建即可

接下来你就可以输入 你的用户名.github.io来访问你的页面啦,虽然这网址有点怪,我们后续可以给他匹配域名

二、安装git并绑定github账号 1、安装git

进入git官网https://git-scm.com/下载git,默认安装

安装完成后,在桌面右击出现红色框内表示安装成功

2、绑定github账号

绑定git与github账号,方便以后往github账号中上传文件更简单

1.添加ssh key

进入settings,点击再点击 打开前面下载的git,在里面输入

ssh-keygen -t rsa -C "xxxx@xxx.com" 

双引号中为你的github账号邮箱,执行完成后,打开生成的ssh key文件 id_rsa.pub,仿照我的文件目录

复制id_rsa.pub文件中的内容,为你的秘钥,把内容粘贴到前面打开的New SSH key中的 key中,Title随便填

2.验证ssh key是否添加成功

输入

在下面提示的消息中输入前面设置的密码,输入的时候你看不到,出现下面这种消息表示添加成功

3.设置username和email

在git 中输入

git config --global user.name "你的用户名"
git config --global user.email "你的用户名邮箱"

就好了,这里提交文件用下面hexo的命令,如需git命令提交文件,则请看git标签中,git提交文章

三、使用hexo来进行博客搭建 1、安装node

进入node官网下载https://nodejs.org/en/ ,然后默认安装

安装完成后,打开cmd检验是否安装成功,win+R 输入图片内容

则安装成功

2、安装hexo并初始化hexo

在D盘中新建一个文件夹为Blog,打开Blog,右键打开Git Bash Here ,输入

npm install -g hexo cli

安装完成后,输入以下命令初始化博客

hexo init

输入下列命令进行静态部署:

hexo g

部署完成后,输入以下命令可以查看到:

按住Ctrl 点击localhost:4000可以打开这个网站,此时出现以下这个界面,表示hexo初始化成功

想要关闭命令按: ctrl + c 为停止运行

3、将hexo部署到GitHub

此时你生成的文件只能在你的电脑中运行,其他用户看不到,需要把Blog中的文件上传的github上。

在Blog中找到_config.yml右击 在打开方式中用 记事本打开,拉到文件底部,填写以下内容:

deploy:
  type: git
  repository: https://github.com/1417847538/1417847538.github.io.git  #你的仓库地址
  branch: master

注意空格!冒号后面有一个空格 你的仓库地址为code下面的第一行网址,复制下来,粘上去即可


回到Blog文件中,右击打开Git Bash 输入命令:

npm install hexo-deployer-git --save

等待安装完成后,分别输入:

hexo clean   #清除缓存文件 db.json 和已生成的静态文件 public
hexo g       #生成网站静态文件到默认设置的 public 文件夹(hexo generate 的缩写)
hexo d       #自动生成网站静态文件,并部署到设定的仓库(hexo deploy 的缩写)

完成后,输入你的 你的用户名.github.io 就可以打开你的网页看到以下这个界面了

四、配置hexo主题(matery)

hexo中有很多的主题样式,我们在github中搜索hexo主题,或者进入hexo主题官网 https://hexo.io/themes/ 都能选择一款自己喜欢的主题作为自己的博客框架

这里我选择的matery主题 首先进入https://github.com/blinkfox/hexo-theme-matery/tree/master 下载这个主题,下载完成后解压到文件夹

在自己Blog文件夹中建一个名为theme的文件夹把刚刚解压的hexo-theme-matery文件复制到theme文件夹中,打开Blog下的_config.yml文件夹,更改#Site下的内容,例如

注意:冒号后有一个空格!

然后换上你的主题,找到如下内容

在theme中换上你前面解压的主题名,我这里为hexo-theme-matery,填写完成后保存,打开Git Bash ,输入

hexo clean  #清除缓存文件 db.json 和已生成的静态文件 public
hexo g      #生成网站静态文件到默认设置的 public 文件夹(hexo generate 的缩写)
hexo d      #自动生成网站静态文件,并部署到设定的仓库(hexo deploy 的缩写)

就将自己当前更换的主题文件上传到自己的github中了。

一个调试技巧:在更改Blog内容时,可以在Git Bash 中输入 hexo s 打开http:后的网址,进行实时页面更改后的查看
以后每次更改完Blog文件中的内容以及确认后,都可以输入hexo clean && hexo g -d 进行文件上传。

五、个性化matery主题,以及我在配置中出现的问题—进阶 1、个性化matery主题

具体可以参考hexo-theme-matery文件夹下的这两个文件,上面为英文版,下面为中文版[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传里面的内容在这里遍不过多介绍,照着做就好

2、我在配置中出现的问题 1.主题下的_config.yml

首先要浏览主题下的(也就是hexo-theme-matery)的_config.yml文件,里面都有相应的中文内容介绍,一开始最好浏览一遍,进行你想要的更改

2.二级菜单的使用

如果你想要使用二级菜单,你可以在想用的一级标签下按如下方式输入children里的内容注意children以及里面内容放的位置

3.music的使用

这里配置完music里的内容后,有一点要注意[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

id必须为自己创建的歌单的id,不能是例如 网易云中我喜欢的音乐的id,这个id好像通常为10位,而我喜欢的音乐id为9位,就这个原因,我折腾近3个小时,希望大家避雷

4.valine留言模块

这是个所有人都可以留言的评论模块,具体可参考 https://valine.js.org/quickstart.html

关于leanCloud的使用

目前我掌握的是管理所有人的留言,在对应的以下选择中可以看见评论内容,然后可以进行选择性删除。

5.gitalk留言模块

gitalk和gitment,我在网上查阅,大家建议使用gitalk评论模块,使用建议参考

https://segmentfault.com/a/1190000018072952

注意:找到gitalk.ejs文件,其中id必须填写,这就要你先前往github中使用issue,避雷!

这里必须给issue设置标签,第一个默认必须为Gitalk,第二个为你设置的id名,跟gitalk.ejs文件中id名匹配,才能在页面中显示gitalk留言模块,这里大概折腾2小时。

疑问望大佬给予回答:关于github登陆443问题

这个评论目前只能进入github找到我的github.io仓库下具体issue内容中进行评论,而不能在页面中直接进行评论。

6.新建文章以及推荐文章设置

我们所写的文章都在_posts文件夹下

如果想要新建文章,可以在这个文件夹下新建 xxx.md文件,xxx为英文名,内容随便写,建议语义化文章标题,以后方便修改。

里面的内容配置具体参考 主题文档中的
按示例可进行配置

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/277405.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号