handsome主题在本站代码修改魔改地方以及美化配置保留保存备忘文档

右侧导航组成修改

在主题的路径:usr/themes/handsome/component/aside.php里面进行修改[代码我已经去除,保留在下方,放在原文第126行。]

          <li class="line dk"><>
        <!--Components-->
          <li class="hidden-folded padder m-t m-b-sm text-muted text-xs">
            <span><?php _me("") ?></span>
          <>
          <!--分类category-->
            <?php
            $class = "";
                if (in_array("openCategory",$this->options->featuresetup)){
                    $class = "class=\"active\"";
                }
                ?>

右下角版权信息等修改

音乐弹窗

<script src="https://cdn.bootcdn.net/ajax/libs/sweetalert/2.1.2/sweetalert.min.js";;> </script>
<script >
swal("是否开启音乐一边浏览一边听呢?", {
buttons: { cancel: "开启", allow: "关闭" } }).then(function(value) { if (value == "allow") { player.pause() } else { player.play(); } });
</script>

右侧导航按钮

PJAX回调函数

let tags = document.querySelectorAll("#tag_cloud-2 a");
let infos = document.querySelectorAll(".badge");
let colorArr = ["#428BCA", "#AEDCAE", "#ECA9A7", "#DA99FF", "#FFB380", "#D9B999"];
tags.forEach(tag => {
tagsColor = colorArr[Math.floor(Math.random() * colorArr.length)];
tag.style.backgroundColor = tagsColor;
});
infos.forEach(info => {
infosColor = colorArr[Math.floor(Math.random() * colorArr.length)];
info.style.backgroundColor = infosColor;
});

左侧导航栏按钮

{"name":"关于","feather":"slack","link":"/index.php/2.html"},{"name":"联系","feather":"user","link":"/index.php/24.html"},{"name":"留言","feather":"at-sign","link":"/index.php/4-1.html"},{"name":"目录","feather":"file-text","link":"/index.php/3.html"},{"name":"动态","feather":"pen-tool","link":"/index.php/cross.html"},{"name":"友链","feather":"github","link":"/index.php/5-1.html"},{"name":"相册","feather":"image","link":"/index.php/69.html"},{"name":"简历","feather":"star","link":"/index.php/73.html"}

博客底部左侧信息

<span id="runtime_span"></span><script type="text/javascript">function show_runtime()
{window.setTimeout("show_runtime()",1000);X=new Date("8/30/2020 5:22:00");Y=new Date();T=    
(Y.getTime()-X.getTime());M=24*60*60*1000;a=T/M;A=Math.floor(a);b=(a-A)*24;B=Math.floor(b);c=(b-
B)*60;C=Math.floor((b-B)*60);D=Math.floor((c-C)*60);runtime_span.innerHTML="本站稳定运
行:"+A+"天"+B+"小时"+C+"分"+D+"秒"}show_runtime();</script>

自定义 CSS

.img-full {
width: 100px;
border-radius: 50%;
animation: light 4s ease-in-out infinite;
transition: 0.5s;
}

.img-full:hover {
transform: scale(1.15) rotate(720deg);
}

@keyframes light {
0% {
    box-shadow: 0 0 4px #f00;
}

25% {
box-shadow: 0 0 16px #0f0;
}

50% {
box-shadow: 0 0 4px #00f;
}

75% {
box-shadow: 0 0 16px #0f0;
}

100% {
box-shadow: 0 0 4px #f00;
}
}

顶部最前方广告

<style>  .gn_box{     border: none;     border-radius: 15px; }  .gn_box {     padding: 10px 14px;         
margin: 10px;     margin-bottom: 20px;     text-align: center;     background-color: #fff; }  
#t_d{     color: #982585;     font-size: 18px; }  #t_h{     color: #8f79c1;     font-size: 18px; }  
#t_m{     color: #65b4b5;     font-size: 18px; }  #t_s{     color: #83caa3;     font-size: 18px; }      
</style>  <div class="gn_box">      <h1><font color=#E80017>2</font><font color=#D1002E>0</font>
<font color=#BA0045>2</font><font color=#A3005C>1</font><font  color=#8C0073>年</font><font 
color=#75008A>-</font> <font color=#5E00A1>新</font><font color=#4700B8>年</font><font 
color=#3000CF>倒</font><font color=#1900E6>计</font><font color=#0200FD>时</font></h1><center> <div 
id="CountMsg" class="HotDate"><span id="t_d"> 天</span><span id="t_h"> 时</span><span id="t_m"> 分
</span><span id="t_s"> 秒</span></div></center> <script type="text/javascript">  function 
getRTime() {        var EndTime = new Date('2021/01/1 00:00:00');       var NowTime = new Date();       
var t = EndTime.getTime() - NowTime.getTime();              var d = Math.floor(t / 1000 / 60 / 60 
/ 24);              var h = Math.floor(t / 1000 / 60 / 60 % 24);              var m = Math.floor(t 
/ 1000 / 60 % 60);              var s = Math.floor(t / 1000 % 60);      var day = 
document.getElementById("t_d");     if (day != null) {         day.innerHTML = d + " 天";        }     
var hour = document.getElementById("t_h");     if (hour != null) {         hour.innerHTML = h + " 
时";       }     var min = document.getElementById("t_m");     if (min != null) {         
min.innerHTML = m + " 分";        }     var sec = document.getElementById("t_s");     if (sec != 
null) {         sec.innerHTML = s + " 秒";     } }      setInterval(getRTime, 1000);      
</script> </div>
© 版权声明
THE END
喜欢就支持以下吧
点赞457赞赏
分享
评论 抢沙发

请登录后发表评论