前言：

测试子比主题完美兼容，其他WordPress没有尝试，大家可以自行尝试，教程很简单，只需要改动三个地方：

1.子比主题文件下的header.php文件（wp-content/themes/zibll）

2.WordPress后台的小工具（后台-外观-小工具-自定义HTML-添加到首页全宽度）

3.自定义CSS样式（子比主题设置-全局设置-自定义代码-自定义CSS样式）

4.ico图标和模块显示图片的更改

教程正文：

1.修改header.php文件

在子比主题的主题目录下，header.php底部添加以下函数代码：

2.HTML+JS代码

在后台–>外观–>小工具–>自定义HTML，把自定义HTML放到合适的版块里（子比主题放在首页-底部全宽度），然后把下面代码复制粘贴进去，即可在前台显示。

将下面图片依次命名为“expression-0.png”-“expression-6.png”

在网站根目录创建/emo目录，并上传下图所有图片，并修改上述代码中的“(“src”, “你网站域名/emo/expression-” + week + “.png”);”

例如：(“src”, “https://zy.nuoyo.cn/emo/expression-” + week + “.png”);

3.CSS代码

下面是CSS代码，原本一起放的，但是CSS Grid布局不兼容WP的自定义工具，所以就只能放在主题后台的【自定义CSS样式】里面咯！

其他WP主题使用，请注意：“background—Color:var(–main-bg-color);”这是子比主题的夜间背景切换，自己更换为“#fff”颜色，或者更换为你主题的背景颜色。

4.ico图标和显示图片更改

ico图标这里就不多说了，用阿里云的icon图标库，图标在自定义HTML代码里更改，如下图：圈起来的就是图标名称。