子比主题美化教程-心动次元

注意说明

每个人的审美观念不一样，所以请先参考本站或测试在用。
主题美化、小工具可能会有一定程度使网站加载缓慢、CSS全局污染等等一系列的问题，请一定要测试后在进行美化。
主题美化可能会对主题文件进行修改，更新时请及时备份主题美化的文件，或者收藏本站，以免一些主题页面或美化效果丢失。
美化代码部分采集跟站长捣鼓出来的，都是已经过测试。

更新教程及说明

（最新版）CSS代码添加到后台子比主题设置->自定义代码->自定义CSS样式
（最新版）JS即javascript代码添加到后台子比主题设置->自定义代码->自定义javascript代码
（最新版）没有特殊说明的小工具，自定义HTML小工具添加网站后台->外观->小工具->点击【自定义HTML】选择放置的位置->把代码复制进去，保存即可。
其他添加方式的，我会在教程里告知，若只需添加CSS+JS的教程，我不重复告知了，请注意看上面的方法。

教程按是更新时间排序，新的美化教程排在最后面-越往后越新

改网站背景图+改网站背景色

/*背景图*/
body {background: var(--body-bg-color);} :root{--body-bg-color:url(https://图片链接/) top fixed;}

/*背景色*/body {background: -webkit-linear-gradient(0deg,#ffdee9c4 0%,#b5fffc8f 100%); background-color: #FFDEE9;}

顶部导航栏添加背景图片

效果图：

css代码：

此处内容已隐藏，请评论后刷新页面查看.

左侧菜单添加背景图片（手机才能看）

效果图：

css代码：

此处内容已隐藏，请评论后刷新页面查看.

网站添加添加复制透明提示框

子比主题设置—>自定义代码—>自定义javascript代码：,添加以下代码：

//透明复制提示
// by：忧心笔记 www.uxr.cc
document.body.oncopy = function() {layer.msg('<p style="font-weight: 700;">【忧心笔记 www.uxr.cc 】<br>复制成功，若要转载请务必保留原文链接！</p>', function(){});};

子比主题设置—>自定义代码—>自定义底部HTML代码,添加以下代码：

<!--透明复制提示开始--> 
<!--by：忧心笔记 www.uxr.cc-->
<script src="https://cdn.bootcss.com/layer/2.3/layer.js"></script>
<!--透明复制提示结束-->

效果图：

友情链接右侧添加美化按钮

添加方法：后台设置—>外观—>小工具—>添加Zibll 链接列表(新版),加到标题右侧按钮即可

<span class="but c-blue radius"><svg class="icon fa-spin" aria-hidden="true"><use xlink:href="#icon-fengche1"></use></svg>申请友链

效果图：

注意要引用阿里巴巴矢量图库

Zibll主题给文章内超链接加上波浪效果

动态效果：

目前这个美化还并不是很多，喜欢的朋友可以使用看看效果，很简单把代码添加到合适的位置即可，应该所有Wordpress网站都可以使用。只需两行代码即可实现

代码如下：

此处内容已隐藏，请评论后刷新页面查看.

—- 本页内容已结束，请看第2页内容—-

------本页内容已结束，👋 感谢您的观看！------

重要声明

如果遇到付费才可观看的文章，建议升级会员或者成为认证用户，全站所有资源“任意下免费看”。未经本站的明确许可，任何人不得大量链接本站下载资源，不得复制或仿造本网站。本网站对其自行开发的或和他人共同开发的所有内容、技术手段技术手段和服务拥有全部知识产权，任何人不得侵害或破坏，不得擅自使用。

THE END

代码教程美化教程
# 美化教程 # 子比美化 # 主题美化

喜欢就支持一下吧

点赞6 赞赏