关于Hexo-Next

图片显示问题

图床方式

可以打开https://mp.csdn.net/mdeditor#进行截图的直接粘贴
也可以把原本的图片的URL或者图片上传来生成转换后的Markdown语法
使用这个会加载比上传的要快

在这里插入图片描述

本地图片

相对来说麻烦,但是安全,因为图片都是存在本地的,访问起来也很慢
安装npm install hexo-asset-image --save
站点配置文件_config.yml中设置
post_asset_folder: true # 开启本地图片上传
url: /换成你自己的站点
并且打开\node_modules\hexo-asset-image\index.js把全部内容删除,替换成以下内容

index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
'use strict';
var cheerio = require('cheerio');

// http://stackoverflow.com/questions/14480345/how-to-get-the-nth-occurrence-in-a-string
function getPosition(str, m, i) {
return str.split(m, i).join(m).length;
}

var version = String(hexo.version).split('.');
hexo.extend.filter.register('after_post_render', function(data){
var config = hexo.config;
if(config.post_asset_folder){
var link = data.permalink;
if(version.length > 0 && Number(version[0]) == 3)
var beginPos = getPosition(link, '/', 1) + 1;
else
var beginPos = getPosition(link, '/', 3) + 1;
// In hexo 3.1.1, the permalink of "about" page is like ".../about/index.html".
var endPos = link.lastIndexOf('/') + 1;
link = link.substring(beginPos, endPos);

var toprocess = ['excerpt', 'more', 'content'];
for(var i = 0; i < toprocess.length; i++){
var key = toprocess[i];

var $ = cheerio.load(data[key], {
ignoreWhitespace: false,
xmlMode: false,
lowerCaseTags: false,
decodeEntities: false
});

$('img').each(function(){
if ($(this).attr('src')){
// For windows style path, we replace '\' to '/'.
var src = $(this).attr('src').replace('\\', '/');
if(!/http[s]*.*|\/\/.*/.test(src) &&
!/^\s*\//.test(src)) {
// For "about" page, the first part of "src" can't be removed.
// In addition, to support multi-level local directory.
var linkArray = link.split('/').filter(function(elem){
return elem != '';
});
var srcArray = src.split('/').filter(function(elem){
return elem != '' && elem != '.';
});
if(srcArray.length > 1)
srcArray.shift();
src = srcArray.join('/');
$(this).attr('src', config.root + link + src);
console.info&&console.info("update link as:-->"+config.root + link + src);
}
}else{
console.info&&console.info("no src attr, skipped...");
console.info&&console.info($(this));
}
});
data[key] = $.html();
}
}
});

在新建文章的时候hexo n 文章名就会在站点下的\source\_posts中创建一个.md文件,也会创建一个相同的文件夹
把图片都放入文件夹,引入使用![图片描述](文件夹名称\图片.png)

图片居左显示

首先在\themes\next\source\css\main.styl中添加@import "diy/diy";//导入我的自定义样式
在与main.styl同级目录创建一个文件夹diy并创建文件diy.styl

在这里插入图片描述

在里面添加

1
2
/*文章内图片居左*/
.post-body .fancybox img { margin-left: 0 !important; }

关于分类的创建问题

1
2
3
4
5
6
7
8
9
10
11
12
# 1种分类
categories:
- [分类1]

# 1种分类,并且下面有一个子分类
categories:
- [分类1,分类11]

# 2种分类
categories:
- [分类1]
- [分类2]

博文加密

安装npm install --save hexo-blog-encrypt
.md文件添加开头password: 123456
进入文章会需要密码,退出的时候不点击文章下面的按钮则下次进入无需密码

在这里插入图片描述

*添加CNZZ统计功能

注册友盟云并点击跳转https://web.umeng.com/main.php?c=site&a=add

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

修改根目录\themes\next\layout\_third-party\analytics\cnzz-analytics.swig改为

1
2
3
4
5
{% if theme.cnzz_siteid %}
<div>
你的复制内容
</div>
{% endif %}

并且把主题配置文件\themes\next\_config.yml
cnzz_siteid: true

自定义CSS样式

\themes\next\source\css\_custom\custom.styl

绑定域名

这里我选用阿里云的,直接支付宝登录https://cn.aliyun.com/
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
购买成功之后来到域名控制台https://dc.console.aliyun.com/next/index#/domain/list/all-domain
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

优化访问速度

1
2
# 设置不从google加载字体
use_font_lato: false

在这里插入图片描述
fonts.googleapis.com改为fonts.useso.com
在这里插入图片描述
主题配置文件下把host原本对应内容为空改为host: //fonts.lug.ustc.edu.cn
在这里插入图片描述

网站测速

进入地址https://ping.chinaz.com/
在这里插入图片描述

设置HTPPS安全

在这里插入图片描述
在这里插入图片描述
翻到最下面,
1,先删除自定义域名
2,保存
3,打勾
4,填上域名 例如我的www.taopanfeng.top
5保存
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

部署coding

同时部署github + codind,
但是取消了之前github的绑定的www.taopanfeng.top,现在把www.taopanfeng.top绑定到了coding

  • 注册https://coding.net/
  • 创建团队,然后下一步,再填写信息即可.
    在这里插入图片描述
  • 再进入https://coding.net/右上角选择登录
    在这里插入图片描述
  • 新建项目
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述
  • 初始化仓库
    在这里插入图片描述
  • 设置公钥
    找到C盘用户目录下的.ssh目录下的id_rsa.pub
    在这里插入图片描述
    进入个人设置
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述
  • 测试公钥是否正确
    本地打开 Git Bash 窗口,输入一下命令:ssh -T git@coding.net
    这时候会显示是否继续,选择 yes 继续,如果提示下列内容成功,即 SSH 公钥配置成功:
    1
    Hello xxx You've connected to Coding.net by SSH successfully!
    当然,xxx 是我 Coding 帐户的名字,不同的帐户会不一样,如果显示如下的错误:
    在这里插入图片描述
    在这里插入图片描述
    说明防火墙完全屏蔽了端口 22 ,这时候不要慌张,直接输入如下命令使用 Coding 提供的 443 端口 SSH 服务即可解决:
    ssh -T -p 443 git@git-ssh.coding.net
    在这里插入图片描述
  • 发布静态网址
    在这里插入图片描述
    在这里插入图片描述
  • 点击部署,当然,这时候是不行的,仓库里面还没有东西
    在这里插入图片描述
  • 修改站点配置文件
    把地址指向你自己的域名
    在这里插入图片描述
    修改推送地址,现在我的设置是两个地址都推送,但是我只使用coding,作为访问,因为它是国内的访问速度比较快.
    在这里插入图片描述
    1
    2
    3
    4
    5
    6
    deploy:
    type: git
    repository:
    github: https://github.com/TaoPanfeng/taopanfeng.github.io.git
    coding: https://e.coding.net/taopanfeng/taopanfeng.git
    branch: master
  • 把之前文章中的github的地址都指向自己的域名www.taopanfeng.top
    这里是使用IDEA进行文件夹导入,使用Ctrl + Shift + R进行多文件内容搜索替换,指定文件夹搜索
    在这里插入图片描述
  • 替换之后,我们先部署一下,还是老指令了,我把三步合成一个指令hexo clean ; hexo g -d
    部署成功,再进行DNS解析
    在这里插入图片描述
  • 取消github的部署
    在这里插入图片描述
    在这里插入图片描述
  • 使用coding绑定域名www.taopanfeng.top
    在这里插入图片描述