01 Hexo+私有服务器搭建博客

一、概述

网上有很多教程,指导大家用Hexo结合Github来搭建一个自己的独立博客,这种方法挺好的,主要是省钱,你可以不花一分钱就可以折腾出来一个自己的博客,而且过程又不是十分繁琐。但是,这样折腾出来的博客有一个问题,毕竟github在国外,访问速度是很慢的,如果我们Hexo博客中选了一个首页图片比较多的主题时,用户访问你的博客首页,加载时间会很长,这样给用户的体验极差,另一个原因就是,github毕竟是别人的,你只是拥有一个账号而已,万一哪天人家把你账号封了,那就玩完了。所以,出于以上原因考虑,我决定自己租一台服务器,然后结合Hexo来搭建一个独立博客。

二、前期准备

  • 一台服务器
  • 一个域名

三、操作步骤

1、本地新建Hexo博客

1.1、打开网址“http://nodejs.cn/”下载nodeJS安装包,在本地计算机安装node环境。

1.2、打开网址“https://git-scm.com/downloads”下载Git安装包,在本地计算机安装Git环境。

1.2.1 以上两个步骤可参考此文章“https://blog.csdn.net/qq_35117024/article/details/81390430”中的安装部分。

1.3、在本地计算机新建一个文件夹,然后进入到此文件夹,鼠标右击打开命令行窗口,输入命令

npm install hexo-cli -g

来全局安装hexo-cli脚手架工具,如下图所示:

扫描二维码关注公众号,回复: 8666362 查看本文章

1.4、安装完脚手架工具之后,依次通过以下三个命令来实例化hexo本地博客、进入博客目录、安装博客运行的相关依赖插件,如下所示:

hexo init xbeichenblog
cd xbeichenblog
npm install

1.5、初始化完成,安装相关依赖之后,我们通过以下命令来生成hexo博客文件,并启动,如下:

hexo g
hexo s

1.6、启动成功以后,我们在浏览器中通过地址“http://localhost:4000/”来访问,如下:

至此呢,一个最基础的Hexo博客在我们本地已经新建成功啦,接下来我们进行主题修改和部署到我们自己的服务器。

2、主题修改

2.1、通过“Ctrl+C”来停止博客系统的运行,然后通过命令“cd themes”进入到博客文件夹下的主题文件夹,如图:

2.2、然后通过命令

git clone https://github.com/iissnan/hexo-theme-next

来从github下载最流行的Next主题到我们本地的主题文件夹中,如下:

2.3、下载完之后,我们回到博客的根目录,然后打开“_config.yml”文件,将里面的【theme】属性值替换为“hexo-theme-next”,如图:

2.4、然后通过以下命令来清除缓存、重新生成博客文件、启动博客,如下:

hexo clean
hexo g
hexo s

2.5、至此、我们的博客主题替换完成。效果如下,我们接下来先配置一下博客的大概信息,然后再将它放到服务器。

2.6、Next主题详细的配置可以看官网,如下:

2.6.1 修改博客显示模式为双栏显示。我们新建的博客显示模式是单栏显示,在此处我们修改“hexo-theme-next”文件夹下的“_config.yml”文件中的【scheme】属性值来实现,如下,其实就是将所需要的模式前面的注释去掉即可,如图:

刷新页面,即可看到x显示模式发生了变化,如下:

2.6.2 其他的配置信息都是通过修改此文件中的配置信息完成,就不一一介绍了,大家按各自喜欢的方式去配置吧。

3、将本地博客部署到服务器

3.1、使用XShell连接服务器,然后使用以下命令升级系统所有的包,包括系统版本内核升级,如下:

yum -y update

3.2、使用以下命令安装Git和Nginx,如下:

yum install -y git nginx

3.3、使用以下命令创建博客目录,并修改文件权限:

mkdir /data
cd /data
mkdir www
cd www
mkdir hexo
chmod -R 755 /data/www/hexo

3.4、使用以下命令在hexo目录下新建index.html页面,用于检测nginx是否配置成功,并添加如下内容:

vim /data/www/hexo/index.html
<!DOCTYPE html>
<html>
  <head>
    <title></title>
    <meta charset="UTF-8">
  </head>
  <body>
    <p>Nginx running</p>
  </body>
</html>

3.5、使用以下命令配置nginx服务器,更改server_name和root的值,如下:

vim /etc/nginx/nginx.conf

3.6、浏览器访问ip或者域名,看到如下界面表示nginx配置成功:

配置完之后访问浏览器如果显示无法访问,我们通过以下命令重启下nginx即可:

systemctl restart nginx

3.7、创建git的存放仓库目录,并修改权限,如下:

mkdir /data/GitLibrary
chmod -R 755 /data/GitLibrary

3.8、进入到git仓库目录,然后初始化裸库,如下:

cd /data/GitLibrary
git init --bare hexo.git

3.9、创建git钩子,用于在每次git的post操作后执行,如下:

vim /data/GitLibrary/hexo.git/hooks/post-receive

并添加如下内容:

#!/bin/bash
git --work-tree=/data/www/hexo --git-dir=/data/GitLibrary/hexo.git checkout -f

3.10、给该文件添加可执行权限,如下:

chmod +x /data/GitLibrary/hexo.git/hooks/post-receive

3.11、在本地hexo博客的根目录下,打开“_config.yml”文件,然后在文件开始部分修改【url】属性值为个人域名。在文件最底部配置deploy信息,如下:

3.12、然后我们在本地通过命令“hexo d”就可以推送我们本地新建的博客到我们自己的服务器了。

3.13、通过域名或IP访问我们的博客。

四、总结

本文主要介绍下如何使用自己的服务器来结合Hexo搭建自己的博客,自己搭建过程中也是踩了很多坑,所以分享出来和大家共同学习。文章中关于博客的主题配置部分写的比较简单,这部分大家参考Next主题官网的配置去配置自己喜欢的样式即可,或者下载安装自己喜欢的主题,然后自己来配置。

发布了113 篇原创文章 · 获赞 110 · 访问量 24万+

猜你喜欢

转载自blog.csdn.net/qq_35117024/article/details/104021260
今日推荐