『教程』首页及文章页滚动广告栏 前言因为之前在很多网站上都能看到广告，虽然但是，这对很多博主来说也是一笔额外的收入，我一直是入不敷出！:@(吐血倒地) 然后我看到了执念博客的首页广告栏，虽然曝光确实大，但是用户体验极其不好，因为要翻很多广告才能翻到文章，就像这样：所以我就想到了滚动广告，一个广告的位置，能够显示多条广告成果展示{tabs}{tabs-pane label="首页"}{/tabs-pane}{tabs-pane label="文章页"}{/tabs-pane}{/tabs}教程开始灵感及相关代码来自于Joe主题的首页轮播图一、添加后台打开 functions.php 添加以下代码$JADPost = new Typecho_Widget_Helper_Form_Element_Textarea( 'JADPost', NULL, NULL, '文章页顶部广告', '介绍：用于设置文章页顶部广告 <br /> 格式：广告图片 || 跳转链接 （中间使用两个竖杠分隔）<br /> 注意：如果您只想显示图片不想跳转，可填写：广告图片 || javascript:void(0) <br /> 其他：一行一个，一行代表一个轮播广告图' ); $JADPost->setAttribute('class', 'joe_content joe_post'); $form->addInput($JADPost);这是文章页的代码，因为首页广告主题自带了二、添加滚动广告栏{tabs}{tabs-pane label="首页"} 因为首页已经有广告位了，所以直接替换就行了将主题 index.php 的以下代码直接替换为新代码{collapse}{collapse-item label="代码位置" open}{/collapse-item}{collapse-item label="新代码"}隐藏内容，请前往内页查看详情{/collapse-item}{/collapse}{/tabs-pane}{tabs-pane label="文章页"}文章页直接在主题的 post.php 文件内合适的地方加入以下代码{collapse}{collapse-item label="代码位置" open}{/collapse-item}{collapse-item label="代码"}隐藏内容，请前往内页查看详情{/collapse-item}{/collapse}{/tabs-pane}{/tabs}三、修改广告栏样式{tabs}{tabs-pane label="首页"} 直接在 Joe/assets/css 打开 joe.index.min.css 然后在最后添加以下代码.joe_index__ad .swiper-container{height: 180px!important;border-radius: var(--radius-inner);}.joe_index__ad .swiper-container .icon{position:absolute;z-index:1;top:10px;right:10px;font-size:12px;background:rgba(0,0,0,0.25);padding:2px 5px;border-radius:2px;color:#ebebeb;pointer-events:none}@media (max-width: 768px){.joe_index__ad .swiper-container{height: 120px!important}.joe_index__ad .swiper-container .image{height: 120px;object-fit: cover;border-radius: var(--radius-inner);}}{/tabs-pane}{tabs-pane label="文章页"}直接在 Joe/assets/css 打开 joe.post.min.css 然后在最后添加以下代码.joe_post__ad .swiper-container{height: 180px!important;margin-top:15px;border-radius: var(--radius-inner);}.joe_post__ad .swiper-container .icon{position:absolute;z-index:1;top:10px;right:10px;font-size:12px;background:rgba(0,0,0,0.25);padding:2px 5px;border-radius:2px;color:#ebebeb;pointer-events:none}@media (max-width: 768px){.joe_post__ad .swiper-container{height: 120px!important}.joe_post__ad .swiper-container .image{height: 120px;object-fit: cover;border-radius: var(--radius-inner);}}{/tabs-pane}{/tabs}四、添加滚动效果{tabs}{tabs-pane label="首页"}首页因为引入了滚动效果，所有不需要设置，会直接调用首页轮播图的滚动效果但是会根据首页轮播图的滚动方式滚动，效果不太好，暂时没想到比较好的解决方法{/tabs-pane}{tabs-pane label="文章页"}首先在主题的 post.php 文件内 标签内加入以下代码<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@5.4.5/css/swiper.min.css" /> <script src="https://cdn.jsdelivr.net/npm/swiper@5.4.5/js/swiper.min.js"></script>然后再在 Joe/assets/js 打开 joe.post_page.min.js 然后在最后添加以下代码if(0!==$(".joe_post__ad .swiper-container").length){let e="vertical";new Swiper(".swiper-container",{keyboard:!1,direction:e,loop:!0,autoplay:!0,mousewheel:!0,pagination:{el:".swiper-pagination"},})}添加位置{/tabs-pane}{/tabs}教程结束大功告成，快刷新你的网站看看效果吧！

好久不见之网站底部样式 好久不见之本站同款网站底部样式，效果见本站。1.修改footer.php首先，在页脚文件footer.php文件的最下面放入以下代码：隐藏内容，请前往内页查看详情2.修改include.php新增CSS样式，在/usr/themes/Joe/public/include.php的19-29行之间新增如下代码：<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/cy-j/chenyu@1.6.0/css/cydibu.min.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/cy-j/chenyu/css/bootstrap-grid.min.css">3.备注风风雨雨1年266天3小时23分，你是第45,355位相遇的小伙伴……这里的实现看这里：在core.php最下面添加//门前大路上，走过一群小伙伴，快来数一数：2，4，6，7，8…… function theAllViews() { $db = Typecho_Db::get(); $row = $db->fetchAll('SELECT SUM(VIEWS) FROM `typecho_contents`'); echo number_format($row[0]['SUM(VIEWS)']); }4.Joe主题Joe主题开启显示建站时间后，并配置好“网站访问量暨与小伙伴们的N次相遇”小伙伴。<p><a href="javascript:;" id="chenyutime">风风雨雨N年，你是第N位相遇的小伙伴</a></p>修改为： <p><?php if ($this->options->JBirthDay) : ?> <div class="item run"> <span>风风雨雨 <strong class="joe_run__day">00</strong> 天 <strong class="joe_run__hour">00</strong> 时 <strong class="joe_run__minute">00</strong> 分，你是第<?php echo theAllViews();?>位相遇的小伙伴</span> </div> <?php endif; ?> </p>修改好后，请删除原有的建站时间显示（第六行到第十行），不然会重复显示。 <?php if ($this->options->JBirthDay) : ?> <div class="item run"> <span>已运行 <strong class="joe_run__day">00</strong> 天 <strong class="joe_run__hour">00</strong> 时 <strong class="joe_run__minute">00</strong> 分 <strong class="joe_run__second">00</strong> 秒</span> </div> <?php endif; ?>{callout color="#ef6d4d"}转载来源： {abtn color="#ff0d00" href="https://chenyu.me/1422.html" content="醉书生"/}{/callout}

Typecho 添加悬挂猫 下载悬挂猫的js和css文件放到合适的目录文件下在后台底部自定义添加以下内容： <!-- 悬挂的喵 --> <script type="text/javascript" src="/usr/themes/Cuteen/xuanguamao/js/szgotop.js"></script> <link rel="stylesheet" type="text/css" href="/usr/themes/Cuteen/xuanguamao/css/szgotop.css" /> <div class="back-to-top cd-top faa-float animated cd-is-visible" style="top: -999px;"></div>{cloud title="点击下载" type="lz" url="https://wws.lanzoui.com/igGTilnyqih" password="i941"/}

Typecho生成海报(cuteen主题版） 废话不多说直接上教程原作者：https://www.moleft.cn/post-53.html插件：https://wws.lanzous.com/i1pXFlk2xhi隐藏内容，请前往内页查看详情安装说明（1）将插件上传到 /usr/plugins/，并重命名为 ArticlePoster（2）修改 post.php，在合适的位置加入挂载点<?php ArticlePoster_Plugin::button($this->cid); ?>（3）在后台插件设置填写好信息，一定要填自定义分享按钮样式，并且在 class 里面加入 [RainBowText]article-poster-button[/RainBowText]（4）如果你的模板没有引入 jquery 或者上述过程都设置好了点击按钮无响应，可以开启加载 jquery（5）修改图标部分可以找到 /usr/plugins/ArticlePoster/js/core.js，修改注释部分图标样式pjax 适配自 1.0.6 之后重新调整对于 pjax 的适配方案，如果主题有 pjax 回调可以直接填下以下代码 $('.article-poster-button').on('click',function(){ create_poster(); }); $('[data-event=\'poster-close\']').on('click', function(){ $('.article-poster, .poster-popover-mask, .poster-popover-box').fadeOut() }); $('[data-event=\'poster-download\']').on('click', function(){ download_poster(); });按照原作者写的应该是可以在后台pjax调用，但是Cuteen主题貌似没什么用 :@(想一想)其他主题就不知道了，所以我直接在 footer.php中直接添加了自定义按钮样式，在插件中添加 <button class="article-poster-button btn btn-outline-primary rounded-pill align-items-center d-inline-flex"><i class="fas fa-money-check"></i><span class="ml-1">下载海报</span></button>图标在头部引用 <link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/5.15.1/css/all.css" rel="stylesheet">最后修改一下

Typecho cuteen主题美化(未完待续~) {collapse}{collapse-item label="网站分享成卡片" open}在后台头部自定义或者在head.php内添加以下内容 <!-- QQCard BEGIN --> <meta itemprop="name" content="小白の博客"/> <meta itemprop="image" content="https://img.aiyo99.com/cdn/img/head.jpeg" /> <meta name="description" itemprop="description" content="我在等一个人..." /> <!-- QQCard END -->{/collapse-item}{collapse-item label="Typecho文章页添加百度收录检测 "}post.php合适的地方添加 <script> function baidu_check(){ var url= window.location.href $.getJSON("https://www.xiaobai666.top/usr/themes/Cuteen/baidu.php?domain="+url,function(result){ //调用api if (result.code == 200) { $('#baidu_icon').removeClass('glyphicon-refresh'); $('#baidu_icon').addClass('glyphicon-ok-circle'); $('#baidu_result').text('百度已收录'); }else if(result.code == 403){ $('#baidu_icon').removeClass('glyphicon-refresh'); $('#baidu_icon').addClass('glyphicon-info-sign'); /*$('#baidu_result').text('百度未收录');*/ $('#baidu_result').html('<a style="color:red;" rel="external nofollow" title="点击提交收录！" target="_bl ank" href="https://ziyuan.baidu.com/linksubmit/url?sitename='+url+'">百度未收录</a>'); }else{ $('#baidu_icon').removeClass('glyphicon-refresh'); $('#baidu_icon').addClass('glyphicon-remove-circle'); $('#baidu_result').text('查询收录失败'); } }); } baidu_check(); </script> 在的位置添加 <!--百度收录--> <span class="item"><i class="iconfont icon-liulanqi"></i></span><span class="meta-value" id="baidu_result">加载中</span> api代码 <?php /** * Baidu * @editer: Weifeng * @link: https://wfblog.net * @version: 1.0 */ error_reporting(0); header("Access-Control-Allow-Origin:*"); header('Content-type: application/json'); $domain = @$_GET['domain']; if(!isset($domain) || empty($domain) || $domain==''){ $data = array( "code" => false, "msg" => "未传入请求参数！" ); echo json_encode($data,JSON_UNESCAPED_UNICODE); exit; } if(substr($domain, -1) == '/'){ $domain = substr($domain,0,strlen($domain)-1); } $data = checkBaidu($domain); echo json_encode($data,JSON_UNESCAPED_UNICODE); function checkBaidu($url){ $header = array( "Host:www.baidu.com", "Content-Type:application/x-www-form-urlencoded",//post请求 "Connection: keep-alive", "Referer:https://www.baidu.com", "User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.162 Safari/537.36" ); $url = 'https://www.baidu.com/s?ie=UTF-8&wd='.urlencode($url).'&usm=3&rsv_idx=2&rsv_page=1'; $ch = curl_init(); curl_setopt($ch, CURLOPT_URL, $url); curl_setopt ($ch, CURLOPT_HTTPHEADER, $header); curl_setopt($ch, CURLOPT_FOLLOWLOCATION,1); curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); $output = curl_exec($ch); curl_close($ch); if(strpos($output, '没有找到') || strpos($output, '很抱歉')){ $data = array( "code" => 403, "msg" => "该域名暂时未被百度收录！" ); }else{ $number = GetBetween($output,'<span class="nums_text">百度为您找到相关结果约','个</span>'); if(empty($number) || $number == 0){ $number = GetBetween($output,'<b>找到相关结果数约','个</b></p>'); if(empty($number) || $number == 0){ $data = array( "code" => false, "msg" => "获取百度收录失败！" ); return $data; } } $data = array( "code" => 200, "msg" => "该域名已被百度收录！", "number" => str_replace(',','',$number) ); } return $data; } function GetBetween($content,$start,$end){ $r = explode($start, $content); if (isset($r[1])){ $r = explode($end, $r[1]); return $r[0]; } } ?> 其他主题在functions.php添加 //百度收录 function baidu_check() { $url = baidu_url(); $api = 'https://www.xiaobai666.top/usr/themes/Cuteen/baidu.php?domain='; //更改为你自己的API $result = json_decode(file_get_contents($api.$url)); if($result['code'] == 200){ echo '百度已收录'; }elseif($result['code'] == 403){ echo '<a style="color:red;" rel="external nofollow" title="点击提交收录" target="_blank" href="http://zhanzhang.baidu .com/sitesubmit/index?sitename='.$url.'">百度未收录</a>'; }else{ echo '查询收录失败'; } } function baidu_url(){ if((isset($_SERVER['HTTPS']) && $_SERVER['HTTPS'] == 'on') || (isset($_SERVER['HTTP_X_FORWARDED_PROTO']) && $_SERVER['HTT P_X_FORWARDED_PROTO'] == 'https')){ return 'https'.'://'.$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI']; }else{ return 'http'.'://'.$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI']; } } {/collapse-item}{/collapse}{collapse}{collapse-item label="添加天气" open}给你提供两个天气插件 和风天气：https://console.qweather.com/ 知心天气：https://www.seniverse.com/ 方法都是一样的，要去申请key,我这里用的是和风天气 1、注册账号之后创建应用，样式随意，我选择的是第二个简约版的，最后生成代码 ![和风天气][1] 在你想要显示的地方添加，如果和我一样，就直接在navbar.php中添加 WIDGET = { CONFIG: { "modules": "01234", "background": 5, "tmpColor": "4A4A4A", "tmpSize": 16, "cityColor": "4A4A4A", "citySize": 16, "aqiSize": 16, "weatherIconSize": 24, "alertIconSize": 18, "padding": "10px 10px 10px 10px", "shadow": "1", "language": "auto", "borderRadius": 5, "fixed": "false", "vertical": "middle", "horizontal": "center", "key": "ffd1921ae0494d26a77c34a5012b8ec9" } } </script> ![和风天气][2] 如果你网站开启了pjax会有小bug :@(尴尬) {/collapse-item}{collapse-item label="添加复制提醒"}没找到好看的复制提醒代码只能凑合用这个了,有好看的记得分享一下 :@(高兴) ,在头部引用 <script src="https://www.xiaobai666.top/usr/themes/Cuteen/static/layer/layer.js"></script> 在后台底部自定义添加 <script> document.addEventListener("copy",function(e){new Vue({data:function(){this.$notify({title:"复制成功",message:"若要转载请务必保留原文链接！",type:"success"});return{visible:false}}})}) </script>{/collapse-item}{/collapse}{collapse}{collapse-item label="Typecho添加评论邮件通知"" open} {anote icon="" href="https://www.aiyo99.com/archives/475.html" type="secondary" content="点击跳转"/} {/collapse-item}{collapse-item label="进站提示"} {anote icon="" href="https://www.aiyo99.com/archives/488.html" type="secondary" content="点击跳转"/} {/collapse-item}{/collapse}{collapse}{collapse-item label="添加网站运行时间和加载时间" open} {anote icon="" href="https://www.aiyo99.com/archives/476.html" type="secondary" content="点击跳转"/} {/collapse-item}{collapse-item label="添加访问量统计"}我这里用的是插件，当然你们也可以用代码插件：https://wws.lanzous.com/iVAPflj0zfa 密码:8x7v之后在后台启用，并在你想要显示的地方添加以下代码这个是访问统计 <p class="small"> <?php PageViews_Plugin::showPageViews(); ?> 这个是点击量 PageViews_Plugin::showPageViews('点击量','次');{/collapse-item}{/collapse}{collapse}{collapse-item label="添加在线人数统计" open}在functios.php最后添加 //在线人数 function online_users() { $filename='online.txt'; //数据文件 $cookiename='Nanlon_OnLineCount'; //Cookie名称 $onlinetime=30; //在线有效时间 $online=file($filename); $nowtime=$_SERVER['REQUEST_TIME']; $nowonline=array(); foreach($online as $line){ $row=explode('|',$line); $sesstime=trim($row[1]); if(($nowtime - $sesstime)<=$onlinetime){ $nowonline[$row[0]]=$sesstime; } } if(isset($_COOKIE[$cookiename])){ $uid=$_COOKIE[$cookiename]; }else{ $vid=0; do{ $vid++; $uid='U'.$vid; }while(array_key_exists($uid,$nowonline)); setcookie($cookiename,$uid); } $nowonline[$uid]=$nowtime; $total_online=count($nowonline); if($fp=@fopen($filename,'w')){ if(flock($fp,LOCK_EX)){ rewind($fp); foreach($nowonline as $fuid=>$ftime){ $fline=$fuid.'|'.$ftime."\n"; @fputs($fp,$fline); } flock($fp,LOCK_UN); fclose($fp); } } echo "$total_online"; } 在你想显示的地方添加，我这里添加在footer.php 在线人数: <?php echo online_users() ?>人{/collapse-item}{collapse-item label="网站添加灯笼"}有两个样式1、在后台底部自定义添加以下代码 <!-- 灯笼样式开始 --> <style> @media only screen and (max-width: 760px) { .deng-box, .deng-box1 { display:none; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .right { float: left!important; } } .deng-box { position: fixed; top: 20px; left: 10px; z-index: 3; } .deng-box1 { position: fixed; top: 20px; right: 10px; z-index: 3; } .deng-box1 .deng { position: relative; width: 120px; height: 90px; margin: 50px; background: #d8000f; background: rgba(216, 0, 15, 0.8); border-radius: 50% 50%; -webkit-transform-origin: 50% -100px; -webkit-animation: swing 5s infinite ease-in-out; box-shadow: -5px 5px 30px 4px rgba(252, 144, 61, 1); } .deng { position: relative; width: 120px; height: 90px; margin: 50px; background: #d8000f; background: rgba(216, 0, 15, 0.8); border-radius: 50% 50%; -webkit-transform-origin: 50% -100px; -webkit-animation: swing 3s infinite ease-in-out; box-shadow: -5px 5px 50px 4px rgba(250, 108, 0, 1); } .deng-a { width: 100px; height: 90px; background: #d8000f; background: rgba(216, 0, 15, 0.1); margin: 12px 8px 8px 10px; border-radius: 50% 50%; border: 2px solid #dc8f03; } .deng-b { width: 45px; height: 90px; background: #d8000f; background: rgba(216, 0, 15, 0.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; } .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: #ffa500; border-radius: 0 0 5px 5px; } .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: #ffa500; 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: #ffa500; background: linear-gradient(to right, #dc8f03, #ffa500, #dc8f03, #ffa500, #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: #ffa500; background: linear-gradient(to right, #dc8f03, #ffa500, #dc8f03, #ffa500, #dc8f03); } .deng-t { font-family: 华文行楷; font-size: 26px; color: #dc8f03; font-weight: bold; line-height: 44px; text-align: center; } .night .deng-t, .night .deng-box, .night .deng-box1 { background: transparent !important; } @-moz-keyframes swing { 0% { -moz-transform: rotate(-10deg) } 50% { -moz-transform: rotate(10deg) } 100% { -moz-transform: rotate(-10deg) } } @-webkit-keyframes swing { 0% { -webkit-transform: rotate(-10deg) } 50% { -webkit-transform: rotate(10deg) } 100% { -webkit-transform: rotate(-10deg) } } </style> <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-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> <!-- 元宵节灯笼样式结束 -->2、在底部自定义添加 <div class="dengl"> <div class="d-box"> <div class="d1"><span></span><span><p></p></span> <ul> <li></li> <li></li> <li><span></span></li> <li></li> <li></li> </ul> </div> <div class="d2"><span></span><span><p></p></span> <ul> <li></li> <li></li> <li><span></span></li> <li></li> <li></li> </ul> </div> </div> <div class="d-box1"> <div class="d1"><span></span><span><p></p></span> <ul> <li></li> <li></li> <li><span></span></li> <li></li> <li></li> </ul> </div> <div class="d2"><span></span><span><p></p></span> <ul> <li></li> <li></li> <li><span></span></li> <li></li> <li></li> </ul> </div> </div> </div>在头部自定义添加 <link rel="stylesheet" href="https://ku.gitcc.cn/cdn/css/lantern.css">本文灯笼样式参考：https://blog.fddmao.com/65.html{/collapse-item}{/collapse}{collapse}{collapse-item label="评论区添加背景" open}在自定义css中添加 /**评论区**/ #comment-textarea { background-image:url(https://img.aiyo99.com/cdn/img/plk.gif); background-size:contain; background-repeat:no-repeat; background-position:right bottom; transition:all 0.25s ease-in-out 0s; } textarea#comment-textarea:focus{ background-position-y:120px; transition:all 0.25s ease-in-out 0s; }{/collapse-item}{collapse-item label="头像旋转呼吸光环"}在自定义css中添加 /**头像旋转呼吸光环**/ .friends-img.mr-2.lazy.loaded:hover{ transform:rotate(360deg); } .comment-avatar:hover{ transform:rotate(360deg); } .sidebar-comment-avatar.mr-1:hover{ transform:rotate(360deg); } .friends-img.mr-2.lazy.loaded,.comment-avatar,.sidebar-comment-avatar.mr-1 { border-radius: 50%; animation: light 4s ease-in-out infinite; transition: all 0.5s; } @keyframes light { 0% { box-shadow: 0 0 4px #ff1354; } 25% { box-shadow: 0 0 16px #1ebbff; } 50% { box-shadow: 0 0 4px #0ed39f; } 75% { box-shadow: 0 0 16px #4fe7f4; } 100% { box-shadow: 0 0 4px #f35444; } }{/collapse-item}{/collapse}{collapse}{collapse-item label="图标跳动" open}在自定义css中添加 /*图标跳动*/ #like.btn.btn-outline-primary.rounded-pill.align-items-center.d-inline-flex,#headingMoney.btn.btn-outline-primary.rounded-pill.align-items-center.d-inline-flex { animation: star 0.5s ease-in-out infinite alternate; } @keyframes star { from { transform: scale(1); } to { transform: scale(1.1); } }{/collapse-item}{collapse-item label="评论添加@"}在functions.php中添加 //获取评论的锚点链接 function get_comment_at($coid) { $db = Typecho_Db::get(); $prow = $db->fetchRow($db->select('parent,status')->from('table.comments') ->where('coid = ?', $coid));//当前评论 $mail = ""; $parent = @$prow['parent']; if ($parent != "0") {//子评论 $arow = $db->fetchRow($db->select('author,status,mail')->from('table.comments') ->where('coid = ?', $parent));//查询该条评论的父评论的信息 @$author = @$arow['author'];//作者名称 $mail = @$arow['mail']; if(@$author && $arow['status'] == "approved"){//父评论作者存在且父评论已经审核通过 if (@$prow['status'] == "waiting"){ echo '<p class="commentReview">（评论审核中）)</p>'; } echo '<a href="#comment-' . $parent . '">@' . $author . '</a>'; }else{//父评论作者不存在或者父评论没有审核通过 if (@$prow['status'] == "waiting"){ echo '<p class="commentReview">（评论审核中）)</p>'; }else{ echo ''; } } } else {//母评论，无需输出锚点链接 if (@$prow['status'] == "waiting"){ echo '<p class="commentReview">（评论审核中）)</p>'; }else{ echo ''; } } }修改comment.php文件原内容 <div class="comment-content" data-expand="查看更多..."><p style="display: inline;"><?= Ctx::Comment($comments->content) ?></p> </div> 修改成 <div class="comment-content" data-expand="查看更多..."><?php $parentMail = get_comment_at($comments->coid)?><?php echo $parentMail;?><p style="display: inline;"><?= Ctx::Comment($comments->content) ?></p> </div>{/collapse-item}{/collapse}{collapse}{collapse-item label="右键美化" open}在footer.php中</body>前面添加 <style type="text/css"> a {text-decoration: none;} div.usercm{background-repeat:no-repeat;background-position:center center;background-size:cover;background-color:#fff;font -size:13px!important;width:130px;-moz-box-shadow:1px 1px 3px rgba (0,0,0,.3);box-shadow:0px 0px 15px #333;position:absolute;display:none;z-index:10000;opacity:0.9; border-radius: 8px;} div.usercm ul{list-style-type:none;list-style-position:outside;margin:0px;padding:0px;display:block} div.usercm ul li{margin:0px;padding:0px;line-height:35px;} div.usercm ul li a{color:#666;padding:0 15px;display:block} div.usercm ul li a:hover{color:#fff;background:rgba(170,222,18,0.88)} div.usercm ul li a i{margin-right:10px} a.disabled{color:#c8c8c8!important;cursor:not-allowed} a.disabled:hover{background-color:rgba(255,11,11,0)!important} div.usercm{background:#fff !important;} </style> <div class="usercm" style="left: 199px; top: 5px; display: none;"> <ul> <li><a href="https://www.xiaobai666.top/"><i class="fa fa-home fa-fw"></i><span>首页</span></a></li> <li><a href="javascript:void(0);" onclick="getSelect();"><i class="fa fa-copy fa-fw"></i><span>复制</span></a></li> <li><a href="javascript:history.go(1);"><i class="fa fa-arrow-right fa-fw"></i><span>前进</span></a></li> <li><a href="javascript:history.go(-1);"><i class="fa fa-arrow-left fa-fw"></i><span>后退</span></a></li> <li style="border-bottom:1px solid gray"><a href="javascript:window.location.reload();"><i class="fa fa-refresh fa-fw "></i><span>重载网页</span></a></li> <li><a href="https://www.xiaobai666.top/friend.html"><i class="fa fa-meh-o fa-fw"></i><span>友链</span></a></li> <li><a href="https://www.xiaobai666.top/33.html"><i class="fa fa-pencil-square-o fa-fw"></i><span>给我留言吧</span ></a></li> </ul> </div> <script type="text/javascript"> (function(a) { a.extend({ mouseMoveShow: function(b) { var d = 0, c = 0, h = 0, k = 0, e = 0, f = 0; a(window).mousemove(function(g) { d = a(window).width(); c = a(window).height(); h = g.clientX; k = g.clientY; e = g.pageX; f = g.pageY; h + a(b).width() >= d && (e = e - a(b).width() - 5); k + a(b).height() >= c && (f = f - a(b).height() - 5); a("html").on({ contextmenu: function(c) { 3 == c.which && a(b).css({ left: e, top: f }).show() }, click: function() { a(b).hide() } }) }) }, disabledContextMenu: function() { window.oncontextmenu = function() { return !1 } } }) })(jQuery); function getSelect() { "" == (window.getSelection ? window.getSelection() : document.selection.createRange().text) ? layer.msg("啊噢...你没> 还没选择文字呢！") : document.execCommand("Copy") } function baiduSearch() { var a = window.getSelection ? window.getSelection() : document.selection.createRange().text; "" == a ? layer.msg("啊噢...你没还没选择文字呢！") : window.open("https://www.baidu.com/s?wd=" + a) } $(function() { for (var a = navigator.userAgent, b = "Android;iPhone;SymbianOS;Windows Phone;iPad;iPod".split(";"), d = !0, c = 0; c < b.length; c++) if (0 < a.indexOf(b[c])) { d = !1; break } d && ($.mouseMoveShow(".usercm"), $.disabledContextMenu()) }); </script>{/collapse-item}{collapse-item label="动态标题"} 在后台底部自定义添加 <!--动态标题--> <script> //崩溃欺骗 var OriginTitle = document.title; var titleTime; document.addEventListener("visibilitychange", function () { if (document.hidden) { document.title = "╭(°A°)╮ 页面崩溃啦 ~"; clearTimeout(titleTime); } else { document.title = "(ฅ>ω<*ฅ) 噫又好了~" + OriginTitle; titleTime = setTimeout(function () { document.title = OriginTitle; }, 2000); } }); </script>{/collapse-item}{/collapse}{collapse}{collapse-item label="添加打字机效果" open}在任意位置添加,我在hero.php中</div>上面添加的 <script> var chakhsu = function(r) { function t() { return b[Math.floor(Math.random() * b.length)] } function e() { return String.fromCharCode(94 * Math.random() + 33) } function n(r) { for (var n = document.createDocumentFragment(), i = 0; r > i; i++) { var l = document.createElement("span"); l.textContent = e(), l.style.color = t(), n.appendChild(l) } return n } function i() { var t = o[c.skillI]; c.step ? c.step--:(c.step = g, c.prefixP < l.length ? (c.prefixP >= 0 && (c.text += l[c.prefixP]), c.prefixP++) : "forward" === c.direction ? c.skillP < t.length ? (c.text += t[c.skillP], c.skillP++) : c.delay ? c.delay--:(c.direction = "backward", c.delay = a) : c.skillP > 0 ? (c.text = c.text.slice(0, -1), c.skillP--) : (c.skillI = (c.skillI + 1) % o.length, c.direction = "forward")), r.textContent = c.text, r.appendChild(n(c.prefixP < l.length ? Math.min(s, s + c.prefixP) : Math.min(s, t.length - c.skillP))), setTimeout(i, d) } var l = "", o = ["Walk between the black and white.", ].map(function(r) { return r + "" }), a = 2, g = 1, s = 5, d = 75, b = ["rgb(110,64,170)", "rgb(150,61,179)", "rgb(191,60,175)", "rgb(228,65,157)", "rgb(254,75,131)", "rgb(255,94,99)", "rgb(255,120,71)", "rgb(251,150,51)", "rgb(226,183,47)", "rgb(198,214,60)", "rgb(175,240,91)", "rgb(127,246,88)", "rgb(82,246,103)", "rgb(48,239,130)", "rgb(29,223,163)", "rgb(26,199,194)", "rgb(35,171,216)", "rgb(54,140,225)", "rgb(76,110,219)", "rgb(96,84,200)"], c = { text: "", prefixP: -s, skillI: 0, skillP: 0, direction: "forward", delay: a, step: g }; i() }; chakhsu(document.getElementById('chakhsu')); </script> 在后台小标题添加（可能会报错） <p id="chakhsu" class="mt-3 h5 text-white d-flex"></p> 或者修改hero.php中的代码 源代码: <p id="subheading" class="mt-3 h5 text-white d-flex"> <?= Ctx::HeroTitle($this)[1] ?> 修改为 <p id="chakhsu" class="mt-3 h5 text-white d-flex"></p> {/collapse-item}{collapse-item label="添加转载说明"}在post.php最下面添加 <!--版权声明--> <script> document.body.addEventListener('copy', function (e) { if (window.getSelection().toString() && window.getSelection().toString().length > 10) { setClipboardText(e); } }); function setClipboardText(event) { var clipboardData = event.clipboardData || window.clipboardData; if (clipboardData) { event.preventDefault(); var htmlData = '' + '著作权归作者所有。<br>' + '商业转载请联系作者获得授权，非商业转载请注明出处。<br>' + '作者：<?php $this->author() ?><br>' + '链接：' + window.location.href + '<br>' + '来源：<?php $this->options->siteUrl(); ?><br><br>' + window.getSelection().toString(); var textData = '' + '著作权归作者所有。\n' + '商业转载请联系作者获得授权，非商业转载请注明出处。\n' + '作者：<?php $this->author() ?>\n' + '链接：' + window.location.href + '\n' + '来源：<?php $this->options->siteUrl(); ?>\n\n' + window.getSelection().toString(); clipboardData.setData('text/html', htmlData); clipboardData.setData('text/plain',textData); } } </script>{/collapse-item}{/collapse}{collapse}{collapse-item label="打字特效" open}在footer.php中添加 <!--评论框跳动的彩球,js链接 --> <script type="text/javascript" src="https://bqb.xiaobai666.top/js/commentTyping.js"></script> ![请输入图片描述][5] 自己去扒js代码或者引用我的 https://bqb.xiaobai666.top/js/commentTyping.js{/collapse-item}{collapse-item label="网站底部文字跳动"} 在后台css自定义添加 /*跳动文字css*/ .Pshake{ display: inline-block; will-change: transform; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-animation: Pshake_Crazy 1s ease-in-out infinite; animation: Pshake_Crazy 1s ease-in-out infinite; } @keyframes Pshake_Crazy{ 10%{transform:translate(-0.5px,-0.5px) rotate(0.5deg);} 20%{transform:translate(-0.5px,1.5px) rotate(0.5deg);} 30%{transform:translate(1.5px,0.5px) rotate(0.5deg);} 40%{transform:translate(1.5px,-0.5px) rotate(-0.5deg);} 50%{transform:translate(2.5px,1.5px) rotate(1.5deg);} 60%{transform:translate(-0.5px,-0.5px) rotate(-0.5deg);} 70%{transform:translate(-0.5px,2.5px) rotate(1.5deg);} 80%{transform:translate(2.5px,-1.5px) rotate(-0.5deg);} 90%{transform:translate(1.5px,-0.5px) rotate(1.5deg);} 0%,100%{transform:translate(0,0) rotate(0);} }在你想跳动的地方添加class="Pshake"{/collapse-item}{/collapse}

Typecho 添加访问提示 美好的一天从水文开始 :@(高兴) 原博客：https://www.roaing.com/khdxxhy.html在主题后台底部自定义中添加如果你网站开启了pjax,可能还会有点小bug,问题不大 :@(看热闹) <!-- 客户端信息 --> <div id="fps" style="z-index:5;position:fixed;bottom:3px;left:3px;color:#2196F3;font-size:10px;"></div> <script type="text/javascript" src="https://cdn.jsdelivr.net/gh/kaliisra/myblogstatic/kehuduan-js/fetch.min.js"></script> <script src="https://cdn.gmit.vip/layer/3.1.1/layer.js" type="text/javascript" charset="utf-8"></script> <script> /*网站打开提醒代码开始*/ $(function(){ if(/*getCookie('msg') !=*/ 1){ var t = document.createElement("a"); t.href = document.referrer; var msgTitle = t.hostname; var name = t.hostname.split(".")[1]; if("" !== document.referrer){ switch (name) { case 'bing': msgTitle = '必应搜索'; break; case 'baidu': msgTitle = '百度搜索'; break; case 'so': msgTitle = '360搜索'; break; case 'google': msgTitle = '谷歌搜索'; break; case 'sm': msgTitle = '神马搜索'; break; case 'sogou': msgTitle = '搜狗搜索'; break; default: msgTitle = t.hostname; }; }; var time = (new Date).getHours(); var msg = ''; 23 < time || time <= 5 ? msg = "你是夜猫子呀？这么晚还不睡觉，明天起的来嘛？": 5< time && time <= 7 ? msg = "早上好！一日之计在于晨，美好的一天就要开始了！": 7< time && time <= 11 ? msg = "上午好！工作顺利嘛，不要久坐，多起来走动走动哦！": 11< time && time <= 14 ? msg = "中午了，工作了一个上午，现在是午餐时间！": 14< time && time <= 17 ? msg = "午后很容易犯困呢，今天的运动目标完成了吗？": 17< time && time <= 19 ? msg = "傍晚了！窗外夕阳的景色很美丽呢，最美不过夕阳红~": 19< time && time <= 21 ? msg = "晚上好，今天过得怎么样？": 21< time && time <= 23 && (msg = "已经这么晚了呀，早点休息吧，晚安~"); $.ajax({ type:"get", url:"https://open.gmit.vip/web/api/UserInfo/", async:true, success:function(data){ window.info = data; layer.msg("Hi~ 来自"+ data.data.location + '~<br/>通过 '+msgTitle+' 进来的朋友！<br/>使用 '+ data.data.os +"<br/>"+ data.data.browser +' 访问本站！' + '<br/>' + msg); var showFPS = (function(){ var requestAnimationFrame = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function(callback) { window.setTimeout(callback, 1000/60); }; var e,pe,pid,fps,last,offset,step,appendFps; fps = 0; last = Date.now(); step = function(){ offset = Date.now() - last; fps += 1; if( offset >= 1000 ){ last += offset; appendFps(fps); fps = 0; }; requestAnimationFrame( step ); }; appendFps = function(fps){ var settings = { timeout: 5000, logError: true }; $('#fps').html('<span style="float:left;">'+fps+'FPS</span><br/><span style="float:left">'+window.info.data.os+'</span><br/><span style="float:left;margin-top:1px;">'+window.info.data.browser+'</span><br/><span style="float:left;margin-top:1px;">'+window.info.data.location+'</span><br/><span style="float:left;margin-top:1px;"></span>'); }; step(); })(); } }); }; }); </script>如果不显示，在头部或者脚部添加以下代码 <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

Typecho添加emoji表情 1、修改数据库编码在PhpMyadmin中选择typecho数据库，操作-->排序规则-->选择utf8mb4_unicode_ci然后执行。或者在服务器中执行（通用版 :@(高兴) ）首先在服务器中执行 mysql -uroot -p输入数据库密码，之后执行use 数据库名;最后执行以下命令： alter table typecho_comments convert to character set utf8mb4 collate utf8mb4_unicode_ci; alter table typecho_contents convert to character set utf8mb4 collate utf8mb4_unicode_ci; alter table typecho_fields convert to character set utf8mb4 collate utf8mb4_unicode_ci; alter table typecho_metas convert to character set utf8mb4 collate utf8mb4_unicode_ci; alter table typecho_options convert to character set utf8mb4 collate utf8mb4_unicode_ci; alter table typecho_relationships convert to character set utf8mb4 collate utf8mb4_unicode_ci; alter table typecho_users convert to character set utf8mb4 collate utf8mb4_unicode_ci;2、在config.inc.php修改 'charset' => 'utf8mb4',

为typecho文章页添加百度收录检测 2.0 在post.php中添加 <script> function baidu_check(){ var url= window.location.href $.getJSON("https://www.xiaobai666.top/usr/theme/Cuteen/baidu.php?domain="+url,function(result){ //调用api if (result.code == 200) { $('#baidu_icon').removeClass('glyphicon-refresh'); $('#baidu_icon').addClass('glyphicon-ok-circle'); $('#baidu_result').text('百度已收录'); }else if(result.code == 403){ $('#baidu_icon').removeClass('glyphicon-refresh'); $('#baidu_icon').addClass('glyphicon-info-sign'); /*$('#baidu_result').text('百度未收录');*/ $('#baidu_result').html('<a style="color:red;" rel="external nofollow" title="点击提交收录！" target="_bl ank" href="https://ziyuan.baidu.com/linksubmit/url?sitename='+url+'">百度未收录</a>'); }else{ $('#baidu_icon').removeClass('glyphicon-refresh'); $('#baidu_icon').addClass('glyphicon-remove-circle'); 并在合适的位置添加 <!--百度收录--> <span class="item"><i class="iconfont icon-liulanqi"></i></span><span class="meta-value" id="baidu_result">加载中</span> api 代码 <?php /** * Baidu * @editer: Weifeng * @link: https://wfblog.net * @version: 1.0 */ error_reporting(0); header("Access-Control-Allow-Origin:*"); header('Content-type: application/json'); $domain = @$_GET['domain']; if(!isset($domain) || empty($domain) || $domain==''){ $data = array( "code" => false, "msg" => "未传入请求参数！" ); echo json_encode($data,JSON_UNESCAPED_UNICODE); exit; } if(substr($domain, -1) == '/'){ $domain = substr($domain,0,strlen($domain)-1); } $data = checkBaidu($domain); echo json_encode($data,JSON_UNESCAPED_UNICODE); function checkBaidu($url){ $header = array( "Host:www.baidu.com", "Content-Type:application/x-www-form-urlencoded",//post请求 "Connection: keep-alive", "Referer:https://www.baidu.com", "User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.162 Safari/537.36" ); $url = 'https://www.baidu.com/s?ie=UTF-8&wd='.urlencode($url).'&usm=3&rsv_idx=2&rsv_page=1'; $ch = curl_init(); curl_setopt($ch, CURLOPT_URL, $url); curl_setopt ($ch, CURLOPT_HTTPHEADER, $header); curl_setopt($ch, CURLOPT_FOLLOWLOCATION,1); curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); $output = curl_exec($ch); curl_close($ch); if(strpos($output, '没有找到') || strpos($output, '很抱歉')){ $data = array( "code" => 403, "msg" => "该域名暂时未被百度收录！" ); }else{ $number = GetBetween($output,'<span class="nums_text">百度为您找到相关结果约','个</span>'); if(empty($number) || $number == 0){ $number = GetBetween($output,'<b>找到相关结果数约','个</b></p>'); if(empty($number) || $number == 0){ $data = array( "code" => false, "msg" => "获取百度收录失败！" ); return $data; } } $data = array( "code" => 200, "msg" => "该域名已被百度收录！", "number" => str_replace(',','',$number) ); } return $data; } function GetBetween($content,$start,$end){ $r = explode($start, $content); if (isset($r[1])){ $r = explode($end, $r[1]); return $r[0]; } } ?>在pjax中添加 <!--百度收录--> if((typeof baidu_check) !== "undefined"){ baidu_check(); }

页面加载代码 在footer文件添加以下内容 <!-- 加载页面等待 --> <div class="Bg_Th"> <div class="Bg_Img"> <img src="https://img.aiyo99.com/cdn/img/luoxiaohei-load.gif"> </div> <p class="Bg_Text">少女祈祷中...</p> </div> <script> document.onreadystatechange = function() 　　//当页面加载状态改变的时候执行function { 　　 if(document.readyState == "complete"){ var df = document.getElementsByClassName("Bg_Th")[0]; df.style.display="none"; 　 } } </script>自定义css /**加载界面等待**/ .Bg_Th{ position:fixed; top:0; bottom:0; height:100%; width:100%; background-color:#fff; transition: all .3s; z-index:9999; } .Bg_Img > img{ display:block; position:absolute; transform:translate(-50%,-50%); top:45%; left:50%; border-radius:8px; box-shadow:0px 4px 8px 0px rgba(0,0,0,0.3); } .Bg_Text{ position:relative; top:60%; text-align:center; font-size:1.4rem; letter-spacing:3px; z-index:9999; }

网站复制文章提醒代码 代码介绍1.一段可以让你网站被别人复制文章或者文字的时候会有 弹窗 提醒2.提醒文字可以 自定义 设置！3.废话不多话，直接分享代码表情代码演示下载特效JS文件:commentTyping.js，将其放在网站根目录某个地方然后在主题设置头部自定义放置以下代码 <script type="text/javascript" src="https://img.aiyo99.com/cdn/img/commentTyping.js"></script> <script src="https://img.aiyo99.com/cdn/img/sweetalert2@8.js"></script>在主题设置-底部自定义中放置以下代码 document.body.oncopy = function(){Swal.fire({allowOutsideClick:false,type:'success',title: '复制成功,转载请注明出处！',showConfirmButton: false,timer: 2000});};

给自己Typecho的文章添加是否被百度收录1.0 1、在目录 /usr/themes/handsome/functions.php 文件 尾部增加function baidu_record() { $url='http://'.$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI']; if(checkBaidu($url)==1) {echo "百度已收录"; } else {echo "<a style=\"color:red;\" rel=\"external nofollow\" title=\"点击提交收录！\" target=\"_blank\" href=\"http://zhanzhang.b aidu.com/sitesubmit/index?sitename=$url\">百度未收录</a>";} } function checkBaidu($url) { $url = 'http://www.baidu.com/s?wd=' . urlencode($url); $curl = curl_init(); curl_setopt($curl, CURLOPT_URL, $url); curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1); $rs = curl_exec($curl); curl_close($curl); if (!strpos($rs, '没有找到')) { //没有找到说明已被百度收录 return 1; } else { return -1; } }2、在post.php添加<!--百度收录--> <li class="meta-categories"><i class="pull-right text-muted" aria-hidden="true"></i> <span class="baidu-record"><?php echo baidu_record() ?></span></li>3、效果看文章开头

Typecho的Joe主题添加评论弹幕（PC端） 前言主要是结合自己实践，总结遇到的问题和做个备份成果展示{tabs}{tabs-pane label="后台"}{/tabs-pane}{tabs-pane label="前端"}{/tabs-pane}{/tabs}一、修改header.php文件新增代码，文件路径：usr/themes/Joe/public/header.php（一）第一段{tabs}{tabs-pane label="放在最上面"}<!-- 弹幕 --> <?php if ($this->options->JBarragerStatus === 'on') : ?> <?php $this->widget('Widget_Comments_Recent@index', 'ignoreAuthor=true&amp;pageSize=15')->to($comments); ?> <ul class="j-barrager-list"> <?php if ($comments->have()) : ?> <?php while ($comments->next()) : ?> <li> <span class="j-barrager-list-avatar" data-src="<?php _getAvatarByMail($comments->mail) ?>"></span> <span class="j-barrager-list-content"><?php _parseAsideReply($comments->content); ?></span> </li> <?php endwhile; ?> <?php endif; ?> </ul> <?php endif; ?>{/tabs-pane}{tabs-pane label="代码位置"}{/tabs-pane}{/tabs}（二）第二段{tabs}{tabs-pane label="放在登录旁"}<!-- 弹幕 --> <?php if ($this->options->JBarragerStatus === 'on') : ?> <div class="item"> <input id="barrager" class="barrager" type="checkbox" title="开启/关闭弹幕"> </div> <?php endif; ?>{/tabs-pane}{tabs-pane label="代码位置"}{/tabs-pane}{/tabs}（三）第三段不要耍小聪明，放到include.php里去，不会显示弹幕的 {tabs}{tabs-pane label="放在最后面"}<!-- 弹幕 --> <?php if ($this->options->JBarragerStatus === 'on') : ?> <script src="<?php $this->options->themeUrl('library/barrager/joe.barrager.js'); ?>"></script> <?php endif; ?>{/tabs-pane}{tabs-pane label="代码位置"}{/tabs-pane}{/tabs}二、修改include.php文件新增如下代码；文件路径：usr/themes/Joe/public/include.php{tabs}{tabs-pane label=" include.php 文件"}<?php if ($this->options->JBarragerStatus === 'on') : ?> <link rel="stylesheet" href="<?php $this->options->themeUrl('library/barrager/joe.barrager.css'); ?>"> <?php endif; ?>{/tabs-pane}{tabs-pane label="代码位置"}{/tabs-pane}{/tabs}三、修改functions.php文件路径usr/themes/Joe/functions.php{tabs}{tabs-pane label="添加代码"}$JBarragerStatus = new Typecho_Widget_Helper_Form_Element_Select( 'JBarragerStatus', array('off' => '关闭（默认）', 'on' => '开启'), 'off', '是否开启弹幕功能（仅限PC）', '介绍：开启后，网站将会显示评论弹幕功能，该功能采用CSS动画引擎，并非传统JS操作DOM，无任何性能消耗。' ); $JBarragerStatus->setAttribute('class', 'joe_content joe_custom'); $form->addInput($JBarragerStatus->multiMode());{/tabs-pane}{tabs-pane label="代码位置"}{/tabs-pane}{/tabs}如果创建过 custom.php 文件，直接放到 custom.php 里就行了 但是记得要在 functions.php 引入 custom.php 哦四、修改config.php文件文件路径：usr/themes/Joe/public/config.php{tabs}{tabs-pane label="添加代码"}/* 弹幕 */ DOCUMENT_BARRAGER: '<?php echo $this->options->JBarragerStatus === 'on' ? 'on' : 'off' ?>',{/tabs-pane}{tabs-pane label="代码位置"}{/tabs-pane}{/tabs}五、上传CSS和JS将以下文件，放在usr/themes/Joe/library里就行了隐藏内容，请前往内页查看详情转自执念博客

【技巧】给网站添加pjax无刷新，换页音乐不中断 自从博客加了悬浮音乐播放器后就一直在折腾换页音乐不中断的功能 在网上查找后发现想要实现换页音乐不中断的功能必须要为博客加pjax，于是又苦苦寻找并尝试了一番 最后发现网上实现pjax功能基本上是两种方法。方法一第一种方法是来自大佬友人C的博客。<script src="//cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script> <script src="//cdn.bootcss.com/jquery.pjax/1.9.6/jquery.pjax.min.js"></script> <script> $(document).pjax('a[href^="<?php Helper::options()->siteUrl()?>"]:not(a[target="_blank"], a[no-pjax])', { container: '#pjax-container', fragment: '#pjax-container', timeout: 8000 }) </script>将以上代码放入页脚文件foot.php或者footer.php文件的最下面。解释一下上面代码：是typecho的自带函数，调用本站的首页地址！也就是只对本站的，并且没有_blank属性的，标签里不含no-pjax的链接实行pjax！局部刷新的区域是#pjax-container的部分！其中#pjax-container是你的局部刷新部分，你可能没有这个div，你自己在添加一个包裹住你想局部刷新的部分就行了！方法二第二种方法是来自大佬保罗的小宇宙的博客。<script src="https://cdn.jsdelivr.net/npm/pjax/pjax.js"></script> <script> var pjax = new Pjax({ elements: "a", // 在页面进行 PJAX 时需要被替换的元素或容器，一条一个 CSS 选择器，数组形式 selectors: [ "title", "meta[name=description]", // 如果是全部 meta 替换的话，只需要写 meta "main" ], cacheBust: false }) </script>和第一种方法一样，将以上代码放入页脚文件foot.php或者footer.php文件的最下面。局部刷新的区域是main的部分！其中main是你的局部刷新部分，你可能没有这个div，你自己在添加一个包裹住你想局部刷新的部分就行了！测试（joe主题）两种方法我这边都测试过了，最终第二种方法是成功的，然后由于我主题的特殊性，在成功之后出现跳转页面后出现内容显示不完全的BUG，解决的方法是把index.php文件和post.php文件中主体部分所有引用页面的部分全部都放在放在各自的页面里面。如index.php中引用的<!-- 列表 --> <?php $this->need('component/index.list.php'); ?>就把component/index.list.php文件里的所有代码全部复制到index.php文件的下面即可。由于joe主题引用的文件实在是太多，其实是懒得弄所以就此搁置！有兴趣的话自己可以尝试下。

为网页添加字体闪烁（变色）特效 本篇文章教大家如何给自己的网页添加一个字体闪烁（变色）特效。添加步骤给要添加特效的元素添加class:magic-color将以下代码复制到元素后面（多个元素则放到最后一个元素后面）<script> function magicColor(mode,t){ t=t||10; let elem=document.getElementsByClassName("magic-color"); if(!elem){ setTimeout(function(){ magicColor(mode,t-1); },400); return; } if(window.mcHandler==undefined){ window.mcHandler={elements:[]}; window.mcHandler.colorIndex=0; window.mcHandler.run=function(mode){ let color=mode=="random"?("rgb("+Math.floor(Math.random()*256)+","+Math.floor(Math.random()*256)+","+Math.floor(Math.random()*256)+",1)"):["#CC0000","#9999CC","#CC3366","#669999","#FFCC00","#00CCCC","#CC00CC"][(window.mcHandler.colorIndex++)%7]; for(var i=0,L=window.mcHandler.elements.length;i<L;i++)window.mcHandler.elements[i].style.color=color; } } window.mcHandler.elements=elem; if(window.mcHandler.timer==undefined){ window.mcHandler.timer=setInterval(()=>{window.mcHandler.run(mode)},500); } } magicColor(random);//random为随机颜色，否则为固定颜色随机；上方“闪烁（变色）”字样为固定颜色随机 </script>{callout color="#ef6d4d"}转载来源： {abtn color="#ff0d00" href="https://chenyu.me/1420.html" content="醉书生"/}{/callout}

本站同款右键菜单及F12美化 此款右键菜单及美化和本站的一样，具体效果可以参考本站。1.新增CSS和JS网站头部新增如下代码（Joe主题在/usr/themes/Joe/public/include.php）<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/cy-j/chenyu/css/chenyuyj.css" /> <link rel="stylesheet" href="https://at.alicdn.com/t/font_2611504_8nq4wp1bmb3.css" /> <script src="https://cdn.jsdelivr.net/gh/cy-j/chenyu/js/ysnino6.js"></script> <script src="https://cdn.jsdelivr.net/gh/cy-j/chenyu/js/chenyuyj.js"></script> <script src="https://cdn.jsdelivr.net/gh/cy-j/chenyu/js/layer/layer.js"></script>注：如果你的网站没有jquery.min.js请再加一行：<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.min.js"></script>2.正文代码网站正文……之间或foot文件里新增如下代码：<!-- 右键美化 --> <div class="usercm" style="left: 199px; top: 5px; display: none;"> <ul> <li><a href="https://www.aiyo99.com/"><i class="cyicon chenyu-rhome-fill"></i><span>首页</span></a></li> <li><a href="javascript:void(0);" onclick="getSelect();"><i class="cyicon chenyu-fuzhi"></i><span>复制</span></a></li> <li><a href="javascript:history.go(1);"><i class="cyicon chenyu-go"></i><span>前进</span></a></li> <li><a href="javascript:history.go(-1);"><i class="cyicon chenyu-backward"></i><span>后退</span></a></li> <li style="border-bottom:1px solid gray"><a href="javascript:window.location.reload();"><i class="cyicon chenyu-shuaxin"></i><span>刷新</span></a></li> <li><a href="javascript:void(0);" onclick="baiduSearch();"><i class="cyicon chenyu-baidu"></i><span>百度</span></a></li> <li style="border-bottom:1px solid gray"><a href="javascript:void(0);" onclick="googleSearch();"><i class="cyicon chenyu-google1"></i><span>谷歌</span></a></li> <li><a target="_blank" href="https://www.aiyo99.com/"><i class="cyicon chenyu-gongjuxiang"></i><span>百宝箱</span></a></li> <li><a href="https://www.aiyo99.com/"><i class="cyicon chenyu-service-Fill"></i><span>小黑</span></a></li> </ul> </div> <!-- 右键美化结束 -->{callout color="#ef6d4d"}转载来源： {abtn color="#ff0d00" href="https://chenyu.me/1424.html" content="醉书生"/}{/callout}