Hello! I need some help in displaying average ratings for each items on a Dynamic Category page .
I recently followed step by step the Corvid Tutorial to add ratings and reviews to my website. Instead of a Wix store I adapted this slightly to use the feature with dynamic pages.
Now I’m wondering if it’s possible to use the average ratings generated on each individual dynamic page and correctly display them under their corresponding item on the main index .
I currently have the rating images as a placeholder on the main index page, but they are not attached to any data and thus not updating. Is there a way for me to pull the data to get all average ratings to show on the main index page, correctly assigned to each individual item?
If someone can help me by sharing some code that I can put directly on my Dynamic Category Page it would be very appreciated. For information purpose, please find below the code I used for ratings and reviews on Dynamic Item page and that works fine.
Thanks in advance for your help!
// API Reference: https://www.wix.com/velo/reference/api-overview/introduction
// “Hello, World!” Example: https://learn-code.wix.com/en/article/1-hello-world
//-------------Imports-------------//
import wixData from 'wix-data';
import wixWindow from 'wix-window';
//-------------Global Variables-------------//
// Current product.
let presta;
//-------------Page Setup-------------//
$w.onReady(async function() {
// Set the global product variable to the currently displayed product.
presta = await $w('#dynamicDataset').getCurrentItem();
// Load the current product's reviews using the initReviews() function.
initReviews();
});
// Loads the current product's reviews.
async function initReviews() {
// Filter the "Reviews" dataset to contain only the reviews on the currently displayed product.
await $w('#Reviews').setFilter(wixData.filter().eq('prestaId', presta._id));
// Show the reviews after the filter was set and applied on the dataset
showReviews();
// Load the current product's statistics using the loadStatistics() function.
loadStatistics();
}
// Load the current product's statistics.
async function loadStatistics() {
// Get the statistics data based on the current product's ID.
const stats = await wixData.get('review-stats1', presta._id);
// If statistics data for the product was found:
if (stats) {
// Compute the product's average rating by dividing the total points by the number of ratings.
let avgRating = (Math.round(stats.rating * 10 / stats.count) / 10);
// Compute the percentage of reviewers that recommend the product.
let percentRecommended = Math.round(stats.recommended / stats.count * 100);
// Get the ratings element.
let ratings = $w("#generalRatings, #ratingsDisplay1");
// Set the ratings element's average rating to the value calculated above.
ratings.rating = avgRating;
// Set the ratings element's number of ratings to the count value from the statistics data.
ratings.numRatings = stats.count;
// Set the text for the recommended percentage element.
$w('#recoPercent').text = `${percentRecommended} % des mariés nous recommandent`;
// Show the ratings element.
$w('#generalRatings, #ratingsDisplay1').show();
// If there is no statistics data for the product:
} else {
// Set the text for the recommended percentage element to reflect the fact that there are no reviews.
$w('#recoPercent').text = 'Aucun avis pour le moment';
}
// Show the recommended percentage element only after it is populated to avoid flickering.
$w('#recoPercent').show();
}
//-------------Data Setup -------------//
// Perform some setup when the dataset filter was completed.
export function showReviews() {
// If at least one review has been submitted:
if ($w('#Reviews').getTotalCount() > 0) {
// Expand the strip that displays the reviews.
$w('#reviewsStrip').expand();
// If there are no reviews:
} else {
// Collapse the strip that displays the reviews.
$w('#reviewsStrip').collapse(); //otherwise, hide it
}
}
//-------------Event Handlers -------------//
// Set the action that occurs when a user clicks the "Write a Review" button.
export async function addReview_click(event, $w) {
// Create an object containing the current product's ID to be sent to the review writing lightbox.
const dataForLightbox = {
prestaId: presta._id
};
// Open the "Review Box" lightbox, send it the object created above, and wait for it to close.
let result = await wixWindow.openLightbox('Review Box 2', dataForLightbox);
// After the review lightbox is closed, refresh the reviews dataset so the new review appears on the page.
$w('#Reviews').refresh();
// Reload the current products statistics to reflect the new rating.
loadStatistics();
// Show a thank you message.
$w('#thankYouMessage').show();
}
// Set the action that occurs when a user clicks the "Load More" text.
export function resultsPages1_click(event, $w) {
// Load additional reviews into the reviews repeater.
$w('#Reviews').loadMore();
}
