How to display star rating summary

Question

I have removed reviews tab and placed the form in a popup modal.

Now I have displayed all the reviews posted by the customer about the particular product and I have displayed the Rating summary for the Product.

Now I need to get Rating for each customer and display in the following format for each reviews in frontend. Please Provide me a solution to add star rating for each reviews.

This is my collection class I have displayed in frontend like below

For reference

Block file

<?php

namespace XXX\YYY\Block;

use Magento\Framework\View\Element\Template;

class Collection extends Template
{


    protected $_coreRegistry;

    protected $_reviewsColFactory;


    protected $_reviewFactory;
    protected $_voteFactory;

    public function __construct(\Magento\Framework\View\Element\Template\Context $context,\Magento\Review\Model\Rating\Option\VoteFactory $voteFactory, \Magento\Review\Model\ReviewFactory $reviewFactory, \Magento\Framework\Registry $registry, \Magento\Review\Model\ResourceModel\Review\CollectionFactory $collectionFactory, array $data = [])
    {
        $this->_coreRegistry = $registry;
        $this->_reviewsColFactory = $collectionFactory;
        $this->_reviewFactory = $reviewFactory;
         $this->_voteFactory = $voteFactory;
        parent::__construct($context, $data);
    }


    public function getProductId()
    {

        $product = $this->_coreRegistry->registry('product');
        return $product ? $product->getId() : null;
    }


    public function getCollectionSize()
    {
        $collection = $this->_reviewsColFactory->create()->addStoreFilter(
                        $this->_storeManager->getStore()->getId()
                )->addStatusFilter(
                        \Magento\Review\Model\Review::STATUS_APPROVED
                )->addEntityFilter(
                'product', $this->getProductId()
        );

        return $collection->getSize();
    }

    public function getAllreviews()
    {
        $collection = $this->_reviewsColFactory->create()->addStoreFilter(
                        $this->_storeManager->getStore()->getId()
                )->addStatusFilter(
                        \Magento\Review\Model\Review::STATUS_APPROVED
                )->addEntityFilter(
                'product', $this->getProductId()
        );

        return $collection;
    }

    public function getRatingSummary()
    {
        $product = $this->_coreRegistry->registry('product');
        $this->_reviewFactory->create()->getEntitySummary($product, $this->_storeManager->getStore()->getId());
        $ratingSummary = $product->getRatingSummary()->getRatingSummary();
        return $ratingSummary;
    }

}

abc.phtml

<div id="customer-reviews" class="customer-reviews">
    <?php $reviews = $block->getAllreviews(); ?>

    <span><b><?= /* @escapeNotVerified */ __('Rating summary : ') ?></b></span><?php echo $rating = $block->getRatingSummary(); ?><br>

    <div id ="reviews" class="reviews"> <span><b><?= /* @escapeNotVerified */ __('Customer Reviews') ?></b></span><br>
        <?php foreach ($reviews as $review): ?>           
            <span><?= /* @escapeNotVerified */ __('Customer Name : ') ?></span><?php echo $review->getNickname(); ?><br>
            <span><?= /* @escapeNotVerified */ __('Review : ') ?></span><?php echo $review->getDetail(); ?><br>
            <span><?= /* @escapeNotVerified */ __('Date : ') ?></span><?php echo $review->getCreatedAt(); ?><br>

        <?php endforeach; ?>
    </div>
</div> 

Answer 1

For the reviews, the star rating summary is displayed based on the percentage of the rating vote provided in a particular review. Using this rating-vote-percentage, the the star symbol is highlighted using the width property of the span element.

To get the vote percentage, loop your review collection and for each review, get the vote percentage as follows.

foreach ($reviews as $review) {
if (count($review->getRatingVotes())) { 
    foreach ($review->getRatingVotes() as $_vote) { 
        $rating_vote[] =  $_vote->getPercent();
    }
}
else
    $rating_vote = null;
}

Using the $rating_vote_percentage value, you have to apply styles in your own way to indicate the star rating.

Use this code in your abc.phtml file accordingly.

To display the star rating for each review, just replace the whole code in your abc.phtml file with the below code.

<div id="customer-reviews" class="customer-reviews">
<?php $reviews = $block->getAllreviews(); ?>

<span><b><?= /* @escapeNotVerified */ __('Rating summary : ') ?></b></span><?php echo $rating = $block->getRatingSummary(); ?><br>

<div id ="reviews" class="reviews"> <span><b><?= /* @escapeNotVerified */ __('Customer Reviews') ?></b></span><br>
    <?php foreach ($reviews as $review): ?>  
    <?php
        if (count($review->getRatingVotes())) { 
            foreach ($review->getRatingVotes() as $_vote) { 
                $rating_vote =  $_vote->getPercent();
            }
        }
        else
            $rating_vote = 0;

    ?>      
        <span><?= /* @escapeNotVerified */ __('Customer Name : ') ?></span><?php echo $review->getNickname(); ?><br>
        <span><?= /* @escapeNotVerified */ __('Review : ') ?></span><?php echo $review->getDetail(); ?><br>
        <span><?= /* @escapeNotVerified */ __('Date : ') ?></span><?php echo $review->getCreatedAt(); ?><br>

        <span><?= /* @escapeNotVerified */ __('Rating : ') ?></span>
        <div class="rating-result" >
            <meta itemprop="worstRating" content = "1"/>
            <meta itemprop="bestRating" content = "100"/>
            <span style="width:<?php echo $rating_vote; ?>%">
                <span itemprop="ratingValue"><?php echo $rating_vote; ?>%</span>
            </span>
        </div>

    <?php endforeach; ?>
</div>

Answer 2

Try to use bellow code in your phtml file You should not use the ObjectManager directly!

<?php
$productId = 'your_product_id';
$objectManager = \Magento\Framework\App\ObjectManager::getInstance();
$reviewFactory = $objectManager->create('Magento\Review\Model\Review');
$product = $objectManager->create('Magento\Catalog\Model\Product')->load($productId);
$storeManager  = $objectManager->create('\Magento\Store\Model\StoreManagerInterface');
$storeId = $storeManager->getStore()->getStoreId();
$reviewFactory->getEntitySummary($product, $storeId);

$ratingSummary = $product->getRatingSummary()->getRatingSummary();
$reviewCount = $product->getRatingSummary()->getReviewsCount();
?>
<?php if($ratingSummary){ ?>
<div class="product-reviews-summary short">
    <div class="rating-summary">
        <div title="<?php echo (int)$ratingSummary; ?>%" class="rating-result">
            <span style="width:<?php echo (int)$ratingSummary; ?>%"><span><?php echo (int)$ratingSummary; ?>%</span></span>
        </div>
    </div>
    <div class="reviews-actions">
        <?php echo __('('.$reviewCount.') Reviews'); ?>
    </div>
</div>
<?php } ?>

Answer 3

How I get a product's star rating. Very easy to implement throughout a site.

<?php $_rating = Mage::getModel('review/review_summary')->load($_product->getId()); ?>

<?php if ($_rating['rating_summary']) {?>
  <div class="ratings">
      <div class="rating-box">
         <div class="rating" style="width:<?php echo $_rating['rating_summary']; ?>%"></div>
      </div>
  </div>
<?php } ?>