Streaming live at 10am (PST)

Use CMS for displaying star ratings in collection posts


#1

Hello Everyone,

I am new to this forum so hope I have posted in the correct place.

I am using the CMS system to design my golf packages and I would like to have an option to display the star rating of the accommodation included in the package. For example, when I add a new package there will be a dropdown option named star rating and have options to choose either 3, 4 or 5 star. Then on the frontend page I would like to display the choice with perhaps images of stars that reflect the backend choice.

Is this possible?

Thanks,
Kevin


#2

Currently Webflow doesn’t have such a component. Would you like to be the first to add a request to our wishlist? https://wishlist.webflow.com/ideas


#3

You could create the value selection in your CMS collection and upload different image for each value, then display the appropriate image for the selected value.

Image 1 - Single star
Image 2 - Two stars
Image 3 - Three stars

etc.


#4

That’s a good workaround! I’ve created a demo:

http://cms-rating.webflow.io

How it’s done: https://preview.webflow.com/preview/cms-rating?preview=4a6686962d592ed9cc6b8ca567587193

Replace [RATING] with the CMS rating field, where you populate a dropdown field with values 1-5

<script>
var imgUrl = "https://s0.wp.com/wp-content/mu-plugins/wpcom-smileys/twemoji/2/svg/2b50.svg";
for(let i = 0; i < [RATING]; i++) {
  document.write('<img width="12px" src="'+ imageUrl +'" />');
}
</script>


#5

That’s what we did here: https://webflow.com/vs/wordpress :slight_smile:


#6

Thank you Samliew, what a great response! :clap: Really appreciate your help, I’ll be sure to share my finished version!