Hugo

Star Rating for hugo sites

Is it possible to have a system in place for rating? What can be used until this is part of hugo :slight_smile: ?

Explain more what you mean

Yes.

As it is not part of Hugo, it is therefore off-topic. Please search elsewhere. :slight_smile:

Hugo makes no assumptions about how you want your site to be; it just assembles what you give it.

If you yourself want to do star ratings on posts, that has always been possible. For instance you could put the rating as an integer or string in content frontmatter, like rating = ★★★, then pull the rating into your Hugo templates. If you want to let visitors rate posts, Hugo does not handle that (how could it?), and you would need to do it with javascript, which isn’t related to Hugo. From your original post @solopx it is unclear what you mean.

The visitors to have the possibility to rate posts and from there somehow to be possible to update the post to make that visible.

I will write the content and I prefer the visitors to be able to rate it. I know that hugo is not making it by default, but I just wanted to know how others are dealing with this important feature.

Maybe you could integrate something like staticman. https://staticman.net/docs/

The easiest way for this is to create a form (you can be creative with this), and link it to record the data in Google Sheets. You can then publish that Google Sheet to the web as a csv, and then use templating to display the results on each post.

1 Like

You may find Staticman with Gitlab written by Donald Boulton’s useful.

Screenshot_2019-05-19_13-40-34

Note that the method described in the linked article has become obsolete due to Staticman’s native GitLab support.

1 Like

This seems very easy and straightforward. It is not (for me) lol

I have the frontmatter in the form of myrating: 5 but converting this number to stars is killing brain cells here. And of course I want a more complicated setup with x gold stars out of 5 stars, with the rest of the stars being grey. I tried a ‘range’ loop from some random site but get errors. Any help you could provide would be greatly appreciated.

Probably something like a with statement, with if statements inside. If you simply use stars directly in the frontmatter like I mentioned, you can keep it simple like this (untested):

{{ with .Params.myrating }}
The Rating: <span class="blah">{{ . }}</span>
{{end}}

If you want to use an integer, you need to convert it inside the with. {{ if eq . "1" }}★{{ end }} (I would need to test this, because it could also be just 1 rather than “1”)

1 Like

I had an epiphany after re-reading your last post. I copied the star icons directly into my front matter in VS Code - did some search/replace, populated the front matter in all book review posts. then .Params.myrating pulled the stars in directly. Seems like a simpler solution.

1 Like