Xenforo的like功能很实用,但不怎么直观,这么经典的功能,最好能够加强显示效果,达到美观、易用、便于操作的目的,效果如下
结合国外的网站介绍,解决办法如下:
进入管理后台,模板编辑,打开EXTRA.css,添加:
.message .messageMeta .publicControls .control, .messageSimple .messageMeta .publicControls .control { text-decoration: none; background-color: #eeeeee; padding: 0 13px; margin-top: -5px; margin-left: 3px; border: 1px solid #e2e2e2; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; -khtml-border-radius: 2px; line-height: 24px; text-shadow: #fff 0px 1px 0px; } .publicControls .like:before, .publicControls .unlike:before, .publicControls .reply:before, .publicControls .postComment:before { content: ""; display: inline-block; width: 16px; height: 16px; background: url('styles/default/xenforo/icons/thumb_up.png') no-repeat 50% 50%; float: left; margin: 4px 6px -5px -4px !important; } .publicControls .unlike:before{ background: url('styles/default/xenforo/icons/thumb_down.png') no-repeat 50% 50%; } .publicControls .postComment:before, .publicControls .reply:before{ background: url('styles/default/xenforo/icons/message_reply.png') no-repeat 50% 50%; }
保存
一定要记住上传CSS中的三个图标文件,我提供了下载地址,如下:
源码引用:http://www.xfteam.info