- This topic has 18 replies, 4 voices, and was last updated 3 years, 2 months ago by
.
-
Posts
-
Looking to implement a visual star rating system on the front end. I used the following PHP from the link here:
https://gist.github.com/diggeddy/ef3dc0315a73c0caad839c5348b89aa6I can get it to work with the short code if I manually put in a number, but I can’t seem to get the dynamic field to populate. The guy who posted the dynamic version of the php never said how he implemented it.
Any ideas? or a better version of how to do this?
Customer Support
Hi Justin,
You can try something like this:
function make_star_bar( $atts ) { $value = get_post_meta( get_the_ID(), 'ADD_YOUR_POST_META_KEY_HERE' ); $prefix = 'star-bar-'; $uniqueClass = 'custom-star-rating'; $percentage = 100 * $value['stars'] / 5; $html = '<span class="'.$uniqueClass.'">★★★★★</span> <style> .'.$uniqueClass.' { background: linear-gradient(90deg, '. $value['color'] . ' ' . $percentage .'%, rgba(0,0,0,0) '. $percentage.'%); color: rgba(0,0,0,.2); background-clip: text; -webkit-background-clip: text; color: rgba(0,0,0,.2); } </style> '; return $html; } add_shortcode('star_bar', 'make_star_bar');Just replace
ADD_YOUR_POST_META_KEY_HEREin your code with your post meta field name.With this, the shortcode
[star_bar]should automatically generate stars based on your ACF post meta value.For some reason, the stars are showing all grey and 5 stars. If I enter “1” into my field, it still shows as 5 grey stars?
Can I see where you’ve implemented this?
You may use the Private Information field for this: https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information
On the first product, you can see the #3 underneath. That’s the actual star rating. The other yellow stars you can ignore. I added those manually myself into the custom field.
Can you try hooking the Shortcode into the actual product page first to test if it works? Use a Hook Element.
So all the pages are in draft mode. But I still hooked the shortcode in under the entry title. As an example, one product should be 3 stars but I still ended up with the 5 grey stars.
Customer Support
The PHP Snippet here:
That should work.
On this line:$rating_term = get_field('rating');The
ratingneeds to be replaced with the name of your Custom Field.And then you just need to add the
[star_bar]shortcode to your post.Hi David – “rating” is the name of my custom field.
If you go to the page in the private section, I have 2 shortcodes setup. The first is via the solution you just provided and the second is with my manual insertion “[star_bar stars=”3.7″]” – So it doesn’t seem to be pulling through the dynamic data.
In ACF what is the field type settings ?
Filed type = Number
Validation = Min 1, Max 5
Step Size = 0.1I wrote this function that removes the shortcode atts:
function make_star_bar() { $rating = get_post_meta( get_the_ID(), 'rating', true ); if ( $rating ) { $color = '#f00'; $prefix = 'star-bar-'; $uniqueClass = uniqid($prefix); $percentage = 100 * $rating / 5; $html = '<span class="'.$uniqueClass.'">★★★★★</span> <style> .'.$uniqueClass.' { background: linear-gradient(90deg, '. $color . ' ' . $percentage .'%, rgba(0,0,0,0) '. $percentage.'%); color: rgba(0,0,0,.2); background-clip: text; -webkit-background-clip: text; color: rgba(0,0,0,.2); } </style> '; return $html; } } add_shortcode('star_bar', 'make_star_bar');And i tested that with an ACF field as per your settings and it worked.
Let me know
seems like nothing is being output now. Everything dissapeared from the page?
I’m assuming the shortcode should remain, which it is.
Do you still have the other shortcode functions on the site ? If so remove all of them aside from the one i provided above.
Yes, there aren’t any other short codes. I do have other dynamic data populated but I don’t think that’s relevant. I’m still seeing it show up as blank.
- You must be logged in to reply to this topic.
