This topic has 7 replies, 2 voices, and was last updated 1 years, 2 months ago ago by IP
Hello
On product archive/shop page, the product stars/reviews looks like this (https://prnt.sc/_B0XSpd5iCnO) the problem is not the colour of the stars, the problem is the grey stars in the background
I am using this demo (https://xstore.8theme.com/elementor2/sport/shop/)
As you can see in the demo the stars are plain black, there is no problem of the grey stars in the background
Also, on Single Product page (link in PV) the stars in the reviews section looks normal (and how I would like it) – https://prnt.sc/NuQp-mZLOWRh
Please note: I know there is a grey background, what I mean is the actual grey stars behind the yellow stars
Thanks
Hello, @IP,
We have identified the problem you are experiencing with your site. It appears to be due to the Custom CSS that you have implemented. We kindly ask you to refer to the following screenshot for more details: https://postimg.cc/233xYs0f
We recommend locating and removing the padding from this CSS, which should rectify the issue. You should be able to find the CSS under the following path: Xstore >> Theme Options >> Theme Custom CSS >> Global CSS.
Best Regards,
8Theme’s Team
Hello, thanks for your response
This has worked perfectly, can’t believe I didn’t see that. Thanks
I would also like to know if something like this is possible? https://prnt.sc/AOqW2VP1xQmD
Where it shows the numbers of reviews in the brackets?
Thanks
Hello, @IP,
Thank you for your response.
Please check this topic – https://www.8theme.com/topic/reviews-number-next-to-stars-on-every-product-shop-page/
Additionally, We regret to inform you that it is not possible to achieve your desired outcome with the current version of the theme. Item support does not include services to modify or extend the item beyond the original features, style, and functionality described on the item page.
If you would like to pursue paid customization services, we recommend submitting a customization request to the Codeable team via their website: https://www.codeable.io/?ref=qGTdX
Alternatively, you can post your request on our Taskboard at https://www.8theme.com/taskboard/. If it receives enough votes from other customers, our development team will consider adding it in one of the upcoming updates.
Best Regards,
8Theme’s Team
Hello, thank you for your response. This has actually worked and was extremely easy. https://prnt.sc/cElfUNW9eDwd
I would like to know if there is away to put the star rating and number count together? so they are side by side? like this https://prnt.sc/AOqW2VP1xQmD
Thanks
*For anyone reading this who also wants review count like this https://prnt.sc/cElfUNW9eDwd simply locate your hosting files/dreictory and locate public_html > wp-content > themes > x-store > woocommerce > loop
make a new file in the loop folder and name it rating.php
then copy the code from https://stackoverflow.com/questions/46383613/display-woocommerce-review-count-next-to-star-rating (the code is also below)
and paste it in that file then save
Please Backup before doing any of this (I recommend All-in-one WP migration)
CODE:
<?php
/**
* Loop Rating
*
* This template can be overridden by copying it to yourtheme/woocommerce/loop/rating.php.
*
* HOWEVER, on occasion WooCommerce will need to update template files and you
* (the theme developer) will need to copy the new files to your theme to
* maintain compatibility. We try to do this as little as possible, but it does
* happen. When this occurs the version of the template file will be bumped and
* the readme will list any important changes.
*
* @see https://docs.woocommerce.com/document/template-structure/
* @author WooThemes
* @package WooCommerce/Templates
* @version 3.0.0
*/
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
global $product;
if ( get_option( 'woocommerce_enable_review_rating' ) === 'no' ) {
return;
}
$rating_count = $product->get_rating_count();
$review_count = $product->get_review_count();
$average = $product->get_average_rating();
if ( $rating_count >= 0 ) : ?>
<?php echo wc_get_rating_html($average, $rating_count); ?>
<?php if ( comments_open() ): ?><a href="<?php echo get_permalink() ?>#reviews" class="woocommerce-review-link" rel="nofollow">(<?php printf( _n( '%s',$review_count,'woocommerce' ), '<span class="count">' . esc_html( $review_count ) . '</span>' ); ?>)</a><?php endif ?>
<?php endif; ?>
Hello, @IP,
To consolidate the star rating and number count, kindly follow the instructions below:
1. Copy the CSS code provided below:
.content-product .star-rating {
display: inline-block !important;
}
2. Navigate to Xstore >> Theme Options >> Theme Custom CSS >> Global CSS on your site.
3. Paste the copied CSS code into the Global CSS section.
4. Clear your browser cache and revisit your site to see the changes.
It should resolve your issue.
And we are glad to hear the custom code worked for you and that you found it easy to implement. Your instructions are clear and helpful for anyone looking to achieve the same result. It’s always a good practice to recommend making backups before making changes to website files. Thank you for sharing the code and providing a link to the source for reference.
Should you have any further queries or require additional assistance, please do not hesitate to contact us.
Best Regards,
8Theme’s Team
Hello Tony, thanks for your response. This has worked perfectly!
Best support for the best theme.
Have a nice day, thanks.
The issue related to '‘Problem with how the star rating looks on product archive’' has been successfully resolved, and the topic is now closed for further responses