板块帖子列表顶部标签美化教程

ZAESKY 2020-2-16

1625 108
该帖已被设置为推荐帖

又是闲着无聊的一天,就看到帖子列表顶部的标签与主题格格不入就想着美化一下。

美化前

这个还是后来加了个card的样式,还是觉得不好看。

美化后

修改教程

找到plugin\xn_tag\hook\forum_breadcrumb_after.htm

把原来的2-7行

<style>
table.nav_tag_list {margin-bottom: 0.2rem;}
table.nav_tag_list td {padding: 0.3rem;}
table.nav_tag_list td a{margin-right: 0.5rem;}
.nav_tag_list .active {font-weight: 800;}
</style>

替换成下面的代码,或者自定义样式都行。

<style>
table.nav_tag_list {margin-bottom: 0.5rem;}
table.nav_tag_list td a{background:white;padding:0.3rem .83rem;border-radius:1rem;font-size:12px;color: #8a9aa9;}
table.nav_tag_list td a:hover{color: #0084ff;}
.nav_tag_list .active {background:#0084ff;color:#fff;font-weight:500;}
table li{float:left;margin:5px 0px;}
</style>

再找到第36行和56行a标签的前面和后面都加上li标签像这样:

就行了。

修复

如遇到标签样式出现错误重叠,请下载附件文件替换plugin\xn_tag\hook文件夹内同名文件。为了整体美观去掉了标签分类名。

如果需要标签类名请将下面代码:

<td class="text-muted text-nowrap" align="right" valign="top">
	<?php echo $tagcate['name'];?>:
</td>

添加到文件forum_breadcrumb_after.htm 第13行下面

最后于 2020-2-16 被ZAESKY编辑 ,原因: 修复BUG
本帖中包含附件 如需下载请先回复并刷新本帖!
最新回复 (108)
  • glxhydue
    2020-2-16
    0 2


  • KUIUK
    2020-2-16
    0 3


    第一排跟第二排挤在一块了,有重合部分

  • ZAESKY
    2020-2-16
    0 4
    glxhydue
    刚好在修改,你就截图了[em_16]
  • ZAESKY
    2020-2-16
    0 5
    KUIUK 第一排跟第二排挤在一块了,有重合部分
    我也看到了,已修复,详情见文章。[em_46]
  • KUIUK
    2020-2-16
    0 6
    哈哈
  • 汉克
    2020-2-17
    0 7
    hh
  • 无聊
    2020-2-17
    0 8
    [em_11]
  • ssr
    2020-2-18
    0 9

    站长你好 麻烦问一下改完之后每个标签之间都有一个点该怎么修改 直接下载的附件就改了一下颜色

  • ZAESKY
    2020-2-18
    0 10
    ssr 站长你好 麻烦问一下改完之后每个标签之间都有一个点该怎么修改 直接下载的附件就改了一下颜色
    给table li{float:left;margin:5px 0px;}这行代码里面加入list-style:none,就像这样table li{float:left;margin:5px 0px;list-style:none;}
  • kelao
    2020-2-19
    0 11
    这个不错!
  • kenobi
    2020-2-20
    0 12
    大佬牛逼
  • 78727704
    2020-2-21
    0 13
    学习了
  • 马里奥先森
    2020-2-21
    0 14
    感谢站长分享
  • vippai
    2020-2-25
    0 15
    [em_14]
  • qidouhai
    2020-2-26
    0 16
    怎么设置成多彩标签
  • ZAESKY
    2020-2-26
    0 17
    qidouhai 怎么设置成多彩标签
    你是指哪里的多彩标签呢,官方的插件可以支持设置颜色
  • qidouhai
    2020-2-26
    0 18
    ZAESKY 你是指哪里的多彩标签呢,官方的插件可以支持设置颜色
    哦,好吧,哈哈,你不说我还没有看见
  • lenling
    2020-2-26
    0 19
    [em_3]还不错
  • 9xiaoyuns
    2020-2-27
    0 20


    四个并排不到一起改哪里。。。

  • 3
    2020-3-1
    0 21
    ,,
  • 718853634
    2020-3-1
    0 22
    希望对我有用[em_1]
  • qqrgo
    2020-3-1
    0 23
    同为学生,有点不同
  • ZAESKY
    2020-3-1
    0 24
    qqrgo 同为学生,有点不同
    加油呀,努力做自己喜欢的事[em_30]
  • 3
    2020-3-3
    0 25

    怎么做才可以不让这个显示?

  • ZAESKY
    2020-3-3
    0 26
    3 怎么做才可以不让这个显示?
    把plugin\xn_tag\hook\thread_list_inc_subject_after.htm 里面的内容注释或删除
  • 3
    2020-3-6
    0 27
    ZAESKY 把plugin\xn_tag\hook\thread_list_inc_subject_after.htm 里面的内容注释或删除

    大佬还有这个,怎么让他不显示?


  • ZAESKY
    2020-3-6
    0 28
    3 大佬还有这个,怎么让他不显示?
    把plugin\xn_tag\hook\thread_subject_end.htm 文件里面的内容删除或注释。
  • qqrgo
    2020-3-8
    0 29
    来领附件了
  • KUIUK
    2020-3-8
    0 30

    我这个标签一点击就出现两个空格,这个应该怎么修改

  • wer43210
    2020-3-10
    0 31
    正需要这个呢
  • 风轻云淡
    2020-3-10
    0 32
    看看
  • haidishayu
    2020-3-11
    0 33
    正需要这个呢
  • sqxxz
    2020-3-12
    0 34
    谢谢分享
  • 启辉儿
    2020-3-13
    0 35
    [em_1]
  • 马里奥先森
    2020-3-13
    0 36
    站长,官方好像把 标签插件升级到 v2.6 版了,我们直接点击更新会不会 把之前修改的 全都覆盖了,那不是白干了..
  • ZAESKY
    2020-3-13
    0 37
    马里奥先森 站长,官方好像把 标签插件升级到 v2.6 版了,我们直接点击更新会不会 把之前修改的 全都覆盖了,那不是白干了..
    是的 ,做好备份替换下文件就行了
  • 马里奥先森
    2020-3-13
    0 38
    ZAESKY 是的 ,做好备份替换下文件就行了
    挺久没去官方后台看,一看就发现有更新了[em_2]
  • aixiu
    2020-3-15
    0 39
    谢谢分享
  • 王宝义
    2020-3-15
    0 40
  • 1349920358
    2020-3-17
    0 41
    我看看
  • free
    2020-3-20
    0 42
    [em_7]
  • 去玩儿过
    2020-3-21
    0 43
    [em_7]
  • 1373937439
    2020-3-28
    0 44
    [em_13]
  • pipi
    2020-3-29
    0 45
    1111111
  • lumingjin
    2020-4-8
    0 46
    kk
  • qwerty
    2020-4-9
    0 47
    fsdafdsf
  • qwert
    2020-4-12
    0 48
    wqdw
  • jiesamu
    2020-4-13
    0 49
    666
  • wen9
    2020-4-13
    0 50
    顶一下
  • kaxinyi
    2020-4-17
    0 51
    我来看看
  • 775234257
    2020-4-21
    0 52
    很棒!!!!
  • 775234257
    2020-4-21
    0 53
    ZAESKY 是的 ,做好备份替换下文件就行了

    这一块如何让他不显示

  • ZAESKY
    2020-4-21
    0 54
    775234257 这一块如何让他不显示
    插件里面设置
  • 2019368950
    2020-4-25
    0 55
    顶一下
  • Godtokoo
    2020-4-27
    0 56
    支持啊
  • lanu
    2020-4-28
    0 57
    感谢分享
  • wangzidekucha
    2020-4-30
    0 58
    我来看看
  • 784700
    2020-5-1
    0 59
    支持
  • shisan
    2020-5-1
    0 60
    可以不咯
  • wut3158
    2020-5-4
    0 61
    d
  • RZLTX
    2020-5-4
    0 62
    感谢分享
  • 2844968475
    2020-5-8
    0 63
    来看看
  • guxiaomo
    2020-5-8
    0 64
    不错
  • 15617775559
    2020-5-15
    0 65
    123
  • nxfys
    2020-5-19
    0 66
    [em_11]想找的就是这个
  • no7tool
    2020-5-21
    0 67
    666666
  • george
    2020-5-31
    0 68
    顶一下
  • ajkajk
    2020-6-1
    0 69
    xx
  • larry
    2020-6-13
    0 70
    试试
  • xiaohai921
    2020-6-16
    0 71
    感谢站长分享
  • 阿新
    2020-6-22
    0 72
    顶一下
  • alanye
    2020-7-1
    0 73
    [em_1]
  • 1164688800
    2020-7-4
    0 74
    uuuuuuuuuuu
  • 1164688800
    2020-7-4
    0 75

    怎么办这个标签换个位置放在前面

  • 1164688800
    2020-7-4
    0 76
    ZAESKY 插件里面设置

    你好,怎么把这个放在前面不放在后面

  • 过眼云烟
    2020-7-8
    0 77
    好东西
  • 271110
    2020-7-20
    0 78
    哈哈哈
  • 1597016898
    2020-7-20
    0 79
    谢谢
  • mailes
    2020-7-27
    0 80
    感谢 找了好久了!
  • MoGuyule
    2020-7-30
    0 81
    这个不错!
  • 511716154
    2020-8-5
    0 82
    看一下
  • 一只猫
    2020-8-10
    0 83
    奈斯
  • gua
    2020-8-30
    0 84
    6666
  • yz086
    2020-9-4
    0 85
    先回复并刷新
  • chifu
    2020-10-16
    0 86
    顶一下
  • wbsliang
    12月前
    0 87
    谢谢
  • wbsliang
    12月前
    0 88
    谢谢!!
  • xiangxi
    11月前
    0 89
    感谢老大
  • mjj
    11月前
    0 90
    学习一下
  • anyiwl
    11月前
    0 91
    看看
  • 935200
    11月前
    0 92
    6666
  • Charm
    9月前
    0 93
    111
  • tl4423
    7月前
    0 94
    66666666
  • xingkong
    7月前
    0 95
  • 秋秋
    6月前
    0 96
    666
  • ssxq
    6月前
    0 97
    学习
  • xiaoluobo
    6月前
    0 98
    谢谢楼主分享
  • wanglixiang
    6月前
    0 99
    收到
  • 66889999
    6月前
    0 100
    [em_2]
返回
作者最近主题
底栏导航插件 2.0修复版
阅读 703 评论 51
今日发帖标识
阅读 449 评论 3
给首页增加一个等级进度显示
阅读 598 评论 33
在线用户显示标识
阅读 547 评论 3
页面滚动距离显示
阅读 429 评论 1