如何将WooCommerce中的评论评级图像从当前的“S”更改为实际的星星图像?
经过一个很好的谷歌搜索,我已经尝试了这个:Replace theme ratings with WooCommerce stars
但是没用,它只是把S变成了小盒子。
当前CSS:
.woocommerce .star-rating {
float:right;
overflow:hidden;
position:relative;
height:1em;
line-height:1;
font-size:1em;
width:5.4em;
font-family: HelveticaNeue-Light, Helvetica Neue Light;
}
.woocommerce .star-rating:before {
content:"\73\73\73\73\73";
color:#d3ced2;
float:left;
top:0;
left:0;
position:absolute;
}
.woocommerce .star-rating span {
overflow:hidden;
float:left;
top:0;
left:0;
position:absolute;
padding-top:1.5em;
}
.woocommerce .star-rating span:before {
content:"\53\53\53\53\53";
top:0;
position:absolute;
left:0
}
4条答案
按热度按时间bvuwiixz1#
在您的CSS中使用此命令:
ev7lccsx2#
在我的例子中,this answer帮助了我。
我添加到
style.css
我的孩子主题下一个代码:完整路径,让您更好地了解正在发生的事情:
在此处添加代码:
/wp-content/themes/gon-child/style.css
字体所在的原始位置:
/wp-content/plugins/woocommerce/assets/fonts/
rqenqsqc3#
可能有一个css覆盖了项目的字体样式。导致此问题的示例代码:
点击浏览器的devtools项,查找在它下面定义的可能到达它的样式,然后禁用它,你会看到星星会被加载
qfe3c7zg4#
如果您正在使用Nginx(或带有nginx服务的docker),不要忘记向nginx.conf添加字体文件的权限