css 如何更改WooCommerce中S的评论评级？

bz4sfanl 于 2022-12-24 发布在其他

关注(0)|答案(4)|浏览(131)

如何将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
}

css

来源：https://stackoverflow.com/questions/36428079/how-do-i-change-the-review-ratings-from-ss-in-woocommerce

4条答案

按热度按时间

bvuwiixz1#

在您的CSS中使用此命令：

.woocommerce .star-rating span {
   font-family:star;
}

赞(0）回复(0）举报 2022-12-24

ev7lccsx2#

在我的例子中，this answer帮助了我。
我添加到style.css我的孩子主题下一个代码：

@font-face {
    font-family: 'star';
    src: url('../../plugins/woocommerce/assets/fonts/star.eot');
    src: url('../../plugins/woocommerce/assets/fonts/star.eot?#iefix') format('embedded-opentype'),
        url('../../plugins/woocommerce/assets/fonts/star.woff') format('woff'),
        url('../../plugins/woocommerce/assets/fonts/star.ttf') format('truetype'),
        url('../../plugins/woocommerce/assets/fonts/star.svg#star') format('svg');
    font-weight: normal;
    font-style: normal;
}

完整路径，让您更好地了解正在发生的事情：

在此处添加代码：/wp-content/themes/gon-child/style.css
字体所在的原始位置：/wp-content/plugins/woocommerce/assets/fonts/

赞(0）回复(0）举报 2022-12-24

rqenqsqc3#

可能有一个css覆盖了项目的字体样式。导致此问题的示例代码：

*{
    font-family:'Raleway' !important;
}

点击浏览器的devtools项，查找在它下面定义的可能到达它的样式，然后禁用它，你会看到星星会被加载

赞(0）回复(0）举报 2022-12-24

qfe3c7zg4#

如果您正在使用Nginx（或带有nginx服务的docker），不要忘记向nginx.conf添加字体文件的权限

# Static files
location ~* ^.+\.(jpg|jpeg|gif|css|png|js|ico|svg|html|txt|eot|ttf|woff)$ {
    access_log        off;
    add_header        Vary Accept-Encoding;
    expires           30d;
}

赞(0）回复(0）举报 2022-12-24

我来回答

css 如何更改WooCommerce中S的评论评级？

4条答案

相关问题

热门标签

最新问答