8wDlpd.png
8wDFp9.png
8wDEOx.png
8wDMfH.png
8wDKte.png
点赞、收藏按钮美化修改教程
ZAESKY 4月前

如果你是使用的本站的主题会发现在帖子内页已经集成显示点赞,收藏数量

美化后

那么在默认的点赞收藏插件也会显示点赞收藏数量,这样就不太美观整体,下面就教大家怎么美化这两个按钮。当然不是用本站主题的也可以这样修改。

修改教程-点赞按钮

因为是两个不同的插件,我们先修改点赞按钮。

找到文件plugin\haya_post_like\hook\thread_plugin_body.htm 把下面这段代码加入到文件中。或者自定义样式也可以。

<style>
	.dz{color:#FF4542;border-color:#FF4542;}
	.dz:hover{background:#FFE6D9;color:#FF4542;border-color:#FF4542;}
	.dz:not(:disabled):not(.disabled):active,
	.dz:not(:disabled):not(.disabled).active,
	.show > .dz.dropdown-toggle:focus:active{background:#FFE6D9;color:#FF4542;border-color:#FF4542;}
</style>

像这样:

然后再把类名“dz”加入到以<button...开头的类名里面。共有两处。(类名可自定义。需要跟上面的CSS类名一致。)

如果需要删除点赞数量可以删除大概第34-36行,最后一个以<button...开头的的标签内容。

修改教程-收藏按钮

接下来再修改收藏按钮。方法跟上面的点赞按钮教程差不多。

找到plugin\haya_favorite\hook\thread_plugin_body.htm 把下列代码添加到原有的<style>标签里面。或者自定义样式也可以。

.sc{color:#FFA70F;border-color:#FFA70F;}
.sc:hover{background:#FFF4CF;color:#FFA70F;border-color:#FFA70F;}
.sc:not(:disabled):not(.disabled):active, .sc:not(:disabled):not(.disabled).active,
.show > .sc.dropdown-toggle:focus:active{background:#FFF4CF;color:#FF4542;border-color:#FFA70F;}

像这样

然后把类名“sc”添加到以<button...开头的那一行里面。共两处(类名可自定义,需要跟上面的CSS类名一致。)

删除显示数量把大概40-42行最后一个以<button...开头的标签删除。

下载

不想修改的话直接下载我修改好的替换掉对应插件路径原文件。

第一个文件是点赞插件替换文件。

第二个文件是收藏插件替换文件。

本帖中包含附件
最新回复 (51)
  • KUIUK
    4月前 2
    0
    来了来了,他真的来了,
  • ZAESKY
    4月前 3
    0
    KUIUK 来了来了,他真的来了,
  • KUIUK
    4月前 4
    0


    3AZCNt.jpg

    这两个功能都一样吧,应该删掉一个

  • ZAESKY
    4月前 5
    0
    KUIUK 这两个功能都一样吧,应该删掉一个
    你要是想删掉下面那个可以找到文件plugin\ax_notice_sx\hook\thread_delete_after.htm 注释里面的内容或者删除这个文件,你要是想删掉上面的可以找到文件plugin\zaesky_theme_zhihulan\overwrite\view\htm\thread.htm删掉第30-32行。
  • KUIUK
    4月前 6
    0
    OK,很nice
  • 汉克
    4月前 7
    0
    哟西
  • kelao
    4月前 8
    0
    这个也不错!
  • glxhydue
    4月前 9
    0
    这个真的好看
  • 无聊
    4月前 10
    0
    支持
  • 马里奥先森
    4月前 11
    0
    每个教程都非常详细感谢站长啊
  • vippai
    4月前 12
    0
  • lenling
    4月前 13
    0
    苏喂苏喂
  • 有志者事竟成
    4月前 14
    0
  • 3
    4月前 15
    0
    111
  • 启辉儿
    4月前 16
    0
  • wer43210
    4月前 17
    0
    牛逼了
  • 小萌鸭
    4月前 18
    0
    做的都很好看,爱了!!!!
  • 风轻云淡
    4月前 19
    0
    看看
  • haidishayu
    4月前 20
    0
    来了来了,他真的来了,
  • HSAllenbili
    4月前 21
    0
    谢谢
  • sqxxz
    4月前 22
    0
    谢谢分享
  • 雨落
    4月前 23
    0
    谢谢分享
  • zdxz
    4月前 24
    0
    我来啦
  • web
    4月前 25
    0
    测试
  • 王宝义
    4月前 26
    0
    不错啊,太牛了
  • 一个seo
    4月前 27
    0
    这主题安装教学真是详细
  • LGzzz
    4月前 28
    1
    感谢分享
  • tinfeng
    4月前 29
    0
    感谢分享
  • 去玩儿过
    3月前 30
    0
    谢谢分享
  • sssss
    3月前 31
    0
  • 1373937439
    3月前 32
    0
  • 1525376187
    3月前 33
    0
    nice
  • qidouhai
    3月前 34
    0
  • 784700
    2月前 35
    0
    dggd
  • 775234257
    2月前 36
    0
    牛逼!!!!!!!!
  • lanu
    2月前 37
    0
    感谢分享
  • shisan
    2月前 38
    0
    恩,伸手党
  • 一只猫
    2月前 39
    0
    伸手
  • wut3158
    2月前 40
    0
    d
  • 月光村
    2月前 41
    0
    这主题安装教学真是详细
  • 先生
    2月前 42
    0
    奥利给。
  • guxiaomo
    2月前 43
    0
    支持
  • root123
    2月前 44
    0
    感谢
  • 794229345
    1月前 45
    0
    感谢分享 非常好看
  • george
    1月前 46
    0
    感谢分享
  • xiaohai921
    28天前 47
    0
    OK,很nice
  • 1597016898
    26天前 48
    0
    6666
  • 阿新
    22天前 49
    0
    6666
  • 过眼云烟
    6天前 50
    0
    收到
返回
ZAESKY
本站站长,欢迎留言交流!

  作者最近主题   
  给网站增加每日bing美图