function Authorimg($email)
-{
- $a='cdn.v2ex.com/gravatar';//gravatar头像源
- $b=str_replace('@qq.com','',$email);//替换qq邮箱
- if(stristr($email,'@qq.com')&&is_numeric($b)&&strlen($b)<11&&strlen($b)>4){
- $nk = 'http://ptlogin2.qq.com/getface?&imgtype=1&uin='.$b;//qq头像api
- $q = file_get_contents($nk);//读入文件
- $q = json_encode($nk);//编码json
- $k = explode("&k=",$q)[1];//分割出k值
- echo 'https://q.qlogo.cn/g?b=qq&k='.$k.'&s=100';//重组
- }else{
- $email= md5($email);
- echo 'https://'.$a.'/'.$email.'?';
- }
-}
+function Authorimg($email)
+{
+ $a='cdn.v2ex.com/gravatar';//gravatar头像源
+ $b=str_replace('@qq.com','',$email);//替换qq邮箱
+ if(stristr($email,'@qq.com')&&is_numeric($b)&&strlen($b)<11&&strlen($b)>4){
+ $nk = 'http://ptlogin2.qq.com/getface?&imgtype=1&uin='.$b;//qq头像api
+ $q = file_get_contents($nk);//读入文件
+ $q = json_encode($nk);//编码json
+ $k = explode("&k=",$q)[1];//分割出k值
+ echo 'https://q.qlogo.cn/g?b=qq&k='.$k.'&s=100';//重组
+ }else{
+ $email= md5($email);
+ echo 'https://'.$a.'/'.$email.'?';
+ }
+}
2.第二种获取HTTP请求所发送的标头的数组，不用读入整个文件不会影响效率
- function Authorimg($email)
- {
- $a='cdn.v2ex.com/gravatar';//gravatar头像源
- $b=str_replace('@qq.com','',$email);
- if(stristr($email,'@qq.com')&&is_numeric($b)&&strlen($b)<11&&strlen($b)>4){
- $nk = 'https://s.p.qq.com/pub/get_face?img_type=3&uin='.$b;
- $c = get_headers($nk, true);
- $d = $c['Location'];
- $q = json_encode($d);
- $k = explode("&k=",$q)[1];
- echo 'https://q.qlogo.cn/g?b=qq&k='.$k.'&s=100';
- }else{
- $email= md5($email);
- echo 'https://'.$a.'/'.$email.'?';
- }
- }
+ function Authorimg($email)
+ {
+ $a='cdn.v2ex.com/gravatar';//gravatar头像源
+ $b=str_replace('@qq.com','',$email);
+ if(stristr($email,'@qq.com')&&is_numeric($b)&&strlen($b)<11&&strlen($b)>4){
+ $nk = 'https://s.p.qq.com/pub/get_face?img_type=3&uin='.$b;
+ $c = get_headers($nk, true);
+ $d = $c['Location'];
+ $q = json_encode($d);
+ $k = explode("&k=",$q)[1];
+ echo 'https://q.qlogo.cn/g?b=qq&k='.$k.'&s=100';
+ }else{
+ $email= md5($email);
+ echo 'https://'.$a.'/'.$email.'?';
+ }
+ }
预装主题之后，确实可以实现，但是介于自己的Amigo朋友圈主题模版首页样式需要加载很多评论头像
使用这两个方法，加载首页的时间就很长了
一个头像需要花费一秒的时间，如果首页的头像较多，这个问题将会是致命的
@@ -181,23 +181,23 @@ https://cravatar.cn/avatar/HASH
如果是QQ邮箱，则通过strtolower() 函数进行转换为小写，再md5加密，然后返回头像
代码展示
因为是小白，可能写的有些问题
-function Authorimg($email)
-{
- $a='cravatar.cn/avatar';//gravatar头像源
- $b=str_replace('@qq.com','',$email);
- if(stristr($email,'@qq.com')&&is_numeric($b)&&strlen($b)<11&&strlen($b)>4){
- $address = strtolower( trim( $email ) );
- $hash = md5( $address );
- $qqimgurl = 'https://cravatar.cn/avatar/' . $hash;
- return $qqimgurl;
- }else{
- $email= md5($email);
- $avatarimgurl = 'https://'.$a.'/'.$email.'?';
- return $avatarimgurl;
- }
-}
+function Authorimg($email)
+{
+ $a='cravatar.cn/avatar';//gravatar头像源
+ $b=str_replace('@qq.com','',$email);
+ if(stristr($email,'@qq.com')&&is_numeric($b)&&strlen($b)<11&&strlen($b)>4){
+ $address = strtolower( trim( $email ) );
+ $hash = md5( $address );
+ $qqimgurl = 'https://cravatar.cn/avatar/' . $hash;
+ return $qqimgurl;
+ }else{
+ $email= md5($email);
+ $avatarimgurl = 'https://'.$a.'/'.$email.'?';
+ return $avatarimgurl;
+ }
+}
这样只需要在前端引用一下就好了
-<?php Authorimg($comments->mail); ?>
+<?php Authorimg($comments->mail); ?>
这样QQ用户头像加密功能，就实现了
![]()
@@ -214,24 +214,24 @@ https://cloud.usj.cc/d/Onedrive/%E4%BB%A3%E7%A0%81/feature.php
然后进入你的主题文件，找到 /libs/feature.php文件直接覆盖替换即可
Twitter主题用户
如果你是Twitter用户，直接在主题目录的function.php的第47行的位置将 Yoniu：取Gravatar头像 部分的代码替换到如下代码
-//Yoniu：取Gravatar头像
-function getGravatar($email, $s = 40, $d = 'mm', $g = 'g') {
- if(preg_match('|^[1-9]\d{4,11}@qq\.com$|i',$email)){
- $address = strtolower( trim( $email ) );
- $hash = md5( $address );
- $qqimgurl = 'https://cravatar.cn/avatar/' . $hash;
- return $qqimgurl;
- }else{
- $hash = md5($email);
- $option = Typecho_Widget::widget('Widget_Options');
- if($option->gravatarURL){
- $avatar = $option->gravatarURL."/$hash?s=&d=$d&r=$g";
- }else{
- $avatar = "//gravatar.com/avatar/$hash?s=&d=$d&r=$g";
- }
- return $avatar;
- }
-}
+//Yoniu：取Gravatar头像
+function getGravatar($email, $s = 40, $d = 'mm', $g = 'g') {
+ if(preg_match('|^[1-9]\d{4,11}@qq\.com$|i',$email)){
+ $address = strtolower( trim( $email ) );
+ $hash = md5( $address );
+ $qqimgurl = 'https://cravatar.cn/avatar/' . $hash;
+ return $qqimgurl;
+ }else{
+ $hash = md5($email);
+ $option = Typecho_Widget::widget('Widget_Options');
+ if($option->gravatarURL){
+ $avatar = $option->gravatarURL."/$hash?s=&d=$d&r=$g";
+ }else{
+ $avatar = "//gravatar.com/avatar/$hash?s=&d=$d&r=$g";
+ }
+ return $avatar;
+ }
+}
这样就可以了
]]>
@@ -664,269 +664,269 @@ http://debugtbs.qq.com
大概谷歌浏览器搜了一下，还是如愿以偿找到了代码，但是代码不太精简，我删除了一些不必要的代码
终究还是实现了，这里简单讲一下方法以及实现原理，首先就是怼几个div标签，进行骨架构成
这边建议找到自己的主题模版的footer.php，在适当位置加入下面这些代码
-<div id="usj">
-<div class="deng-box2">
- <div class="deng">
- <div class="xian">
- </div>
- <div class="deng-a">
- <div class="deng-b">
- <div class="deng-t">年</div>
- </div>
- </div>
- <div class="shui shui-a">
- <div class="shui-c">
+<div id="usj">
+<div class="deng-box2">
+ <div class="deng">
+ <div class="xian">
+ </div>
+ <div class="deng-a">
+ <div class="deng-b">
+ <div class="deng-t">年</div>
+ </div>
+ </div>
+ <div class="shui shui-a">
+ <div class="shui-c">
- </div>
- <div class="shui-b"></div>
- </div>
- </div>
-</div>
-<div class="deng-box3">
- <div class="deng">
- <div class="xian">
+ </div>
+ <div class="shui-b"></div>
+ </div>
+ </div>
+</div>
+<div class="deng-box3">
+ <div class="deng">
+ <div class="xian">
- </div>
- <div class="deng-a">
- <div class="deng-b">
- <div class="deng-t">新</div>
- </div>
- </div>
- <div class="shui shui-a">
- <div class="shui-c"></div>
- <div class="shui-b">
+ </div>
+ <div class="deng-a">
+ <div class="deng-b">
+ <div class="deng-t">新</div>
+ </div>
+ </div>
+ <div class="shui shui-a">
+ <div class="shui-c"></div>
+ <div class="shui-b">
- </div>
- </div>
- </div>
-</div>
-<div class="deng-box1">
- <div class="deng">
- <div class="xian">
+ </div>
+ </div>
+ </div>
+</div>
+<div class="deng-box1">
+ <div class="deng">
+ <div class="xian">
- </div>
- <div class="deng-a">
- <div class="deng-b">
- <div class="deng-t">乐</div>
- </div>
- </div>
- <div class="shui shui-a">
- <div class="shui-c"></div>
- <div class="shui-b"></div>
- </div>
- </div>
-</div>
-<div class="deng-box">
- <div class="deng">
- <div class="xian">
+ </div>
+ <div class="deng-a">
+ <div class="deng-b">
+ <div class="deng-t">乐</div>
+ </div>
+ </div>
+ <div class="shui shui-a">
+ <div class="shui-c"></div>
+ <div class="shui-b"></div>
+ </div>
+ </div>
+</div>
+<div class="deng-box">
+ <div class="deng">
+ <div class="xian">
- </div>
- <div class="deng-a">
- <div class="deng-b">
- <div class="deng-t">快</div>
- </div>
- </div>
- <div class="shui shui-a">
- <div class="shui-c">
+ </div>
+ <div class="deng-a">
+ <div class="deng-b">
+ <div class="deng-t">快</div>
+ </div>
+ </div>
+ <div class="shui shui-a">
+ <div class="shui-c">
- </div>
- <div class="shui-b"></div>
- </div>
- </div>
-</div>
-</div>
+ </div>
+ <div class="shui-b"></div>
+ </div>
+ </div>
+</div>
+</div>
接着就是怼css，分别为四个灯笼，输出新年快乐四个字，分别给他们设为deng-box，deng-box2，deng-box3，deng-box4，当然每个博客模版都是需要自己对deng-box的top和left值进行适当调整，你也可以参考以下css代码
-.deng-box {
- position: fixed;
- top: -30px;
- right: 35px;
- z-index: 9999;
- pointer-events: none;
- }
+.deng-box {
+ position: fixed;
+ top: -30px;
+ right: 35px;
+ z-index: 9999;
+ pointer-events: none;
+ }
- .deng-box1 {
- position: fixed;
- top: -30px;
- right: -41px;
- z-index: 9999;
- pointer-events: none
- }
+ .deng-box1 {
+ position: fixed;
+ top: -30px;
+ right: -41px;
+ z-index: 9999;
+ pointer-events: none
+ }
- .deng-box2 {
- position: fixed;
- top: -30px;
- left: 40px;
- z-index: 9999;
- pointer-events: none
- }
+ .deng-box2 {
+ position: fixed;
+ top: -30px;
+ left: 40px;
+ z-index: 9999;
+ pointer-events: none
+ }
- .deng-box3 {
- position: fixed;
- top: -30px;
- left: -20px;
- z-index: 9999;
- pointer-events: none
- }
+ .deng-box3 {
+ position: fixed;
+ top: -30px;
+ left: -20px;
+ z-index: 9999;
+ pointer-events: none
+ }
- .deng-box1 .deng,
- .deng-box3 .deng {
- position: relative;
- width: 120px;
- height: 90px;
- margin: 50px;
- background: #d8000f;
- background: rgba(216, 0, 15, .8);
- border-radius: 50% 50%;
- -webkit-transform-origin: 50% -100px;
- -webkit-animation: swing 5s infinite ease-in-out;
- box-shadow: -5px 5px 30px 4px #fc903d
- }
+ .deng-box1 .deng,
+ .deng-box3 .deng {
+ position: relative;
+ width: 120px;
+ height: 90px;
+ margin: 50px;
+ background: #d8000f;
+ background: rgba(216, 0, 15, .8);
+ border-radius: 50% 50%;
+ -webkit-transform-origin: 50% -100px;
+ -webkit-animation: swing 5s infinite ease-in-out;
+ box-shadow: -5px 5px 30px 4px #fc903d
+ }
- .deng {
- position: relative;
- width: 120px;
- height: 90px;
- margin: 50px;
- background: #d8000f;
- background: rgba(216, 0, 15, .8);
- border-radius: 50% 50%;
- -webkit-transform-origin: 50% -100px;
- -webkit-animation: swing 3s infinite ease-in-out;
- box-shadow: -5px 5px 50px 4px #fa6c00
- }
+ .deng {
+ position: relative;
+ width: 120px;
+ height: 90px;
+ margin: 50px;
+ background: #d8000f;
+ background: rgba(216, 0, 15, .8);
+ border-radius: 50% 50%;
+ -webkit-transform-origin: 50% -100px;
+ -webkit-animation: swing 3s infinite ease-in-out;
+ box-shadow: -5px 5px 50px 4px #fa6c00
+ }
- .deng-a {
- width: 100px;
- height: 90px;
- background: #d8000f;
- background: rgba(216, 0, 15, .1);
- margin: 12px 8px 8px 8px;
- border-radius: 50% 50%;
- border: 2px solid #dc8f03
- }
+ .deng-a {
+ width: 100px;
+ height: 90px;
+ background: #d8000f;
+ background: rgba(216, 0, 15, .1);
+ margin: 12px 8px 8px 8px;
+ border-radius: 50% 50%;
+ border: 2px solid #dc8f03
+ }
- .deng-b {
- width: 45px;
- height: 90px;
- background: #d8000f;
- background: rgba(216, 0, 15, .1);
- margin: -4px 8px 8px 26px;
- border-radius: 50% 50%;
- border: 2px solid #dc8f03
- }
+ .deng-b {
+ width: 45px;
+ height: 90px;
+ background: #d8000f;
+ background: rgba(216, 0, 15, .1);
+ margin: -4px 8px 8px 26px;
+ border-radius: 50% 50%;
+ border: 2px solid #dc8f03
+ }
- .xian {
- position: absolute;
- top: -20px;
- left: 60px;
- width: 2px;
- height: 20px;
- background: #dc8f03
- }
+ .xian {
+ position: absolute;
+ top: -20px;
+ left: 60px;
+ width: 2px;
+ height: 20px;
+ background: #dc8f03
+ }
- .shui-a {
- position: relative;
- width: 5px;
- height: 20px;
- margin: -5px 0 0 59px;
- -webkit-animation: swing 4s infinite ease-in-out;
- -webkit-transform-origin: 50% -45px;
- background: orange;
- border-radius: 0 0 5px 5px
- }
+ .shui-a {
+ position: relative;
+ width: 5px;
+ height: 20px;
+ margin: -5px 0 0 59px;
+ -webkit-animation: swing 4s infinite ease-in-out;
+ -webkit-transform-origin: 50% -45px;
+ background: orange;
+ border-radius: 0 0 5px 5px
+ }
- .shui-b {
- position: absolute;
- top: 14px;
- left: -2px;
- width: 10px;
- height: 10px;
- background: #dc8f03;
- border-radius: 50%
- }
+ .shui-b {
+ position: absolute;
+ top: 14px;
+ left: -2px;
+ width: 10px;
+ height: 10px;
+ background: #dc8f03;
+ border-radius: 50%
+ }
- .shui-c {
- position: absolute;
- top: 18px;
- left: -2px;
- width: 10px;
- height: 35px;
- background: orange;
- border-radius: 0 0 0 5px
- }
+ .shui-c {
+ position: absolute;
+ top: 18px;
+ left: -2px;
+ width: 10px;
+ height: 35px;
+ background: orange;
+ border-radius: 0 0 0 5px
+ }
- .deng:before {
- position: absolute;
- top: -7px;
- left: 29px;
- height: 12px;
- width: 60px;
- content: " ";
- display: block;
- z-index: 999;
- border-radius: 5px 5px 0 0;
- border: solid 1px #dc8f03;
- background: orange;
- background: linear-gradient(to right, #dc8f03, orange, #dc8f03, orange, #dc8f03)
- }
+ .deng:before {
+ position: absolute;
+ top: -7px;
+ left: 29px;
+ height: 12px;
+ width: 60px;
+ content: " ";
+ display: block;
+ z-index: 999;
+ border-radius: 5px 5px 0 0;
+ border: solid 1px #dc8f03;
+ background: orange;
+ background: linear-gradient(to right, #dc8f03, orange, #dc8f03, orange, #dc8f03)
+ }
- .deng:after {
- position: absolute;
- bottom: -7px;
- left: 10px;
- height: 12px;
- width: 60px;
- content: " ";
- display: block;
- margin-left: 20px;
- border-radius: 0 0 5px 5px;
- border: solid 1px #dc8f03;
- background: orange;
- background: linear-gradient(to right, #dc8f03, orange, #dc8f03, orange, #dc8f03)
- }
+ .deng:after {
+ position: absolute;
+ bottom: -7px;
+ left: 10px;
+ height: 12px;
+ width: 60px;
+ content: " ";
+ display: block;
+ margin-left: 20px;
+ border-radius: 0 0 5px 5px;
+ border: solid 1px #dc8f03;
+ background: orange;
+ background: linear-gradient(to right, #dc8f03, orange, #dc8f03, orange, #dc8f03)
+ }
- .deng-t {
- font-family: 黑体, Arial, Lucida Grande, Tahoma, sans-serif;
- font-size: 3.2rem;
- color: #dc8f03;
- font-weight: 700;
- line-height: 85px;
- text-align: center
- }
+ .deng-t {
+ font-family: 黑体, Arial, Lucida Grande, Tahoma, sans-serif;
+ font-size: 3.2rem;
+ color: #dc8f03;
+ font-weight: 700;
+ line-height: 85px;
+ text-align: center
+ }
- .night .deng-box,
- .night .deng-box1,
- .night .deng-t {
- background: 0 0 !important
- }
+ .night .deng-box,
+ .night .deng-box1,
+ .night .deng-t {
+ background: 0 0 !important
+ }
- @-moz-keyframes swing {
- 0% {
- -moz-transform: rotate(-10deg)
- }
+ @-moz-keyframes swing {
+ 0% {
+ -moz-transform: rotate(-10deg)
+ }
- 50% {
- -moz-transform: rotate(10deg)
- }
+ 50% {
+ -moz-transform: rotate(10deg)
+ }
- 100% {
- -moz-transform: rotate(-10deg)
- }
- }
+ 100% {
+ -moz-transform: rotate(-10deg)
+ }
+ }
- @-webkit-keyframes swing {
- 0% {
- -webkit-transform: rotate(-10deg)
- }
+ @-webkit-keyframes swing {
+ 0% {
+ -webkit-transform: rotate(-10deg)
+ }
- 50% {
- -webkit-transform: rotate(10deg)
- }
+ 50% {
+ -webkit-transform: rotate(10deg)
+ }
- 100% {
- -webkit-transform: rotate(-10deg)
- }
- }
+ 100% {
+ -webkit-transform: rotate(-10deg)
+ }
+ }
然后适当调整就完成啦，好了，本文就到这里
!!!
@@ -942,46 +942,46 @@ http://debugtbs.qq.com
于是就开整，以下对联全都是用js写的，还是问了大三学长部分问题，不然自己还写不出来，在此特别谢谢学长
考虑到有的博客有很多侧栏，特别的考虑了对联遮挡问题，我还给对联加了关闭按钮，具体自己可以看看本站的效果
[reply]
-<script>
- lastScrollY = 0;
- function heartBeat() {
- var diffY;
- if (document.documentElement && document.documentElement.scrollTop)
- diffY = document.documentElement.scrollTop;
- else if (document.body)
- diffY = document.body.scrollTop
- percent = .1 * (diffY - lastScrollY);
- if (percent > 0) percent = Math.ceil(percent);
- else percent = Math.floor(percent);
- document.getElementById("left").style.top = parseInt(document.getElementById("left").style.top) + percent + "px";
- document.getElementById("right").style.top = parseInt(document.getElementById("right").style.top) + percent + "px";
- lastScrollY = lastScrollY + percent;
- }
- function close_left2() {
- left2.style.visibility = 'hidden';
- }
- function close_right2() {
- right2.style.visibility = 'hidden';
- }
- document.writeln("<style type=\"text\/css\">");
- document.writeln("#left,#right{position:absolute;}");
- document.writeln(".imzql{width:100px;height:auto;line-height:5px}");
- document.writeln("#left2 img{max-width: 100%;width: 70px;}");
- document.writeln("#right2 img{max-width: 100%;width: 70px;}");
- document.writeln("<\/style>");
- document.writeln("<div id=\"left\" style=\"top:112px;left:50px\">");
- document.writeln("<div id=\"left2\" class=\"imzql\">");
- document.writeln("<img border=0 src=https://cdn.usj.cc/left.jpg>");
- document.writeln("<br><a href=\"javascript:close_left2();\" title=\"关闭左边的对联\">×<\/a>");
- document.writeln("<\/div>");
- document.writeln("<\/div>");
- document.writeln("<div id=\"right\" style=\"top:112px;right:50px\">");
- document.writeln("<div id=\"right2\" class=\"imzql\">");
- document.writeln("<img border=0 src=https://cdn.usj.cc/right.jpg>");
- document.writeln("<br><a href=\"javascript:close_right2();\" title=\"关闭右边的对联\">×<\/a>");
- document.writeln("<\/div>");
- document.writeln("<\/div>");
-</script>
+<script>
+ lastScrollY = 0;
+ function heartBeat() {
+ var diffY;
+ if (document.documentElement && document.documentElement.scrollTop)
+ diffY = document.documentElement.scrollTop;
+ else if (document.body)
+ diffY = document.body.scrollTop
+ percent = .1 * (diffY - lastScrollY);
+ if (percent > 0) percent = Math.ceil(percent);
+ else percent = Math.floor(percent);
+ document.getElementById("left").style.top = parseInt(document.getElementById("left").style.top) + percent + "px";
+ document.getElementById("right").style.top = parseInt(document.getElementById("right").style.top) + percent + "px";
+ lastScrollY = lastScrollY + percent;
+ }
+ function close_left2() {
+ left2.style.visibility = 'hidden';
+ }
+ function close_right2() {
+ right2.style.visibility = 'hidden';
+ }
+ document.writeln("<style type=\"text\/css\">");
+ document.writeln("#left,#right{position:absolute;}");
+ document.writeln(".imzql{width:100px;height:auto;line-height:5px}");
+ document.writeln("#left2 img{max-width: 100%;width: 70px;}");
+ document.writeln("#right2 img{max-width: 100%;width: 70px;}");
+ document.writeln("<\/style>");
+ document.writeln("<div id=\"left\" style=\"top:112px;left:50px\">");
+ document.writeln("<div id=\"left2\" class=\"imzql\">");
+ document.writeln("<img border=0 src=https://cdn.usj.cc/left.jpg>");
+ document.writeln("<br><a href=\"javascript:close_left2();\" title=\"关闭左边的对联\">×<\/a>");
+ document.writeln("<\/div>");
+ document.writeln("<\/div>");
+ document.writeln("<div id=\"right\" style=\"top:112px;right:50px\">");
+ document.writeln("<div id=\"right2\" class=\"imzql\">");
+ document.writeln("<img border=0 src=https://cdn.usj.cc/right.jpg>");
+ document.writeln("<br><a href=\"javascript:close_right2();\" title=\"关闭右边的对联\">×<\/a>");
+ document.writeln("<\/div>");
+ document.writeln("<\/div>");
+</script>
[/reply]
https://cdn.usj.cc/xxx.jpg 下载下来，接着上传为自己的本地图片，因为这里图片使用的是自己的腾讯云文件托管，需要添加为referer白名单，否则直接引用会裂图
曾经被油老师嘲讽自己的思考问题不全面，每次整活都没考虑到移动端，所以这次对移动端也做了特别考虑，为了更好的去适应访客效果，我计划在低于1500分辨率的电子设备上不显示对联，否则在小屏幕的手机端，对联会显示出来遮挡对文章的正常浏览
当然控制方法也很简单，直接用css进行控制就好了，有一些设备的分辨率大概在1440，显示了就会影响侧栏的内容显示，当然我已经写了两个关闭按钮去控制，毕竟每次要去关闭两张图片会麻烦
-@media (max-width:1500px){#left,#right{display:none !important}}
+@media (max-width:1500px){#left,#right{display:none !important}}
在主题的自定义css加入这个代码即可解决问题，灯笼的问题同理，直接在自定义cssjiaru
-@media (max-width:1500px){#usj{display:none !important}}
+@media (max-width:1500px){#usj{display:none !important}}
这样效果基本上就弄好了，是不是很容易理解
后来学长建议对联跟随侧栏的拉条移动而移动会更好
这个比较简单直接在
@@ -1265,65 +1265,65 @@ https://docs.rsshub.app/bbs.html#a-dao-ni-ming-ban
这里我会提供两种方法，小赵推荐大家使用第二种，因为利于修改
找到博客的侧栏的php文件，在合适的位置加入以下代码
-<body>
- <div style="text-align: center;margin-top: 10px;">
- <link type="text/css" media="all" href="https://a-oss.zmki.cn/20190606/love.css" rel="stylesheet">
- <img src="https://cravatar.cn/avatar/08f9cdacb83a984411a94b60fddfbdcd?s=&d=mm&r=g"
- style="width: 50px;height: 50px;vertical-align: -20px;border-radius: 50%;margin-right: 5px;margin-bottom: 5px;-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.1), 1px 1px 1px rgba(0,0,0,0.1), 1px 1px 1px rgba(0,0,0,0.1);box-shadow: 1px 1px 1px rgba(0,0,0,.1), 1px 1px 1px rgba(0,0,0,0.1), 1px 1px 1px rgba(0,0,0,0.1);border: 2px solid #fff;">
- <svg viewBox="0 0 1024 1024" style="margin-left: 5px;margin-right: 5px;" version="1.0" width="15" height="15"
- class="my-face">
- <path
- d="M863.597631 513.574282l-271.33965-140.213484L729.783667 81.926656c3.583731-7.87141 7.167462-15.742819 7.167462-25.214109C736.887134 25.226908 708.345275 0.012799 672.635953 0.012799a63.611229 63.611229 0 0 0-39.293053 12.607055c-1.791866 1.59988-3.519736 3.19976-5.311602 3.19976L147.87531 418.925381a55.547834 55.547834 0 0 0-19.646527 47.356448c1.791866 17.278704 14.27093 33.021523 32.125591 42.492813l271.33965 141.749369L292.504463 945.221908c-12.479064 25.214109-1.791866 53.563983 23.166262 69.306802 10.751194 6.335525 23.230258 9.47129 35.709322 9.47129 16.062795 0 32.125591-4.735645 44.604655-15.742819l480.091993-403.297753a55.547834 55.547834 0 0 0 19.646526-47.228458 61.243407 61.243407 0 0 0-32.12559-44.156688z"
- fill="#515151"></path>
- </svg>
+<body>
+ <div style="text-align: center;margin-top: 10px;">
+ <link type="text/css" media="all" href="https://a-oss.zmki.cn/20190606/love.css" rel="stylesheet">
+ <img src="https://cravatar.cn/avatar/08f9cdacb83a984411a94b60fddfbdcd?s=&d=mm&r=g"
+ style="width: 50px;height: 50px;vertical-align: -20px;border-radius: 50%;margin-right: 5px;margin-bottom: 5px;-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.1), 1px 1px 1px rgba(0,0,0,0.1), 1px 1px 1px rgba(0,0,0,0.1);box-shadow: 1px 1px 1px rgba(0,0,0,.1), 1px 1px 1px rgba(0,0,0,0.1), 1px 1px 1px rgba(0,0,0,0.1);border: 2px solid #fff;">
+ <svg viewBox="0 0 1024 1024" style="margin-left: 5px;margin-right: 5px;" version="1.0" width="15" height="15"
+ class="my-face">
+ <path
+ d="M863.597631 513.574282l-271.33965-140.213484L729.783667 81.926656c3.583731-7.87141 7.167462-15.742819 7.167462-25.214109C736.887134 25.226908 708.345275 0.012799 672.635953 0.012799a63.611229 63.611229 0 0 0-39.293053 12.607055c-1.791866 1.59988-3.519736 3.19976-5.311602 3.19976L147.87531 418.925381a55.547834 55.547834 0 0 0-19.646527 47.356448c1.791866 17.278704 14.27093 33.021523 32.125591 42.492813l271.33965 141.749369L292.504463 945.221908c-12.479064 25.214109-1.791866 53.563983 23.166262 69.306802 10.751194 6.335525 23.230258 9.47129 35.709322 9.47129 16.062795 0 32.125591-4.735645 44.604655-15.742819l480.091993-403.297753a55.547834 55.547834 0 0 0 19.646526-47.228458 61.243407 61.243407 0 0 0-32.12559-44.156688z"
+ fill="#515151"></path>
+ </svg>
- <img src="https://cravatar.cn/avatar/08f9cdacb83a984411a94b60fddfbdcd?s=&d=mm&r=g"
- style="width: 50px;height: 50px;vertical-align: -20px;border-radius: 50%;margin-left: 5px;margin-bottom: 5px;-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.1), 1px 1px 1px rgba(0,0,0,0.1), 1px 1px 1px rgba(0,0,0,0.1);box-shadow: 1px 1px 1px rgba(0,0,0,.1), 1px 1px 1px rgba(0,0,0,0.1), 1px 1px 1px rgba(0,0,0,0.1);border: 2px solid #fff;"><br>
+ <img src="https://cravatar.cn/avatar/08f9cdacb83a984411a94b60fddfbdcd?s=&d=mm&r=g"
+ style="width: 50px;height: 50px;vertical-align: -20px;border-radius: 50%;margin-left: 5px;margin-bottom: 5px;-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.1), 1px 1px 1px rgba(0,0,0,0.1), 1px 1px 1px rgba(0,0,0,0.1);box-shadow: 1px 1px 1px rgba(0,0,0,.1), 1px 1px 1px rgba(0,0,0,0.1), 1px 1px 1px rgba(0,0,0,0.1);border: 2px solid #fff;"><br>
- <span id="htmer_time"> <span class="zmki_love_ah"></span></span>
- </div>
- <script type="text/javascript" language="javascript">function setTime() {
- var create_time = Math.round(new Date(Date.UTC(2019, 12, 28, 6, 45, 0)).getTime() / 1000);
- var timestamp = Math.round((new Date().getTime() + 8 * 60 * 60 * 1000) / 1000);
- currentTime = secondToDate((timestamp - create_time));
- currentTimeHtml = ' <span class="zmki_love_ah">已经在一起</span><br>' +
- currentTime[0] +
- "年 " +
- currentTime[1] +
- " 天 " +
- currentTime[2] +
- " 时 ";
- document.getElementById("htmer_time").innerHTML = currentTimeHtml;
- }
- function secondToDate(second) {
- if (!second) {
- return 0;
- }
- var time = new Array(0, 0, 0, 0, 0);
- if (second >= 365 * 24 * 3600) {
- time[0] = parseInt(second / (365 * 24 * 3600));
- second %= 365 * 24 * 3600;
- }
- if (second >= 24 * 3600) {
- time[1] = parseInt(second / (24 * 3600));
- second %= 24 * 3600;
- }
- if (second >= 3600) {
- time[2] = parseInt(second / 3600);
- second %= 3600;
- }
- if (second >= 60) {
- time[3] = parseInt(second / 60);
- second %= 60;
- }
- if (second > 0) {
- time[4] = second;
- }
- return time;
- }
- setInterval(setTime, 1000);
- </script>
-</body>
+ <span id="htmer_time"> <span class="zmki_love_ah"></span></span>
+ </div>
+ <script type="text/javascript" language="javascript">function setTime() {
+ var create_time = Math.round(new Date(Date.UTC(2019, 12, 28, 6, 45, 0)).getTime() / 1000);
+ var timestamp = Math.round((new Date().getTime() + 8 * 60 * 60 * 1000) / 1000);
+ currentTime = secondToDate((timestamp - create_time));
+ currentTimeHtml = ' <span class="zmki_love_ah">已经在一起</span><br>' +
+ currentTime[0] +
+ "年 " +
+ currentTime[1] +
+ " 天 " +
+ currentTime[2] +
+ " 时 ";
+ document.getElementById("htmer_time").innerHTML = currentTimeHtml;
+ }
+ function secondToDate(second) {
+ if (!second) {
+ return 0;
+ }
+ var time = new Array(0, 0, 0, 0, 0);
+ if (second >= 365 * 24 * 3600) {
+ time[0] = parseInt(second / (365 * 24 * 3600));
+ second %= 365 * 24 * 3600;
+ }
+ if (second >= 24 * 3600) {
+ time[1] = parseInt(second / (24 * 3600));
+ second %= 24 * 3600;
+ }
+ if (second >= 3600) {
+ time[2] = parseInt(second / 3600);
+ second %= 3600;
+ }
+ if (second >= 60) {
+ time[3] = parseInt(second / 60);
+ second %= 60;
+ }
+ if (second > 0) {
+ time[4] = second;
+ }
+ return time;
+ }
+ setInterval(setTime, 1000);
+ </script>
+</body>
然后就可以了，效果就是我上面展示的第一个效果图，这个方法不建议
主要是因为这个小工具的自带的css样式会，跟主题的css冲突，结果会像我这样的，哈哈哈
@@ -1337,7 +1337,7 @@ https://docs.rsshub.app/bbs.html#a-dao-ni-ming-ban
演示页面：https://zql.im/love.html
然后修改相应的东西改为你自己的就好了，然后找到主题的合适位置放入iframe标签
- <iframe src="这里放置你的网页" width="204" height="120" frameborder="0" scrolling="No" align="center"><span data-mce-type="bookmark" style="display: inline-block; width: 0px; overflow: hidden; line-height: 0;" class="mce_SELRES_start"></span></iframe>
+ <iframe src="这里放置你的网页" width="204" height="120" frameborder="0" scrolling="No" align="center"><span data-mce-type="bookmark" style="display: inline-block; width: 0px; overflow: hidden; line-height: 0;" class="mce_SELRES_start"></span></iframe>
这里可能需要一点css基础，如果你不会，可以在文章的评论区留言，我有空可以帮你看看
你为什么不在你的博客放这个小工具呢
这个嘛，前提是我得有个女朋友先，折腾来折腾去，才恍然大悟自己还是个单身汪，没想到小丑居然是我自己
@@ -1395,56 +1395,56 @@ https://docs.rsshub.app/bbs.html#a-dao-ni-ming-ban
WordPress的接入方法
只需要将以下代码
加入你的插件或主题的 functions.php 里即可
-if ( ! function_exists( 'get_cravatar_url' ) ) {
+if ( ! function_exists( 'get_cravatar_url' ) ) {
- function get_cravatar_url( $url ) {
- $sources = array(
- 'www.gravatar.com',
- '0.gravatar.com',
- '1.gravatar.com',
- '2.gravatar.com',
- 'secure.gravatar.com',
- 'cn.gravatar.com',
- 'gravatar.com',
- );
+ function get_cravatar_url( $url ) {
+ $sources = array(
+ 'www.gravatar.com',
+ '0.gravatar.com',
+ '1.gravatar.com',
+ '2.gravatar.com',
+ 'secure.gravatar.com',
+ 'cn.gravatar.com',
+ 'gravatar.com',
+ );
- return str_replace( $sources, 'cravatar.cn', $url );
- }
+ return str_replace( $sources, 'cravatar.cn', $url );
+ }
- add_filter( 'um_user_avatar_url_filter', 'get_cravatar_url', 1 );
- add_filter( 'bp_gravatar_url', 'get_cravatar_url', 1 );
- add_filter( 'get_avatar_url', 'get_cravatar_url', 1 );
-}
+ add_filter( 'um_user_avatar_url_filter', 'get_cravatar_url', 1 );
+ add_filter( 'bp_gravatar_url', 'get_cravatar_url', 1 );
+ add_filter( 'get_avatar_url', 'get_cravatar_url', 1 );
+}
-if ( ! function_exists( 'set_defaults_for_cravatar' ) ) {
- /**
- * 替换 WordPress 讨论设置中的默认头像
- */
- function set_defaults_for_cravatar( $avatar_defaults ) {
- $avatar_defaults['gravatar_default'] = 'Cravatar 标志';
+if ( ! function_exists( 'set_defaults_for_cravatar' ) ) {
+ /**
+ * 替换 WordPress 讨论设置中的默认头像
+ */
+ function set_defaults_for_cravatar( $avatar_defaults ) {
+ $avatar_defaults['gravatar_default'] = 'Cravatar 标志';
- return $avatar_defaults;
- }
+ return $avatar_defaults;
+ }
- add_filter( 'avatar_defaults', 'set_defaults_for_cravatar', 1 );
-}
+ add_filter( 'avatar_defaults', 'set_defaults_for_cravatar', 1 );
+}
-if ( ! function_exists( 'set_user_profile_picture_for_cravatar' ) ) {
- /**
- * 替换个人资料卡中的头像上传地址
- */
- function set_user_profile_picture_for_cravatar() {
- return '<a href="https://cravatar.cn" target="_blank">您可以在 Cravatar 修改您的资料图片</a>';
- }
+if ( ! function_exists( 'set_user_profile_picture_for_cravatar' ) ) {
+ /**
+ * 替换个人资料卡中的头像上传地址
+ */
+ function set_user_profile_picture_for_cravatar() {
+ return '<a href="https://cravatar.cn" target="_blank">您可以在 Cravatar 修改您的资料图片</a>';
+ }
- add_filter( 'user_profile_picture_description', 'set_user_profile_picture_for_cravatar', 1 );
-}
+ add_filter( 'user_profile_picture_description', 'set_user_profile_picture_for_cravatar', 1 );
+}
但是要注意的是7b2，日主题，子比主题主题作者已经摒弃了Gravatar头像
使用的自己的头像方案，所以无法支持Cravatar头像
typecho的接入方法
我们主要是对官方的Gravatar换源，这个很简单
找到自己的博客程序的根目录，将以下代码加到站点根目录的 config.inc.php 中即可
-define('__TYPECHO_GRAVATAR_PREFIX__', 'https://cravatar.cn/avatar/');
+define('__TYPECHO_GRAVATAR_PREFIX__', 'https://cravatar.cn/avatar/');
Cravatar官网地址
@@ -1539,7 +1539,7 @@ https://www.xiaoz.me/archives/14666
>
https://www.upyun.com/league
又拍云联盟需要在网站下面加入又拍云的logo，你想用我弄好的样式，可以复制下面我做的样式，自己放在自己网站的合适地方即可
- <div align="left"><a href="https://www.upyun.com/?utm_source=lianmeng&utm_medium=referral"><img src="https://img.52ql.cn/img/169" width="249px" height="400px"/></a></div>
+ <div align="left"><a href="https://www.upyun.com/?utm_source=lianmeng&utm_medium=referral"><img src="https://img.52ql.cn/img/169" width="249px" height="400px"/></a></div>
然后提交申请加入又拍云联盟即可，审核小姐姐真的很给力，基本上两个小时就给你通过申请了
![]()
@@ -1579,7 +1579,7 @@ https://www.upyun.com/league
这个我想潘先生已经体会到了，哈哈哈，这个设置其实很简单，安装下面我的配置设置即可
![]()
-1.https://usj.cc/admin/login.php?referer=https%3A%2F%2Fusj.cc%2Fadmin%2Fwelcome.php
+1.https://usj.cc/admin/login.php?referer=https%3A%2F%2Fusj.cc%2Fadmin%2Fwelcome.php
2.域名后方会带有?referer=请求
3.referer=https%3A%2F%2Fusj.cc%2Fadmin%2Fwelcome.php
4.中间是域名 后面是后台路径
@@ -1612,7 +1612,7 @@ https://www.upyun.com/league
我们可禁止一些大量抓取网站或者恶意抓取/镜像我们网站的常见爬虫访问
这样可以节省一部分流量。可通过「访问控制」→「User-Agent 防盗链」设置，例如以下常见的 User Agent：
[reply]
-FeedDemon 内容采集
+FeedDemon 内容采集
BOT/0.1 (BOT for JCE) sql注入
CrawlDaddy sql注入
Java 内容采集
@@ -1671,20 +1671,20 @@ https://www.upyun.com/league
![]()
图片显示的代码是我修改之后的，你只需要将
-return preg_match("/screenshot\.(jpg|png|gif|bmp|jpeg)/i",path);
+return preg_match("/screenshot\.(jpg|png|gif|bmp|jpeg)/i",path);
改为
-return preg_match("/screenshot\.(jpg|png|gif|bmp|jpeg|webp)/i",path);
+return preg_match("/screenshot\.(jpg|png|gif|bmp|jpeg|webp)/i",path);
然后找到
typecho的var/Widget/Abstract/Contents.php
差不多是686行
![]()
然后将
-$value['attachment']->isImage = in_array($content['type'], array('jpg', 'jpeg', 'gif', 'png', 'tiff', 'bmp'));
+$value['attachment']->isImage = in_array($content['type'], array('jpg', 'jpeg', 'gif', 'png', 'tiff', 'bmp'));
改为
-$value['attachment']->isImage = in_array($content['type'], array('jpg', 'jpeg', 'gif', 'png', 'tiff', 'bmp', 'webp'));
+$value['attachment']->isImage = in_array($content['type'], array('jpg', 'jpeg', 'gif', 'png', 'tiff', 'bmp', 'webp'));
然后找到var/Typecho/Common.php，差不多是1399行，我们这里多加一行代码
-'webp' => 'image/webp',
+'webp' => 'image/webp',
然后去typecho的后台，找到设置-基本，这个地方在其他文件加入webp，然后博客就可以完美支持webp格式图片了
![]()
@@ -1734,7 +1734,7 @@ https://squoosh.app
让WordPress支持webp格式图片
因为我之前使用的博客系统是WordPress，当然也有让WordPress支持webp格式图片的方法
直接在自己的主题文件的function.php里面加入下面代码即可完美支持webp格式图片
-//下方一段为webp格式图片支持代码 function bzg_filter_mime_types( $array ) { $array['webp'] = 'image/webp'; return $array; } add_filter( 'mime_types', 'bzg_filter_mime_types', 10, 1 );
+//下方一段为webp格式图片支持代码 function bzg_filter_mime_types( $array ) { $array['webp'] = 'image/webp'; return $array; } add_filter( 'mime_types', 'bzg_filter_mime_types', 10, 1 );
//下方为webp格式图片在媒体库预览图像支持代码 function bzg_file_is_displayable_image($result, $path) { $info = @getimagesize( $path ); if($info['mime'] == 'image/webp') { $result = true; } return $result; } add_filter( 'file_is_displayable_image', 'bzg_file_is_displayable_image', 10, 2 );
基本上就分享这么多，晚安，我的朋友们
]]>
@@ -1768,32 +1768,32 @@ https://github.com/Xcnte/Code-Prettify-for-typecho
![]()
在主题的自定义css下面加入以下代码
-#post-content pre code {
- display:block;
- overflow-x:auto;
- position:relative;
- margin:0;
- padding-left:50px;
-}
-pre code {
- position:relative;
- display:block;
- overflow-x:auto;
- margin:4.4px 0.px .4px 1px;
- padding:0;
- max-height:500px;
- padding-left:3.5em
-}
+#post-content pre code {
+ display:block;
+ overflow-x:auto;
+ position:relative;
+ margin:0;
+ padding-left:50px;
+}
+pre code {
+ position:relative;
+ display:block;
+ overflow-x:auto;
+ margin:4.4px 0.px .4px 1px;
+ padding:0;
+ max-height:500px;
+ padding-left:3.5em
+}
在Twitter主题找到pjax开始执行的js代码
![]()
在主题的这个地方加入下面的代码在主题的相应位置
-if (typeof Prism !== 'undefined') {
-var pres = document.getElementsByTagName('pre');
- for (var i = 0; i < pres.length; i++){
- if (pres[i].getElementsByTagName('code').length > 0)
- pres[i].className = 'line-numbers';}
-Prism.highlightAll(true,null);}
+if (typeof Prism !== 'undefined') {
+var pres = document.getElementsByTagName('pre');
+ for (var i = 0; i < pres.length; i++){
+ if (pres[i].getElementsByTagName('code').length > 0)
+ pres[i].className = 'line-numbers';}
+Prism.highlightAll(true,null);}
每次我们要写文章的时候我们只用按照下面那种格式就可以啦
![]()
@@ -1817,44 +1817,44 @@ https://github.com/Xcnte/Code-Prettify-for-typecho
![]()
教程开始
首先找到自己主题文件的 functions.php 中加入以下代码
-/*
-* 加载时间
-* @return bool
-*/
-function timer_start() {
-global $timestart;
-$mtime = explode( ' ', microtime() );
-$timestart = $mtime[1] + $mtime[0];
-return true;
-}
-timer_start();
-function timer_stop( $display = 0, $precision = 3 ) {
-global $timestart, $timeend;
-$mtime = explode( ' ', microtime() );
-$timeend = $mtime[1] + $mtime[0];
-$timetotal = number_format( $timeend - $timestart, $precision );
-$r = $timetotal < 1 ? $timetotal * 1000 . " ms" : $timetotal . " s";
-if ( $display ) {
- echo $r;
-}
-return $r;}`
+/*
+* 加载时间
+* @return bool
+*/
+function timer_start() {
+global $timestart;
+$mtime = explode( ' ', microtime() );
+$timestart = $mtime[1] + $mtime[0];
+return true;
+}
+timer_start();
+function timer_stop( $display = 0, $precision = 3 ) {
+global $timestart, $timeend;
+$mtime = explode( ' ', microtime() );
+$timeend = $mtime[1] + $mtime[0];
+$timetotal = number_format( $timeend - $timestart, $precision );
+$r = $timetotal < 1 ? $timetotal * 1000 . " ms" : $timetotal . " s";
+if ( $display ) {
+ echo $r;
+}
+return $r;}`
这个是加载耗时的代码，下面一并加上访问总量的代码
同样也是加在functions.php 的文件里
- //总访问量
- function theAllViews()
- {
- $db = Typecho_Db::get();
- $row = $db->fetchAll('SELECT SUM(VIEWS) FROM `typecho_contents`');
- echo number_format($row[0]['SUM(VIEWS)']);
- }
+ //总访问量
+ function theAllViews()
+ {
+ $db = Typecho_Db::get();
+ $row = $db->fetchAll('SELECT SUM(VIEWS) FROM `typecho_contents`');
+ echo number_format($row[0]['SUM(VIEWS)']);
+ }
由于我使用的是油油作者的Twitter主题，所以我给大家介绍
Twitter主题应该修改那个位置，其他主题请自己调试
首先找到主题目录的important/sidebar.php文件
大概在118行左右你把相应代码加到自己想要加的位置
添加加载耗时功能，请加下面代码在相应位置
-<div class="widget-list">加载耗时：<?php echo timer_stop();?></div>
+<div class="widget-list">加载耗时：<?php echo timer_stop();?></div>
添加访问总量功能，请加下面代码在相应位置
-<div class="widget-list">访问总量：<?php echo theAllViews();?>次</div>
+<div class="widget-list">访问总量：<?php echo theAllViews();?>次</div>
感谢您的访问，转载请注明出处
]]>
diff --git a/public/categories/生活/rss.xml b/public/categories/生活/rss.xml
index 32570ebf..0fc6c6f6 100644
--- a/public/categories/生活/rss.xml
+++ b/public/categories/生活/rss.xml
@@ -36,125 +36,125 @@ https://github.com/itorr/sakana 「Sakana!」石蒜模拟器
快速食用
考虑到很多小伙伴也需要，这里把代码梳理一下 发出来
将以下css加入主题的标签的标签里
-.sakana-box-l,
-.sakana-box-r {
- position: fixed !important;
- inset: auto auto -1rem -5rem;
- z-index: 555;
-}
+.sakana-box-l,
+.sakana-box-r {
+ position: fixed !important;
+ inset: auto auto -1rem -5rem;
+ z-index: 555;
+}
-.sakana-box-r {
- inset: auto -5rem -1rem auto;
-}
+.sakana-box-r {
+ inset: auto -5rem -1rem auto;
+}
-@media (max-width: 650px) {
- .sakana-box-l,
- .sakana-box-r {
- display: none;
- }
-}
+@media (max-width: 650px) {
+ .sakana-box-l,
+ .sakana-box-r {
+ display: none;
+ }
+}
-@media (max-width: 1120px) {
- .sakana-box-l,
- .sakana-box-r {
- transform: translateY(0px) scale(0.25) !important;
- }
+@media (max-width: 1120px) {
+ .sakana-box-l,
+ .sakana-box-r {
+ transform: translateY(0px) scale(0.25) !important;
+ }
- .sakana-box-l {
- inset: auto auto -1rem -10rem;
- }
+ .sakana-box-l {
+ inset: auto auto -1rem -10rem;
+ }
- .sakana-box-r {
- inset: auto -10rem -1rem auto;
- }
-}
+ .sakana-box-r {
+ inset: auto -10rem -1rem auto;
+ }
+}
-.sakana-box {
- width: 500px;
- height: 800px;
- position: relative;
- transform-origin: 50% 100%;
- pointer-events: none;
-}
+.sakana-box {
+ width: 500px;
+ height: 800px;
+ position: relative;
+ transform-origin: 50% 100%;
+ pointer-events: none;
+}
-.sakana-box canvas {
- position: absolute;
- left: 0;
- right: 0;
- bottom: 0;
- pointer-events: none;
-}
+.sakana-box canvas {
+ position: absolute;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ pointer-events: none;
+}
-.sakana-box .sakana-character {
- width: 300px;
- height: 300px;
- position: absolute;
- left: 0;
- right: 0;
- margin: 0 auto;
- bottom: 260px;
- cursor: pointer;
- pointer-events: auto;
- transform-origin: 50% 400px;
- background: no-repeat 50% 50%;
- background-size: cover;
-}
+.sakana-box .sakana-character {
+ width: 300px;
+ height: 300px;
+ position: absolute;
+ left: 0;
+ right: 0;
+ margin: 0 auto;
+ bottom: 260px;
+ cursor: pointer;
+ pointer-events: auto;
+ transform-origin: 50% 400px;
+ background: no-repeat 50% 50%;
+ background-size: cover;
+}
-.sakana-box .sakana-character[data-character=chisato] {
- background-image: url(这里填写自定义摆件图片url)!important;
-}
+.sakana-box .sakana-character[data-character=chisato] {
+ background-image: url(这里填写自定义摆件图片url)!important;
+}
-.sakana-box .sakana-character[data-character=takina] {
- background-image: url(这里填写自定义摆件图片url)!important;
-}
+.sakana-box .sakana-character[data-character=takina] {
+ background-image: url(这里填写自定义摆件图片url)!important;
+}
-.sakana-box .sakana-bed {
- width: 160px;
- height: 20px;
- position: absolute;
- left: 0;
- right: 0;
- margin: 0 auto;
- bottom: 0;
- background: rgba(255, 255, 255, .5) no-repeat 50% 50%;
- border-radius: 2px;
- cursor: pointer;
- background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkAgMAAAANjH3HAAAACVBMVEUAAAAAAAAAAACDY+nAAAAAAnRSTlMAM8lDrC4AAAE2SURBVEjH7dVBjsMwCAVQiyUnGXG0OQXqsqdgif4pJ8YkTh1bnWqkWVRlkVR+BiHiJuUT7x3sKxGsBNBXhQBbiazF58LglXgTnwmi6EToqfBc2IvoKAWat/8Qu0g2JUYoV7EXhf4iD48JiFGKDkIAvA15EMEWmuXFuxAQSbuI9ZSIFEYXAMaAQpvAejGtC9aEugg8Mh1AxbieD7pAANi5HFqTnNLL0X4P0VYk92rKfZP4oSVlb/7uuWVvzZ/LDYPYSmD5nznG4ycR2FwI8BAbhQFUER9F4pGm9JbkkDqOQeAEY+QIu3gtGFJibt+7bCvQIiaeU4YeoiHYhB+EmtxgOZiTWJV7LHyl9ENVL8fO89l1AvwqjAi7SmmiF8kkn761o9hUOFOuUsh+9Q2w14WXQlo+8Z7xAxPfAJiIc7LIAAAAAElFTkSuQmCC);
- background-size: 20px 20px;
- box-shadow: 0 0 0 2px rgba(0, 0, 0, .05);
-}
+.sakana-box .sakana-bed {
+ width: 160px;
+ height: 20px;
+ position: absolute;
+ left: 0;
+ right: 0;
+ margin: 0 auto;
+ bottom: 0;
+ background: rgba(255, 255, 255, .5) no-repeat 50% 50%;
+ border-radius: 2px;
+ cursor: pointer;
+ background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkAgMAAAANjH3HAAAACVBMVEUAAAAAAAAAAACDY+nAAAAAAnRSTlMAM8lDrC4AAAE2SURBVEjH7dVBjsMwCAVQiyUnGXG0OQXqsqdgif4pJ8YkTh1bnWqkWVRlkVR+BiHiJuUT7x3sKxGsBNBXhQBbiazF58LglXgTnwmi6EToqfBc2IvoKAWat/8Qu0g2JUYoV7EXhf4iD48JiFGKDkIAvA15EMEWmuXFuxAQSbuI9ZSIFEYXAMaAQpvAejGtC9aEugg8Mh1AxbieD7pAANi5HFqTnNLL0X4P0VYk92rKfZP4oSVlb/7uuWVvzZ/LDYPYSmD5nznG4ycR2FwI8BAbhQFUER9F4pGm9JbkkDqOQeAEY+QIu3gtGFJibt+7bCvQIiaeU4YeoiHYhB+EmtxgOZiTWJV7LHyl9ENVL8fO89l1AvwqjAi7SmmiF8kkn761o9hUOFOuUsh+9Q2w14WXQlo+8Z7xAxPfAJiIc7LIAAAAAElFTkSuQmCC);
+ background-size: 20px 20px;
+ box-shadow: 0 0 0 2px rgba(0, 0, 0, .05);
+}
-.sakana-box[data-can-switch-character=true] .sakana-bed {
- pointer-events: auto;
-}
+.sakana-box[data-can-switch-character=true] .sakana-bed {
+ pointer-events: auto;
+}
在footer底部引入js
-<script src="https://usj.cc/js/sakana.js"></script>
+<script src="https://usj.cc/js/sakana.js"></script>
在主题的自定义js进行插件初始化
- <script>
- Sakana.setMute(false);
- Sakana.init({
- el: '.sakana-box-l',
- scale: .9,
- character:'takina',
- canSwitchCharacter: false,
- inertia: 0.001,
- decay: 1
- });
-</script>
-<script>
- Sakana.setMute(false);
- Sakana.init({
- el: '.sakana-box-r',
- scale: .9,
- character:'chisato',
- canSwitchCharacter: false,
- inertia: 0.001,
- decay: 1
- });
-</script>
+ <script>
+ Sakana.setMute(false);
+ Sakana.init({
+ el: '.sakana-box-l',
+ scale: .9,
+ character:'takina',
+ canSwitchCharacter: false,
+ inertia: 0.001,
+ decay: 1
+ });
+</script>
+<script>
+ Sakana.setMute(false);
+ Sakana.init({
+ el: '.sakana-box-r',
+ scale: .9,
+ character:'chisato',
+ canSwitchCharacter: false,
+ inertia: 0.001,
+ decay: 1
+ });
+</script>
在你想展示的位置添加div标签
-<div class="sakana-box-l sakana-box" style="transform: translateY(0px) scale(0.5);"><canvas width="750" height="1200" style="width: 500px; height: 800px;"></canvas><div class="sakana-character" data-character="takina" style="transform: rotate(0.263216deg) translateX(0.263216px) translateY(14.4649px);"></div><div class="sakana-bed"></div></div>
-<div class="sakana-box-r sakana-box" style="transform: translateY(0px) scale(0.5);"><canvas width="750" height="1200" style="width: 500px; height: 800px;"></canvas><div class="sakana-character" data-character="chisato" style="transform: rotate(0.128919deg) translateX(0.128919px) translateY(0.334859px);"></div><div class="sakana-bed"></div></div>
+<div class="sakana-box-l sakana-box" style="transform: translateY(0px) scale(0.5);"><canvas width="750" height="1200" style="width: 500px; height: 800px;"></canvas><div class="sakana-character" data-character="takina" style="transform: rotate(0.263216deg) translateX(0.263216px) translateY(14.4649px);"></div><div class="sakana-bed"></div></div>
+<div class="sakana-box-r sakana-box" style="transform: translateY(0px) scale(0.5);"><canvas width="750" height="1200" style="width: 500px; height: 800px;"></canvas><div class="sakana-character" data-character="chisato" style="transform: rotate(0.128919deg) translateX(0.128919px) translateY(0.334859px);"></div><div class="sakana-bed"></div></div>
大功告成！
]]>
diff --git a/public/post/2/index.html b/public/post/2/index.html
index 2158aaa4..bb5c4293 100644
--- a/public/post/2/index.html
+++ b/public/post/2/index.html
@@ -84,44 +84,44 @@
![]()
教程开始
首先找到自己主题文件的 functions.php 中加入以下代码
-/*
-* 加载时间
-* @return bool
-*/
-function timer_start() {
-global $timestart;
-$mtime = explode( ' ', microtime() );
-$timestart = $mtime[1] + $mtime[0];
-return true;
-}
-timer_start();
-function timer_stop( $display = 0, $precision = 3 ) {
-global $timestart, $timeend;
-$mtime = explode( ' ', microtime() );
-$timeend = $mtime[1] + $mtime[0];
-$timetotal = number_format( $timeend - $timestart, $precision );
-$r = $timetotal < 1 ? $timetotal * 1000 . " ms" : $timetotal . " s";
-if ( $display ) {
- echo $r;
-}
-return $r;}`
+/*
+* 加载时间
+* @return bool
+*/
+function timer_start() {
+global $timestart;
+$mtime = explode( ' ', microtime() );
+$timestart = $mtime[1] + $mtime[0];
+return true;
+}
+timer_start();
+function timer_stop( $display = 0, $precision = 3 ) {
+global $timestart, $timeend;
+$mtime = explode( ' ', microtime() );
+$timeend = $mtime[1] + $mtime[0];
+$timetotal = number_format( $timeend - $timestart, $precision );
+$r = $timetotal < 1 ? $timetotal * 1000 . " ms" : $timetotal . " s";
+if ( $display ) {
+ echo $r;
+}
+return $r;}`
这个是加载耗时的代码，下面一并加上访问总量的代码
同样也是加在functions.php 的文件里
- //总访问量
- function theAllViews()
- {
- $db = Typecho_Db::get();
- $row = $db->fetchAll('SELECT SUM(VIEWS) FROM `typecho_contents`');
- echo number_format($row[0]['SUM(VIEWS)']);
- }
+ //总访问量
+ function theAllViews()
+ {
+ $db = Typecho_Db::get();
+ $row = $db->fetchAll('SELECT SUM(VIEWS) FROM `typecho_contents`');
+ echo number_format($row[0]['SUM(VIEWS)']);
+ }
由于我使用的是油油作者的Twitter主题，所以我给大家介绍
Twitter主题应该修改那个位置，其他主题请自己调试
首先找到主题目录的important/sidebar.php文件
大概在118行左右你把相应代码加到自己想要加的位置
添加加载耗时功能，请加下面代码在相应位置
-<div class="widget-list">加载耗时：<?php echo timer_stop();?></div>
+<div class="widget-list">加载耗时：<?php echo timer_stop();?></div>
添加访问总量功能，请加下面代码在相应位置
-<div class="widget-list">访问总量：<?php echo theAllViews();?>次</div>
+<div class="widget-list">访问总量：<?php echo theAllViews();?>次</div>
感谢您的访问，转载请注明出处
diff --git a/public/post/20/index.html b/public/post/20/index.html
index 85b432af..8673d129 100644
--- a/public/post/20/index.html
+++ b/public/post/20/index.html
@@ -91,20 +91,20 @@
![]()
图片显示的代码是我修改之后的，你只需要将
-return preg_match("/screenshot\.(jpg|png|gif|bmp|jpeg)/i",path);
+return preg_match("/screenshot\.(jpg|png|gif|bmp|jpeg)/i",path);
改为
-return preg_match("/screenshot\.(jpg|png|gif|bmp|jpeg|webp)/i",path);
+return preg_match("/screenshot\.(jpg|png|gif|bmp|jpeg|webp)/i",path);
然后找到
typecho的var/Widget/Abstract/Contents.php
差不多是686行
![]()
然后将
-$value['attachment']->isImage = in_array($content['type'], array('jpg', 'jpeg', 'gif', 'png', 'tiff', 'bmp'));
+$value['attachment']->isImage = in_array($content['type'], array('jpg', 'jpeg', 'gif', 'png', 'tiff', 'bmp'));
改为
-$value['attachment']->isImage = in_array($content['type'], array('jpg', 'jpeg', 'gif', 'png', 'tiff', 'bmp', 'webp'));
+$value['attachment']->isImage = in_array($content['type'], array('jpg', 'jpeg', 'gif', 'png', 'tiff', 'bmp', 'webp'));
然后找到var/Typecho/Common.php，差不多是1399行，我们这里多加一行代码
-'webp' => 'image/webp',
+'webp' => 'image/webp',
然后去typecho的后台，找到设置-基本，这个地方在其他文件加入webp，然后博客就可以完美支持webp格式图片了
![]()
@@ -154,7 +154,7 @@ https://squoosh.app
让WordPress支持webp格式图片
因为我之前使用的博客系统是WordPress，当然也有让WordPress支持webp格式图片的方法
直接在自己的主题文件的function.php里面加入下面代码即可完美支持webp格式图片
-//下方一段为webp格式图片支持代码 function bzg_filter_mime_types( $array ) { $array['webp'] = 'image/webp'; return $array; } add_filter( 'mime_types', 'bzg_filter_mime_types', 10, 1 );
+//下方一段为webp格式图片支持代码 function bzg_filter_mime_types( $array ) { $array['webp'] = 'image/webp'; return $array; } add_filter( 'mime_types', 'bzg_filter_mime_types', 10, 1 );
//下方为webp格式图片在媒体库预览图像支持代码 function bzg_file_is_displayable_image($result, $path) { $info = @getimagesize( $path ); if($info['mime'] == 'image/webp') { $result = true; } return $result; } add_filter( 'file_is_displayable_image', 'bzg_file_is_displayable_image', 10, 2 );
基本上就分享这么多，晚安，我的朋友们
diff --git a/public/post/21/index.html b/public/post/21/index.html
index 1aca9a7b..198aadc8 100644
--- a/public/post/21/index.html
+++ b/public/post/21/index.html
@@ -129,7 +129,7 @@ https://www.xiaoz.me/archives/14666
>
https://www.upyun.com/league
又拍云联盟需要在网站下面加入又拍云的logo，你想用我弄好的样式，可以复制下面我做的样式，自己放在自己网站的合适地方即可
- <div align="left"><a href="https://www.upyun.com/?utm_source=lianmeng&utm_medium=referral"><img src="https://img.52ql.cn/img/169" width="249px" height="400px"/></a></div>
+ <div align="left"><a href="https://www.upyun.com/?utm_source=lianmeng&utm_medium=referral"><img src="https://img.52ql.cn/img/169" width="249px" height="400px"/></a></div>
然后提交申请加入又拍云联盟即可，审核小姐姐真的很给力，基本上两个小时就给你通过申请了
![]()
@@ -169,7 +169,7 @@ https://www.upyun.com/league
这个我想潘先生已经体会到了，哈哈哈，这个设置其实很简单，安装下面我的配置设置即可
![]()
-1.https://usj.cc/admin/login.php?referer=https%3A%2F%2Fusj.cc%2Fadmin%2Fwelcome.php
+1.https://usj.cc/admin/login.php?referer=https%3A%2F%2Fusj.cc%2Fadmin%2Fwelcome.php
2.域名后方会带有?referer=请求
3.referer=https%3A%2F%2Fusj.cc%2Fadmin%2Fwelcome.php
4.中间是域名 后面是后台路径
@@ -202,7 +202,7 @@ https://www.upyun.com/league
我们可禁止一些大量抓取网站或者恶意抓取/镜像我们网站的常见爬虫访问
这样可以节省一部分流量。可通过「访问控制」→「User-Agent 防盗链」设置，例如以下常见的 User Agent：
[reply]
-FeedDemon 内容采集
+FeedDemon 内容采集
BOT/0.1 (BOT for JCE) sql注入
CrawlDaddy sql注入
Java 内容采集
diff --git a/public/post/28/index.html b/public/post/28/index.html
index caec1fc2..52cc873d 100644
--- a/public/post/28/index.html
+++ b/public/post/28/index.html
@@ -117,56 +117,56 @@
WordPress的接入方法
只需要将以下代码
加入你的插件或主题的 functions.php 里即可
-
