有很多的博主写文章所使用的图床是基于github的,然后jsdelivr全球加速,由于比较快速并且图片也可以由自己管理,又可以白嫖,所以得到了很多站长的青睐。

但是单个免费版本的仓库却是有容量限制的,据说达到1G的容量之后会收到警告信息,所以为了科学白嫖和图片持久性,我们需要在一个仓库满额之后切换到一个新的仓库。

那么,如何查看仓库已经使用的容量呢?

打开账号设置

首先需要登录账号,点击右上角头像位置,选择Setting

image-20200504085803622

然后会进入到设置页面,点击左侧栏的Repositories

image-20200504085902110

然后找到自己存放图片的仓库,即可看到已经使用的容量大小

在前一段时间,我发布了一篇关于复制内容弹窗提醒的文章,当时使用的是layer,所以它几乎适用于所有的网站,而handsome主题却拥有一个自带的弹窗提示,我们却忽略掉了。使用handsome主题的童鞋完全不需要使用layer来作为提示弹窗,使用自带的即可!

用Layer和jQuery写了一个复制之后版权提醒的弹窗

函数调用方式

通过深挖主题的js代码,我找到了调用的方式

1
2
3
4
5
6
7
$.message({
message: "这里有我的实验室,子站点,项目展示和联系方式!",
title: "欢迎来到秘密基地!",
type: "info",
autoHide: !1,
time: "10000"
})

参数

1
2
3
4
5
title:弹窗的标题
message:弹窗标题下方的文字
type: 弹窗类型
autoHide:默认即可
time:停留时间(毫秒,1秒为1000毫秒)

弹窗类型

由于我没有太过于深挖主题的代码,所以目前大概知道有三种弹窗类型:

  1. info

image-20200503090102913

  1. success

    image-20200503090142563

  2. warning

image-20200503090307324

选择自己所需要的弹窗类型,填入type即可。

调用实例

以下是目前本站所使用的调用方式:

网站加载完成并提示来路URL

image-20200503091548331

将以下代码填入开发者设置 》》 自定义输出body 尾部的HTML代码

注意,要放在广告异步推送代码之前,放在后面可能会影响加载。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<script>
function kaygb_referrer(){
var kaygb_referrer = document.referrer;
if (kaygb_referrer != ""){
return "感谢您的访问! 您来自:<br>" + document.referrer;
}else{
return "";
}}
$.message({
message: "为了网站的正常运行,请不要使用广告屏蔽插件,谢谢!<br >" + kaygb_referrer(),
title: "网站加载完成",
type: "success",
autoHide: !1,
time: "5000"
})

</script>

复制成功之后弹窗提示

image-20200503091612184

将以下代码填入开发者设置 》》 自定义Javascript

1
2
3
4
5
6
7
8
9
kaygb_copy();function kaygb_copy(){$(document).ready(function(){$("body").bind('copy',function(e){hellolayer()})});var sitesurl=window.location.href;function hellolayer(){
$.message({
message: "尊重原创,转载请注明出处!<br> 本文作者:风也<br>原文链接:"+sitesurl,
title: "复制成功",
type: "warning",
autoHide: !1,
time: "15000"
})
}}

如果你开启了PJAX,那么需要在主题设置》PJAX》PJAX回调函数一栏内填入以下函数,然后保存即可。

1
kaygb_copy();

独立页面或文章单独调用

此调用方式可实现在文章打开之后弹窗提示,我在我的独立页面秘密基地

中便使用了这种方式,打开页面,右上角会出现一个弹窗

image-20200503091639890

使用时,只需要在文章内插入可执行代码,也就是用三个英文感叹号包裹。

1
2
3
4
5
6
7
8
9
10
11
12
13
!!!

<script>
$.message({
message: "这里有我的实验室,子站点,项目展示和联系方式!",
title: "欢迎来到秘密基地!",
type: "info",
autoHide: !1,
time: "10000"
})
</script>

!!!

关于弹窗时间

时间以毫秒计算,1000即代表着1秒,如果我们想让他显示十秒钟,time修改为10000即可!

旧域名不用了,但是还需要设置一下301跳转,因为还有一部分的友链是旧域名链接没有更换,但是单独使用一台服务器来设置301跳转未免有些太浪费资源了,在dns层用url转发又有一些弊端,就是无法使用https,所以我使用了cloudflare的页面规则来跳转,即免费,又稳定,还节约了资源。

使用cloudflare

https://dash.cloudflare.com/

如果有账号直接登录,没有的话注册,登录之后添加域名,然后在域名注册商修改dns地址

image-20200430201755186

生效之后,我们可以看到一排tab组,选择这个页面规则就可以了。

免费的账号只支持3条页面规则,刚刚好够我使用。

上面填入旧域名,下方选择转发URL,301永久重定向,地址填写完整的地址,这样就可以了。

看到分享社区有小伙伴设置了网站全站变灰,那我也来一个进阶设置吧!用jquery的方式定时实现全站黑白。

首先看到的是这个小伙伴的文章:https://www.igetyou.cn/archives/43/,然后我就稍加修改,嘿嘿!

不多说,直接上代码:

将以下代码直接复制到自定义JS中即可,理论所有网站都适用。

1
2
3
4
5
6
7
8
9
10
11
12
13
ncov_gray();

function ncov_gray() {
var date = new Date();
this.year = date.getFullYear();
this.month = date.getMonth() + 1;
this.date = date.getDate();

var currentTime = this.year + "." + this.month + "." + this.date;
if (currentTime == "2020.4.4") {
$("html").css("filter", "grayscale(1)");
}
}

稍微解释一下,我是通过JS的Date函数获取年月日,当年月日等于2020.4.4的时候调用jQuery为html标签设置css样式:

1
2
3
html{
filter: grayscale(1);
}

为啥是html?

因为我发现那位小伙伴用body其实是有一点缺点的,在handsome主题下,如果我们设置了背景图片,那么全站变灰仅限于盒子模型,图片并没有变化。而handsome主题的自定义样式是给html标签设置了一个名位bgclass

自建的gravatar以前就弄好了,当时的解决方式是使用nginx的反向代理v2ex的镜像,用服务器拉取镜像然后再通过cdn缓存加速,当时觉得这是一个很好用的解决方案。但是这个方案有一定的弊端,就是服务器要创建一个网站来反代,其实这也消耗了一定的服务器资源。

记得之前看到有朋友使用七牛云来做gravatar的镜像服务,但是网上的好多教程都已经过时了,所以今天就记录一下。本文使用两个cdn服务来将,由于国内的cdn服务都需要备案,如果你的网站没有备案的话,建议使用V2EX的gravatar镜像加速服务。

两种配置的方式,选择其一即可。

又拍云CDN配置Gravatar头像加速

首先呢,需要注册一个又拍云的账号,点击注册
然后申请又拍云联盟,获取免费额度:https://www.upyun.com/league

创建服务

在云产品找到CDN,创建一个服务。

服务名称随便填,加速域名填入备案过的域名,然后源站设置为secure.gravatar.com,或者是cdn.v2ex.com,不用勾选源站证书校验。加速区域的话选择全球加速,如果你的网站只在国内提供服务,那就可以选择国内加速。

创建之后需要在DNS解析商那里配置一下CNAME

配置HTTPS

云产品找到SSL证书

选择免费的Let's Encrypt证书,因为这个证书配置之后又拍云会自动为我们续签。

申购之后在证书列表里面选择补全,填入刚才的加速域名,等待申购成功。

申购成功之后,回到CDN的配置页面,选择HTTPS,点击HTTPS配置,然后部署

这样就搞定了。

七牛云CDN配置Gravatar头像加速

七牛云的https请求需要收费,介意的可以使用又拍云。

创建服务

它的配置稍微有一点麻烦,需要我们先创建一个对象存储空间

创建之后点击设置,然后滑到底部找到镜像回源,然后配置镜像回源

点击增加线路

回源地址填入https://secure.gravatar.com,然后点击保存。

然后回到存储空间主页,点击绑定加速域名

填入需要绑定的域名,先选择http,之后再配置https。

然后和又拍的步骤一样,在DNS解析那里绑定CNAME记录,这里就不再赘述。

配置HTTPS证书

在cdn设置里面找到刚才配置好的域名,然后点击配置。

找到HTTPS配置,点击修改配置

选择免费证书,由于我已经申请过,所以这里会有这个显示。申请之后会自动配置,需要大概十五分钟左右。

然后就可以愉快的开始使用了。

注意一点

由于v2ex的镜像服务和官方的稍有差异,所以需要大家修改一下配置

官方的是avatar:https://secure.gravatar.com/avatar/

而V2EX的是gravatar:https://cdn.v2ex.com/gravatar/

如果你使用了V2EX作为源站的话,使用的时候一定要记得修改后面的路径。

同时也建议大家配置防盗链,设置域名白名单然后关闭空refer即可。