Help Needed for Star Rating System

support
1

I have the parameters in my post markdown files like this

rating: 2.2

rating: 3.1

and my code is

        {{ with .Params.rating }}
        <span class="product-rating" itemprop="reviewRating" itemscope="" itemtype="http://schema.org/Rating">
            <span class="icon-star {{ if lt . "1" }}far fa-star unchecked{{else}}fa fa-star{{if ge . 1 2}}-half{{end}} checked{{end}}"></span>
            <span class="icon-star {{ if lt . "2" }}far fa-star unchecked{{else}}fa fa-star{{if ge . 2 3}}-half{{end}} checked{{end}}"></span>
            <span class="icon-star {{ if lt . "3" }}far fa-star unchecked{{else}}fa fa-star{{if ge . 3 4}}-half{{end}} checked{{end}}"></span>
            <span class="icon-star {{ if lt . "4" }}far fa-star unchecked{{else}}fa fa-star{{if ge . 4 5}}-half{{end}} checked{{end}}"></span>
            <span class="icon-star {{ if lt . "5" }}far fa-star unchecked{{else}}fa fa-star{{if ge . 4 5}}-half{{end}} checked{{end}}"></span>
            <meta itemprop="bestRating" content="5">
            <meta itemprop="worstRating" content="1">
            <meta itemprop="ratingValue" content="{{.}}">
        </span>
        {{ end }}

The whole code in working perfectly. but I want to show the class “-half” if the value is between the numbers like 1.1 or 1.5 etc. But it is showing everywhere if the value is not between them.

Please help me fix

1 Like
2

my Math quite dumb, i need an hour to solve this. Also dont think this is optimized enough.

  {{- with .Params.rating -}}
    {{- $min := 1 -}}
    {{- $max := 5 -}}
    {{- $rating := . -}}
    {{- $baseInt := math.Floor $rating | int -}}

    {{- $decimal := sub $rating $baseInt -}}

    <span class="product-rating" itemprop="reviewRating" itemscope="" itemtype="http://schema.org/Rating">
    {{- range seq $min $max -}}

      {{- $class := "" -}}
      {{- if or (le . $baseInt) (and (eq $baseInt (sub . 1)) (gt $decimal 0.5)) -}}
        {{- /* Full */ -}}
        {{- $class = "fa fa-star checked" -}}
      {{- else if and (eq $baseInt (sub . 1)) (gt $decimal 0) (le $decimal 0.5) -}}
        {{- /* Half */ -}}
        {{- $class = "fa fa-star-half checked" -}}
      {{- else -}}
        {{- /* Empty */ -}}
        {{- $class = "far fa-star unchecked" -}} 
      {{- end -}}

      <span class="icon-star {{ $class }}"></span>

    {{- end -}}

    <meta itemprop="bestRating" content="{{ $max }}">
    <meta itemprop="worstRating" content="{{ $min }}">
    <meta itemprop="ratingValue" content="{{ $rating }}">
  </span>    
  {{- end -}}
3

This isn’t working
Error: can’t apply the operator to the values

Although I am new to this. and not able to understand xD.

4

Are you sure your .Params.rating contains int/float value?

You can test the code above like this:

  {{- $ParamsRating := 1.2 -}}
  {{- with $ParamsRating -}}
    {{- $min := 1 -}}
    {{- $max := 5 -}}
    {{- $rating := . -}}
    {{- $baseInt := math.Floor $rating | int -}}

    {{- $decimal := sub $rating $baseInt -}}

    <span class="product-rating" itemprop="reviewRating" itemscope="" itemtype="http://schema.org/Rating">
    {{- range seq $min $max -}}

      {{- $class := "" -}}
      {{- if or (le . $baseInt) (and (eq $baseInt (sub . 1)) (gt $decimal 0.5)) -}}
        {{- /* Full */ -}}
        {{- $class = "fa fa-star checked" -}}
      {{- else if and (eq $baseInt (sub . 1)) (gt $decimal 0) (le $decimal 0.5) -}}
        {{- /* Half */ -}}
        {{- $class = "fa fa-star-half checked" -}}
      {{- else -}}
        {{- /* Empty */ -}}
        {{- $class = "far fa-star unchecked" -}} 
      {{- end -}}
      {{- warnf "%v %s" . $class -}}
      <span class="icon-star {{ $class }}"></span>

    {{- end -}}

    <meta itemprop="bestRating" content="{{ $max }}">
    <meta itemprop="worstRating" content="{{ $min }}">
    <meta itemprop="ratingValue" content="{{ $rating }}">
  </span>    
  {{- end -}}
5

No It’s like that.

title: Post
review:
 - name: Product Name
   summary: A brief intro of product
   rating: "4.1"
 - name: Product Name 2
   summary: A brief intro of product 2
   rating: "4.4"

and I am doing it like that

{{ range .Params.review}}
 Review of {{.name}}
 Introduction of {{.summary}}


{{- with .rating -}}
    {{- $min := 1 -}}
    {{- $max := 5 -}}
    {{- $rating := . -}}
    {{- $baseInt := math.Floor $rating | int -}}

    {{- $decimal := sub $rating $baseInt -}}

    <span class="product-rating" itemprop="reviewRating" itemscope="" itemtype="http://schema.org/Rating">
    {{- range seq $min $max -}}

      {{- $class := "" -}}
      {{- if or (le . $baseInt) (and (eq $baseInt (sub . 1)) (gt $decimal 0.5)) -}}
        {{- /* Full */ -}}
        {{- $class = "fa fa-star checked" -}}
      {{- else if and (eq $baseInt (sub . 1)) (gt $decimal 0) (le $decimal 0.5) -}}
        {{- /* Half */ -}}
        {{- $class = "fa fa-star-half checked" -}}
      {{- else -}}
        {{- /* Empty */ -}}
        {{- $class = "far fa-star unchecked" -}} 
      {{- end -}}

      <span class="icon-star {{ $class }}"></span>

    {{- end -}}

    <meta itemprop="bestRating" content="{{ $max }}">
    <meta itemprop="worstRating" content="{{ $min }}">
    <meta itemprop="ratingValue" content="{{ $rating }}">
  </span>    
  {{- end -}}


{{end}}
6

Since the front matter parameter is entered as a string i.e. rating: "4.4"

May be you could do:

{{- with .Params.review -}}
...
{{ if in .rating "." }}-half{{ end }}
...
{{- end -}}

This is untested but it should check whether the string contains a dot and include the class half.

7

Already did try that, I gives all of the stars in half!

8

Need to convert it to int/float first

{{ range .Params.review}}
 Review of {{.name}}
 Introduction of {{.summary}}



{{- with .rating -}}
    {{- $min := 1 -}}
    {{- $max := 5 -}}

++  {{- $rating := cond (strings.Contains . ".") (printf "%.1f" ( . | float)) (. | int) -}}
    

    {{- $baseInt := math.Floor $rating | int -}}

    {{- $decimal := sub $rating $baseInt -}}

    <span class="product-rating" itemprop="reviewRating" itemscope="" itemtype="http://schema.org/Rating">
    {{- range seq $min $max -}}

      {{- $class := "" -}}
      {{- if or (le . $baseInt) (and (eq $baseInt (sub . 1)) (gt $decimal 0.5)) -}}
        {{- /* Full */ -}}
        {{- $class = "fa fa-star checked" -}}
      {{- else if and (eq $baseInt (sub . 1)) (gt $decimal 0) (le $decimal 0.5) -}}
        {{- /* Half */ -}}
        {{- $class = "fa fa-star-half checked" -}}
      {{- else -}}
        {{- /* Empty */ -}}
        {{- $class = "far fa-star unchecked" -}} 
      {{- end -}}

      <span class="icon-star {{ $class }}"></span>

    {{- end -}}

    <meta itemprop="bestRating" content="{{ $max }}">
    <meta itemprop="worstRating" content="{{ $min }}">
    <meta itemprop="ratingValue" content="{{ $rating }}">
  </span>    
  {{- end -}}


{{end}}
9

WOrked!!! Thanks

10

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.