使用hexo搭建个人博客

442 阅读1分钟

一.安装准备(Mac本地)

  • Git
  • node.js
  • hexo

安装Git

这个可以自行google,Mac安装Git很简单

安装node.js

之前在服务器(centos7)上安装折腾了很久,结果发现有一种更简便的方法推荐

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

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

$ nvm install stable

安装成功之后可以输入node -v查看是否安装成功。

安装hexo和插件:

npm install hexo-cli hexo-server hexo-deployer-git -g

使用Hexo搭建博客(本地)

1.在安装完Hexo之后在终端使用命令:

$ hexo init <folder>
$ cd <folder>
$ npm install

<folder>是文件夹名字,不输入的话是当前文件夹(必须为空)。运行成功的话,到这一步我们的博客在本地已经搭建成功了。

  • _config.yml : 是整个hexo的配置文件,可以使用文本打开。需要注意的是修改的时候每个参数后面的:都会跟一个空格,少了空格无法运行成功的。
  • source/_posts :网站的目录.md文件都在里面

2.接着你可以使用主题Next来美化一下你的网站。

二.部署服务器

购买服务器+域名

可以选择阿里云和腾讯云购买如:www.maaiting.com , 购买之后迅速将网站实名制。购买最便宜的配置就可以了,云服务器大概300多一年。

这里吐槽一下腾讯云在我购买完服务器之后叫我安装显卡驱动????

购买完成之后,讲域名迅速实名制,在微信小程序腾讯云助手上备案(这个会快很多)。在通过腾讯的审核(一天内,会给你打电话确认的)之后,域名就可以正常显示了。

找到域名解析的地方,对域名进行解析。都是傻瓜式操作,放心大胆的点。

使用Nginx部署

我的服务器是CentOS 7.2操作系统,使用Nginx部署。

1.登陆服务器使用root权限 2.安装Git Nginx

yum -y update

yum install -y git nginx

3.配置Nginx,创建目录并设置权限,存放博客文件。

cd /usr/local/

mkdir hexo

chmod 775 -R /usr/local/hexo/

4.添加测试的index.html文件,检测是否配置成功

vim /usr/local/hexo/index.html
<!DOCTYPE html>

<html>

<head>

<title></title>

<meta charset="UTF-8">

</head>

<body>

<p>Hello,Make! Nginx is running!</p>

</body>

</html>

5.配置 Nginx 服务器

vim /etc/nginx/nginx.conf

在端口80的下方修改

server {

listen 80 default_server;

listen [::]:80 default_server;

server_name www.maaiting.com; # 填写个人域名

root /usr/local/hexo/; #hexo文件目录

}

6.启动

service nginx start

输入 个人域名查看是否呈现index.html的内容。

配置Git环境

1.创建个人目录,搭建Git仓库。设置好读写权限

cd /usr/local/

mkdir blogRepo

chmod 775 -R /usr/local/blogRepo/

2.初始化Git仓库

cd blogRepo/

git init --bare hexo.git

3.创建Git hook

vim /usr/local/blogRepo/hexo.git/hooks/post-receive

粘贴下面的代码块:

#!/bin/bash

git --work-tree=/usr/local/hexo --git-dir=/usr/local/blogRepo/hexo.git checkout -f

按键ESC+:wq保存

4.赋予权限

chmod +x /usr/local/blogRepo/hexo.git/hooks/post-receive

三.本地配置

配置本地文件

找到第一步准备工作时候初始化的hexo文件,找到_config.yml文件,使用文本打开,修改下列信息:

# URL

### If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'

url: https://www.maaiting.com //个人域名

......

# Deployment

### Docs: https://hexo.io/docs/deployment.html

deploy: //发布对应的github账号

type: git

#例如: root@111.111.122.290:/usr/local/bogRepo/hexo
repo: root@xxx.xxx.xxx.xxx:/usr/local/blogRepo/hexo //用户名@域名或IP 地址:/usr/local/blogRepo/hexo 

branch: master

将本地配置部署到服务器

1.cd 进入到创建的本地Hexo目录内如:

cd ~/Desktop/blog

2.生成静态页面,并部署到服务器:

hexo g && hexo d

这时候输入自己的域名或者外网IP就可以看到博客了。

三.SEO相关的优化

SEO优化是为了更快更多的被搜索引擎收录,你的网站更容易在百度、google上被人搜索到。

部署https

以腾讯云为例:

  1. 进入SSL证书-证书管理-申请免费证书 (大概一个小时以内就能下来)

  2. 下载证书。有不同配置环境下的证书,以Nginx为例。

  3. 在服务器上创建ssl目录存放证书

    cd /etc/nginx
    mkdir ssl
    
  4. 使用scp命令将本地证书上传到服务器ssl目录下

    sudo scp -r /Users/make/Downloads/maaiting/Nginx/ root@111.11.10.118:/etc/nginx/ssl/
    
  5. 在服务器上操作,将http重定向到https

    cd /etc/nginx
    vim nginx.conf
    

    在端口80下方添加代码:rewrite ^(.*) https://$server_name$1 permanent;如:

    server {
        listen       80 default_server;
        listen       [::]:80 default_server;
        server_name  www.maaiting.com; #自己的域名
        root         /usr/local/hexo/;
    
        # Load configuration files for the default server block.
        include /etc/nginx/default.d/*.conf;
    
    
        rewrite ^(.*) https://$server_name$1 permanent;
    
        location / {
        }
    
        error_page 404 /404.html;
            location = /40x.html {
        }
    
        error_page 500 502 503 504 /50x.html;
            location = /50x.html {
        }
    }
    

    在下方添加:

     server {
        listen       443 ssl http2 default_server;
        listen       [::]:443 ssl http2 default_server;
        server_name  www.maaiting.com;
        root          /usr/local/hexo/;
    
        ssl_certificate "/etc/nginx/ssl/1_maaiting.com_bundle.crt";
        ssl_certificate_key "/etc/nginx/ssl/2_maaiting.com.key";
        ssl_session_cache shared:SSL:1m;
        ssl_session_timeout  10m;
        ssl_ciphers HIGH:!aNULL:!MD5;
        ssl_prefer_server_ciphers on;
    
        # Load configuration files for the default server block.
        include /etc/nginx/default.d/*.conf;
    
        location / {
        }
    
        error_page 404 /404.html;
            location = /40x.html {
        }
    
       error_page 500 502 503 504 /50x.html;
            location = /50x.html {
        }
    }
    
  6. 重启Nginx

    systemctl restart nginx
    

    再输入域名,可以看到会自动定向到https了

sitemap

可以安装这几个插件,自动生成sitemap

npm install hexo-generator-sitemap
npm install hexo-generator-sitemap --save-dev
npm install hexo-generator-baidu-sitemap --save-dev

并且可以在主题配置文件内使用:将sitemap显示出来.同时可以在google 百度统计按照要求提交sitemap。

menu:
  home: / || home
  #about: /about/ || user
  所有文章: /archives/ || archive
  categories: /categories/ || th
  tags: /tags/ || tags
  #schedule: /schedule/ || calendar
  sitemap: /sitemap.xml || sitemap
  #commonweal: /404/ || heartbeat

提交网址

可以在这里提交网址给百度,网址收录的更快哦。

也可以在这里提交给google。