子比主题添加滚动banner以及文章推荐卡片

子比主题添加滚动banner以及文章推荐卡片

子比主题添加滚动banner以及文章推荐卡片-知新网
子比主题添加滚动banner以及文章推荐卡片
此内容为付费阅读,请付费后查看
500积分
付费阅读
已售 16

前言

在没放弃hexo博客的时候,有用过butterfly美化。来到wordpress之后,想要复刻首页滚动banner以及文章推荐卡片。

预览

image

HTML代码

html代码扒了张洪heo,改了一部分html代码。修改了一部分html代码是为了能够正常使用

html可以自行修改(建议先保存一下文件,防止丢失)

html代码需要在 外观 》小工具 》首页 顶部全宽度,添加自定义html

CSS代码

JS代码

js代码来源于:为博客顶部添加滚动banner及文章推荐卡片 – 随风起

需要将代码放在小工具里面

这个代码是为了屏蔽lazyload的css,让lazyload不会影响到功能正常使用

<style>
.loading,.notyf.load::before,.swiper-lazy-preloader {
	content: '';
	animation:none!important;
	border:none!important;
}

.tags-group-icon img {
  width: 62%!important;
   height: 62%!important;
}
</style>

更新内容

2024.02.05 14:21
  • 修复鼠标放置在随机文章区块上无法显示蓝色
  • 修复分类区块动画图标会不等大
  • 修复分类区块小白条无法显示(跟随分类动画还未修复)
  • 修复部分图标不会显示
  • 修复推荐卡片无法显示颜色
2024.02.05 20:59
  • 修复点击更多推荐按纽无法显示推荐文章
  • 修复点击随机文章报错
 该文章来自安凝雪科技
© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享
评论 共14条
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片快捷回复
    • 的头像-知新网fetl0
    • 的头像-知新网binhongtea0
    • 的头像-知新网a8108892470
    • 的头像-知新网南柯无痕0
    • 的头像-知新网njszl8880
    • 的头像-知新网我有猫猫0
    • 的头像-知新网Alvin0
    • 的头像-知新网sun1230
    • 的头像-知新网陈司俊守0
    • 的头像-知新网陳平安0
    • 的头像-知新网Train030
    • 的头像-知新网zephyrus0
    • 的头像-知新网xtgcw0
    • 的头像-知新网lee_99630
社区求救信号帮助是一种美德