WordPress网站&子比主题模板美化教程汇总篇[已更43]

WordPress网站&子比主题模板美化教程汇总篇[已更43]

在 zibll 主题目录下,themes/zibll/footer.php 文件中的“</footer>”,其他合适位置均可,(重要)下面添加下面的代码:

<!--底部波浪开始-->
/*by:大雄搜集站-soujiz.com*/
<div class="wiiuii_layout">
<svg class="editorial"
     xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink"
     viewBox="0 24 150 28"
     preserveAspectRatio="none">
 <defs>
 <path id="gentle-wave"
 d="M-160 44c30 0 
    58-18 88-18s
    58 18 88 18 
    58-18 88-18 
    58 18 88 18
    v44h-352z" />
  </defs>
  <g class="parallax">
   <use xlink:href="#gentle-wave" x="50" y="0" fill="#4579e2"/>
   <use xlink:href="#gentle-wave" x="50" y="3" fill="#3461c1"/>
   <use xlink:href="#gentle-wave" x="50" y="6" fill="#2d55aa"/>  
  </g>
</svg>
</div>
<style type='text/css'>
.parallax > use{animation: move-forever 12s linear infinite;}.parallax > use:nth-child(1){animation-delay: -2s;}.parallax > use:nth-child(2){animation-delay: -2s; animation-duration: 5s;}.parallax > use:nth-child(3){animation-delay: -4s; animation-duration: 3s;}@keyframes move-forever{0%{transform: translate(-90px, 0%);} 100%{transform: translate(85px, 0%);}}.wiiuii_layout{width: 100%;height: 40px;position: relative;overflow: hidden;z-index: 1;background: var(--footer-bg);}.editorial{display: block; width: 100%; height: 40px; margin: 0;}
</style>
/*by:大雄搜集站-soujiz.com*/
<!--底部波浪结束-->
/*版权声明开始*/
/*by:大雄搜集站-soujiz.com*/
<fieldset style=" border: 1.5px dashed #008cff; padding: 10px; border-radius: 5px; line-height: 2em;font-weight: 700;color: var(--key-color);background-color: var(--body-bg-color);">
			      <legend align="center" style=" margin-bottom: -2px;width: 30%;text-align: center; background-color: #008cff; border-radius: 999px; background-image: linear-gradient(to right, #FFCC99, #FF99CC);border: 1.5px dashed #008cff;">
			        版权声明
			      </legend>

					<span class="btn-info btn-xs">1</span>  本站名称:<a href="https://soujiz.com" style="color: #48dbfb;text-decoration: none;">大雄搜集站</a><br>
			    <span class="btn-info btn-xs">2</span> 网址:<a href="https://soujiz.com" style="color: #48dbfb;text-decoration: none;">https://soujiz.com</a>
					<br>
                           <span class="btn-info btn-xs">3</span> 本站资源大多存储在云盘,如有链接失效,请留言反馈站长更新!<br>
			    <span class="btn-info btn-xs">4</span> 本站各种资源及源码软件大部分为网络搜集而来,如有侵犯版权的,请邮件与我们联系,本站将予以改正。<br>
			    <span class="btn-info btn-xs">5</span> 由于网络资源有极快的复制性,付费资源一经购买 ,不以任何形式退款,购买过程中如有付费资源失效,请及时联系站长。<br>
			    
			  </fieldset>
/*版权声明结束*/
/*by:大雄搜集站-soujiz.com*/

1.子比主题设置—>自定义代码—>自定义 CSS 样式:,添加以下 CSS 代码:

/*评论背景图*/
/*by:大雄搜集站-soujiz.com*/
textarea#comment {background-color:transparent;background:linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05)),url(https://soujiz.com/wp-content/uploads/2022/07/20220730131123.png) right 10px bottom 10px no-repeat;-moz-transition:ease-in-out 0.45s;-webkit-transition:ease-in-out 0.45s;-o-transition:ease-in-out 0.45s;-ms-transition:ease-in-out 0.45s;transition:ease-in-out 0.45s;}
textarea#comment:focus {background-position-y:789px;-moz-transition:ease-in-out 0.45s;-webkit-transition:ease-in-out 0.45s;-o-transition:ease-in-out 0.45s;-ms-transition:ease-in-out 0.45s;transition:ease-in-out 0.45s;}
/*by:大雄搜集站-soujiz.com*/
/*评论背景图 结束*/

1、在后台—》外观—》小工具—》自定义 HTML—》 粘贴代码放入即可,选择你需要放的位置,站长是放在 首页-首页侧边栏

<div class="gn_box">
    <h2><center><font color=#E80017>2</font><font color=#D1002E>0</font><font color=#BA0045>2</font><font color=#A3005C>2</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>
    </center></h2>
    <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('2022/01/01 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);
        document.getElementById("t_d").innerHTML = d + " 天";
        document.getElementById("t_h").innerHTML = h + " 时";
        document.getElementById("t_m").innerHTML = m + " 分";
        document.getElementById("t_s").innerHTML = s + " 秒";
    }
    setInterval(getRTime, 1000);
    </script>
</div>
<!--侧边栏新年倒计时 by:大雄搜集站-soujiz.com*/

1 2 3 4 5 6

© 版权声明
THE END
喜欢点个赞支持一下吧
点赞1赏币 分享
评论交流 共18条

请登录后发表评论