WordPress子比美化教程(持续更新中)

本站代码模板仅供学习交流使用请勿商业运营,严禁从事违法,侵权等任何非法活动,否则后果自负!

使用教程

  • 将下面的代码添加在 WordPress 后台小工具,效果展示是一样的
  • 添加路径:后台 >> 外观 >> 小工具 >> 自定义 HTML >> 选择你需要放的位置

HTML

<div class="zib-widget widget_text">
    <div id="update_version">
    <a href="/" target="_blank" rel="noopener"><img title="腾飞博客" src="https://www.tfbkw.com/wp-content/uploads/2024/05/20240524203517214-tougao.webp" alt="图片" style="border-radius:5px;"></a>
    <a class="blog_link" href="https://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&email=tfblog@126.com" target="_blank" style="background-image: linear-gradient(120deg, #3ca5f6 0%, #a86af9 100%);" rel="noopener">站长邮箱</a>
    <a class="cms_link" href="/" target="_blank" style="background-image: linear-gradient(120deg, #f093fb 0%, #f5576c 100%);" rel="noopener">在线投稿</a>
    <a class="grid_link" href="/" target="_blank" style="background-image: linear-gradient(to right, #fa709a 0%, #fee140 100%);" rel="noopener">友情链接</a>
    </div>
    <div>
    <hr>
    </div>
    </div>

CCS

#update_version img{margin:0px 0 15px }#update_version a{width:30%;height:35px;border-radius:3px;text-align:center;line-height:35px;font-size:9pt;color:#fff;font-weight: 700;}.blog_link{background-color:#2ba9fa}.blog_link,.cms_link{float:left;margin-right:5%}.cms_link{background-color:#ff6969}.grid_link{float:left;background-color:#70c041}

这个一共需要两个代码,跟着我步骤走,一个是JS引入的文件代码,一个是JS代码。

代码部署

这个是JS链接引入,直接将下面的代码放到:子比主题->>自定义头部HTML代码即可

<script src="https://cdnjs.cloudflare.com/ajax/libs/layui/2.6.8/layui.min.js"></script>

这个是JS代码,直接将下面的代码放到:子比主题->>自定义javascript代码即可

$(".toggle-theme").click(function() {var toggleThemeText = "当前为日间模式";if (!$("body").hasClass('dark-theme')) {toggleThemeText ="当前为夜间模式";}layer.msg(toggleThemeText, {time: 2000,anim: 1});});

1 2 3 4 5

© 版权声明
THE END
喜欢就支持一下吧
点赞7 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容