WordPress修改文章标签为随机颜色

WordPress修改文章标签为随机颜色

2021-11-18 682
VIP免费
下载不了?请联系网站客服提交链接错误!
增值服务:

WordPress修改文章标签为随机颜色

2021-11-18 wordpress美化 0 682
郑重承诺丨优站网提供安全交易、信息保真!
增值服务:
自动发货
网盘下载
安装指导
环境配置
二次开发
网站建设
¥ 0 (VIP免费升级VIP开通VIP尊享优惠特权
立即下载 升级会员 购买教程 售后支持
详情介绍

一般来说,WordPress主题标签要么是纯色,要么是与主题相同的颜色。那么我们如何把标签换成多样化的颜色呢?比如随机主题标签的颜色。效果图如下。这篇文章中有很多标签。颜色都是随机的,看起来各不相同。

WordPress修改文章标签为随机颜色-优站网

操作步骤:
找到你主题全局调用的.CSS文件,在下面添加上以下代码

/**标签随机颜色**/.article-categories { margin-bottom: 10px}.article-categories a { padding: 4px 10px; background-color: #19B5FE; color: white; font-size: 12px; line-height: 16px; font-weight: 400; margin: 0 5px 5px 0; border-radius: 2px; display: inline-block}.article-categories a:nth-child(5n) { background-color: #4A4A4A; color: #FFF}.article-categories a:nth-child(5n+1) { background-color: #ff5e5c; color: #FFF}.article-categories a:nth-child(5n+2) { background-color: #ffbb50; color: #FFF}.article-categories a:nth-child(5n+3) { background-color: #1ac756; color: #FFF}.article-categories a:nth-child(5n+4) { background-color: #19B5FE; color: #FFF}.article-categories a:hover { background-color: #1B1B1B; color: #FFF}.article-title { position: relative; margin-bottom: 15px; font-size: 26px; line-height: 1.3; display: block; font-weight: 400; margin: 0 0 35px; padding: 0 0 30px; border-bottom: 1px solid #e7e7e7; color: #FFF}

然后我们打开标签输出的位置进行更改。通常,我们在主题文件夹中打开名为single.php的文件并寻找标签。我们可以看到有一串以div开头的代码,如下所示:

<div class="article-tags"><?php the_tags('标签:','',''); ?></div>

将它修改为下面的代码即可:

<div class="article-categories"><?php the_tags('标签:','',''); ?></div>

特别说明:请根据自己的主题修改。css代码是通用的,也就是只修改一个id。只要找到主题的id名称,就可以直接修改。

除非注明,否则均为优站网原创文章,转载必须以链接形式标明本文链接

本文链接:https://www.zhanceo.com/20904.html

资源下载此资源仅限注册用户下载,请先
客服QQ:972908224
收藏 (0) 打赏

感谢您的支持,我会继续努力的!

打开微信/支付宝扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
点赞 (0)

免责声明   ⚠️ 1. 本站所有资源来源于网络收集,若资源侵犯了您的合法权益,请来信通知我们(Email: 972908224@qq.com),我们会及时删除,给您带来的不便,我们深表歉意!2. 分享目的仅供大家学习和交流,若使用商业用途,请购买正版授权!否则产生的一切后果将由下载用户自行承担!3. 会员不得使用于非法商业用途,不得违反国家法律。否则后果自负!4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!5. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需!6. 因源码具有可复制性,一经购买 ,不得以任何形式退款。7.更多详情请点击查看

优站网 wordpress美化 WordPress修改文章标签为随机颜色 https://www.zhanceo.com/20904.html

诚乃立身之本、信为道德之基

常见问题
  • 如果付款后没有弹出下载页面,多刷新几下,有问题联系客服!
查看详情
  • 本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。
查看详情

相关文章

评论
暂无评论
联系官方客服

为您解决烦忧 - 24小时在线 专业服务

WordPress修改文章标签为随机颜色-海报

分享本文封面