Ошибка рейтинга Woocommerce

Question

Я пытаюсь создать тему woocommerce, но звездные рейтинги не работают должным образом.

Это код для отображения звездного рейтинга.

<div class="rating-custom">
  <?php wc_get_template( 'single-product/rating.php' ); ?>
</div>

Это мойCSS

.woocommerce-product-rating {
  margin-bottom: 1.618em;
  line-height: 2;
}
.woocommerce-product-rating .star-rating {
  margin: 0.5em 4px 0 0;
  float: left;
  font-family: star;
}
.woocommerce-product-rating::after, .woocommerce-product-rating .rating-custom, .woocommerce-product-rating::before {
  content: " ";
  display: table;
}
.star-rating {
  float: right;
  overflow: hidden;
  position: relative;
  height: 1em;
  line-height: 1;
  font-size: 1em;
  width: 5.4em;
  font-family: star;
}
.star-rating::before {
  content: "SSSSS";
  color: #d3ced2;
  float: left;
  top: 0;
  left: 0;
  position: absolute;
}
.star-rating span {
  overflow: hidden;
  float: left;
  top: 0;
  left: 0;
  position: absolute;
  padding-top: 1.5em;
}
.star-rating span::before {
  content: "SSSSS";
  top: 0;
  color: red;
  position: absolute;
  left: 0;
}

Но мой результат только "$$$"

фактический результат

Может кто-нибудь помочь мне с тем, как сделать эту работукак я хочу?

Answer 1

После Obsidian Age ответа, я добавил эту строку кода в мой тег span: font-family: 'star'

И теперь все идет гладко.Ты к зипкундану и за помощь!