Hexo创建博客(最全)

版权声明:如有转载,请标明出处 https://blog.csdn.net/qq_25774883/article/details/81589257

准备:

Git:https://git-scm.com/downloads

Nodejs:https://nodejs.org/en/

Github账号,并创建新仓库

新建仓库如下:

安装Nodejs

一路next即可

安装git

安装一路next,重点在配置

首先将安装目录添加进环境变量

然后设置用户名和邮箱

$ git config --global user.name "John Doe"
$ git config --global user.email [email protected]

安装hexo

在所要存放博客文件的文件夹下右键,点击git bash

输入如下命令:

npm install -g hexo-cli

创建hexo文件夹

hexo init 

安装依赖依赖包

npm install

站点配置

在博客目录下找到_config.yml

# Site
title: 平步青云win
subtitle:
description: 建站 Linux Python C++ 编程语言
keywords: 建站 Linux Python C++ 编程语言
author: zxp
language: zh-Hans
timezone:



deploy:
  type: git
  repository: https://github.com/zxpgo/blog.git# 博客仓库地址
 #repository: https://github.com/xxx/xxx.github.io.git 

博客仓库地址见本文开头第二张图片内的地址

注意::之后必须添加一个空格再添加内容

否则会有如下错误:

本地站点生成

生成文件

hexo g

显示如下信息,表示成功

启动服务

hexo s

显示如下信息,表示成功:

到此本地的配置结束

打开浏览器,输入localhost:4000查看

部署Github

hexo clean && hexo g && hexo d

hexo clean #清除缓存文件 (db.json) 和已生成的静态文件 (public)。(个人习惯,非必需)
hexo g #生成静态文件,每次改动之后都需要执行以下这个命令。
hexo d #这个才是真正的部署命令,这里用的都是简写形式

问题一

运行时出错,由于还没有添加sshkey,具体教程如下:
打开Git Bash

设置Git的user name和email:(前面以及设置)

git config --global user.name "aqiongbei" #改成你的注册Github的用户名
git config --global user.email "[email protected]" #改成你的注册Github的邮箱

生成SSH密钥:

生存密钥:

ssh-keygen -t rsa -C "[email protected]" #改成你注册Github的邮箱

返回提示如下:

然后会提示,不用理,直接按回车,一共三次。
C:\Users\Neckpain\.ssh得到 id_rsa 和 id_rsa.pub 文件,说明生成成功

添加密钥到 Github

打开 Github,登录自己的账号后
点击自己的头像->settings->SSH Keys->Add SSH key
将本地 id_rsa.pub 中的内容粘贴到 Key 文本框中,随意输入一个 title,点击 Add Key 即可。

测试

Git里面继续输入

ssh -T [email protected]

返回

则说明验证成功。


问题二

ERROR Deployer not found: git

解决方案如下:

npm install --save hexo-deployer-git

添加域名

首先购买域名,博主在阿里云购买,记得实名认证

首先在域名控制台添加记录,

记录一般添加两条,具体如下:

然后在github的博客代码处添加一个CNMAE文件,不要后缀

内容为申请的域名

www.zxpblog.cn
zxpblog.cn

最后还得在setting中的Custom domain处添加域名,必须加www, 如下

主题修改

在本地博客目录下打开git bash

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

在_config.yml中找到theme修改为下载的主题名

重新部署到github即可

hexo clean && hexo g && hexo d

底部添加访问量统计

打开\themes\主题名字\layout\_partials\footer.swig文件,不同具体footer文件的后缀可能不同,在顶部添加如下代码:

<script async src="https://dn-lbstatics.qbox.me/busuanzi/2.3/busuanzi.pure.mini.js"></script>

接着在合适的地方添加需要显示的统计数字代码(同上文件):

<div class="powered-by">
<i class="fa fa-user-md"></i><span id="busuanzi_container_site_uv">
  本站访客数:<span id="busuanzi_value_site_uv"></span>
</span>
</div>

两种统计方式:

  • 同一用户连续点击n篇文章,记录n次访问量
<span id="busuanzi_container_site_pv">
    本站总访问量<span id="busuanzi_value_site_pv"></span>次
</span>
  • 同一用户连续点击n篇文章,记录1次访问量
<span id="busuanzi_container_site_uv">
  本站总访问量<span id="busuanzi_value_site_uv"></span>次
</span>

Yelee主题

http://moxfive.coding.me/yelee/

Hexo中的Yelee主题,首页不显示文章摘要

解决方案见:https://blog.csdn.net/youshaoduo/article/details/78709160

添加打赏功能

https://www.jianshu.com/p/16a8f15c543d

添加评论功能

来必力:https://livere.com/

教程:第一步注册来必力,复制代码

第二步,在主题中的comments目录中添加一个livebe文件,后缀跟其中文件相同即可

第三步,找到主题中的article文中,在<article></article>中添加如下代码:

<%- partial('comments/livebe') %>

代码其中目录根据livebe文件所在目录灵活变动

本人博客为:本人博客

猜你喜欢

转载自blog.csdn.net/qq_25774883/article/details/81589257