hexo搭建个人博客

搭建前要说的话:

作为一个程序员都想拥有一个属于自己的网站,这里就有一个可以让你马上拥有的方法,有人可能会说直接在别的网站上注册一个账号不就行了,但是那样不是自己想要的界面,在这里你可以编辑你自己想要的,没有广告,没有其他的只有你想要的。是不是心动了,那么接着往下看。

搭建的总体流程

  • 申请github账号

  • 在github上创建仓库

  • 配备git,同时将SSH提交到github上

  • 安装node.js

  • 安装Hexo

  • 安装Hexo 主题

  • 使用CSDN官网写博客文章

    让我们开始搭建吧!!!

GitHub创建个人仓库

登录到 GitHub ,如果没有 GitHub 帐号,请使用你的邮箱注册 GitHub 帐号:https://github.com/join?source=header-home注册
登录成功之后,点击 GitHub 中的 New repository 创建新仓库,仓库名应该为:用户名 .github.io 。这里用户名使用你的 GitHub 帐号名称代替,这是固定写法。
创建新仓库

Git管理

Git 是目前世界上最先进的分布式版本控制系统(没有之一)。这是使用 Git 的目的是为了将我们的网站从本地提交上服务器(GitHub)上面去。我认为 Git 操作是程序员应该具备的一个基本操作,具体的 Git 操作细节可以查看廖雪峰的教程,讲的十分详细 https://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000git教程
安装好 Git 后,只需要进行下面的配置即可

配置信息

在Gir Bash进行操作,设置 user.name 和 user.email 配置信息,我这里设置为全局。
代码如下:

git config --global user.name "你的GitHub用户名"
git config --global user.email "你的GitHub注册邮箱"
生成密匙

通过注册的邮箱生成ssh密匙文件:
代码如下:

ssh-keygen -t rsa -C "你的GitHub注册邮箱"

然后这一步要生成密匙有一个操作:就是要敲三个回车,默认不需要设置密码。最后得到两个文件
:id_rsa和id_rsa.pub。

拷贝密匙:

拷贝密匙
打开id_rsa.pub文件夹,将里面的内容全都复制下来
内容全部复制

粘贴到GitHub

GitHub  SSh
t添加新的SSh

测试GitHub SSH

添加好SSH key后 ,进行测试

ssh -T git@github.com

你将会看到:
界面
输入:yes
这时候会看到下面的界面:
界面
如果看到Hi 后面是你的用户名,就说明成功了。

安装node.js

Hexo 基于 Node.js,因此需要先安装 Node.js,你可以在这里进行对应电脑版本的下载: lhttps://nodejs.org/en/download/Node,js下载
你也可以通过命令行进行安装:
cURL:

curl https://raw.github.com/creationix/nvm/v0.33.11/install.sh | sh

Wget:

wget -qO- https://raw.github.com/creationix/nvm/v0.33.11/install.sh | sh

安装完成后,重启终端并执行下列命令即可安装 Node.js。

nvm install stable
hexo 安装

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

所有必备的应用程序安装完成后,即可使用 npm 安装 Hexo。

npm install -g hexo-cli
Hexo 使用

安装好 Hexo 后,马上就能使用了。首先初始化博客,输入:

hexo init myBlog

myBlog 是自己命名的 按照自己喜欢的来
结果

接下来,进入文件夹 myBlog,输入

hexo s

结果
然后,打开浏览器输入地址:

localhost:4000

执行到这里事实上博客就已经搭建好了,接下来就是去完善它。

注意:下面的命令都是在 myBlog文件里进行操作的。

添加文章

添加文章

1. 直接导入文章

你可以将你平时写的文章直接导入到 _posts 文件夹里,注意文章类型得是 md格式。

2.写新文章
hexo new [layout] <title>

你可以在命令中指定文章的布局(layout),默认为 post,可以通过修改 _config.yml 中的 default_layout 参数来指定默认布局。写新文章

3.生成网页

使用 Hexo 生成静态文件快速而且简单。

hexo generate

你也可以简写成

hexo g

生成文章

启动服务预览文章

输入以下命令以启动服务器,你的网站会在 http://localhost:4000 下启动。在服务器启动期间,Hexo 会监视文件变动并自动更新,无须重启服务器。

1$ hexo server

如果你想要更改端口,或是在执行时遇到了 EADDRINUSE 错误,可以在执行时使用 -p 选项指定其他端口,如下:

1$ hexo server -p 5000

查看文章
网站

总结
1  hexo new "我的博客文章" #新建文章
1  hexo generate #生成网页
1  hexo server #启动服务预览

这三个命令依次就是新建一篇博客文章、生成网页、在本地预览的操作。

部署

Hexo 提供了快速方便的一键部署功能,只需一条命令就能将网站部署到服务器上。

1  $ hexo deploy

你也可以简写成

1  $ hexo d

在开始之前,必须先在 _config.yml 中修改参数,一个正确的部署配置中至少要有 type 参数,例如:

1  deploy:
2  type: git

config
在_config.yml中进行修改。
在这里插入图片描述
这一步的目的是将 Hexo 与 GitHub 进行关联。

配置好后通过

1  $ hexo d

命令,稍等片刻,网站就已经部署好了,可以在浏览器输入你的GitHub名称.github.io,这样一个免费的博客就已经搭建好了。

总结:

本地预览

hexo clean
hexo g
hexo s

博客部署

hexo clean
hexo g
hexo d

Hexo 主题

hexo 默认的主题可能显得有点呆板,你可以在 https://hexo.io/themes/index.html进行主题的挑选更换。将下好的主题安放在themes文件夹内,同时在_config.yml中进行主题修改就好了。
在这里插入图片描述
经过一个小时的主题筛选,我选择了hexo-theme-matery 这款主题。通过https://blinkfox.github.io/2018/09/28/qian-duan/hexo-bo-ke-zhu-ti-zhi-hexo-theme-matery-de-jie-shao/文档说明,经过简单的配置,效果就出来了!
在这里插入图片描述
一般大佬们提供的主题都会提供文档说明,按照说明进行简单的设置就能拥有一个酷炫的页面了。
在这里插入图片描述
在这里跟大家推荐一个方法:
上面的配置主题可能会出现很多错误 很麻烦
在这里安利一个简单的
大家在myBlog目录下右击鼠标,然后进入git bash
接下来输入:

git clone https://github.com/litten/hexo-theme-yilia.git  themes/yilia

然后修改myBlog 文件下的_config.yml 修改themes:yilia
就成功搭建好了个人博客

如果还有什么问题的话可以点击下面的视频链接在线观看 效果更佳
https://www.bilibili.com/video/av44544186?from=search&seid=3398998779845671153

主题配置好之后可以进行相应的更改
在myBlog 文件下的_config.yml 下
修改对应的信息 例如作者名字,更多修改以后会更新

上传博客

1.选择一个markdown编辑器,我觉得csdn自带的md编辑器就挺好用的,所以你可以注册一个csdn帐号,微信扫一扫就ok;
2.注册成功后登录进去,由于默认的是HTML编辑器,所以我们需要先修改下默认设置,首先找到右上角头像的位置,选择账号设置,然后如图选择我的博客
在这里插入图片描述
然后如图选择博客设置在这里插入图片描述
3.点击写博客,先了解下markdown编辑器基本的用法,然后就可以写博客了,写好之后导出到本地
在这里插入图片描述
如图,点击后选择MarkDown,会下载一个 .md 文件;然后找到这个md文件,把它复制到你hexo博客文件夹 中 source 下的 _posts 中,默认只有一个 hello-world.md
4. 复制完之后然后使用文本编辑器打开它,在第一行加上title,内容自定,如

title: this is my first blog

5.接着在你博客站点文件夹下右键空白处,选择Git Bash Here,输入 hexo g (完整命令为hexo generate),用于生成静态文件
6 然后 输入 hexo s(完整命令为hexo server),用于启动服务器,主要用来本地预览;完成后 打开浏览器输入 localhost:4000,会发现多了你刚写的那篇博客
7 最后输入hexo d(hexo deploy),用于将本地文件发布到github等git仓库上;

8 好了,大功告成!

作者:方小同丶
来源:CSDN
原文:https://blog.csdn.net/weixin_42357048/article/details/80540728
版权声明:本文为博主原创文章,转载请附上博文链接!

hexo博客搭建参考来自:https://mp.weixin.qq.com/s/-wo4LkFPTNVzNIZ62M6E2g

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值