Rapid Reviews / Star Rating - Collection Page
Star Rating - Collection Page
The Star Rating Snippet will show a star rating and link to any Reviews & Questions widget on the page. Note that this widget is only applicable to the respective page’s Shopify entity type, like product
, collection
, or page
.
If you would like to show a star rating inside of collection result tiles, please reference our Liquid & Metafield Access.
Options
Selector | Attribute | Output | Description |
---|---|---|---|
.rapid_reviews_stars_badge |
data-count |
★★★★☆ (20) |
Reviews count as number like data-count="20" |
data-r |
★★★★☆ 20 Reviews |
Show reviews label from translations. | |
data-label |
★★★★☆ 20 Reviewerinos |
Show custom reviews label, like data-label="Reviewerinos" . |
|
data-rh |
Hide reviews count and label. | ||
data-q |
★★★★☆ 20 Reviews 7 Questions |
Show questions label from translations. | |
q_count |
★★★★☆ 20 Reviews 7 Questions |
Questions count as number like data-q_count="20" |
|
data-q_label |
★★★★☆ 20 Reviews 7 Quandries |
Show custom questions label, like data-label="Quandries" . |
|
data-qh |
Hide questions count and label. |
~CE
<!--
COLLECTION PAGE EXAMPLE
CORE SCRIPT NEEDED ON PAGE (FROM BOTTOM OF THIS EXAMPLE CODE SECTION)
THIS WOULD BE AN EXAMPLE FOR ADDING PRODUCT RATINGS TO A COLLECTION PAGE PRODUCT LIST
-->
{%- assign avg = product.metafields.rapid_reviews.counts.value.r.rating.avg -%}
{%- unless avg %}{%- assign avg = 0 -%}{% endunless -%}
{%- assign count = product.metafields.rapid_reviews.counts.value.r.counts.core.total -%}
{%- unless count %}{%- assign count = 0 -%}{% endunless -%}
{% if count > 0 %}<div class="rapid_reviews_stars_badge" data-avg="{{ avg }}" data-count="{{ count }}" data-url="{{ product.url }}"></div>{% endif %}
<!--
COLLECTION PAGE EXAMPLE - WITH QUESTIONS
CORE SCRIPT NEEDED ON PAGE (FROM BOTTOM OF THIS EXAMPLE CODE SECTION)
THIS WOULD BE AN EXAMPLE FOR ADDING PRODUCT RATINGS TO A COLLECTION PAGE PRODUCT LIST
-->
{%- assign avg = product.metafields.rapid_reviews.counts.value.r.rating.avg -%}
{%- unless avg %}{%- assign avg = 0 -%}{% endunless -%}
{%- assign countReviews = product.metafields.rapid_reviews.counts.value.r.counts.core.total -%}
{%- unless countReviews %}{%- assign countReviews = 0 -%}{% endunless -%}
{%- assign countQuestions = product.metafields.rapid_reviews.counts.value.q.counts.core.total -%}
{%- unless countQuestions %}{%- assign countQuestions = 0 -%}{% endunless -%}
{% if countReviews > 0 and countQuestions > 0 %}<div class="rapid_reviews_stars_badge" data-avg="{{ avg }}" data-count="{{ countReviews }}" data-url="{{ product.url }}" data-q="1" data-q_count="{{ countQuestions }}"></div>{% endif %}
<!--
MANUAL INIT AFTER CORE SCRIPT EXECUTED
E.G. MAYBE YOU HAVE A MODAL THAT IS TRIGGERED ON CLICK
-->
<script>
window.rr_drawStarsBadge()
</script>
<!--
CORE SCRIPT NEEDED ON PAGE
-->
<script>
;(function(){
if (window.r_u_loaded) return; window.r_u_loaded = 1;
var rvsc = document.createElement('script'); rvsc.type = 'text/javascript'; rvsc.async = 'true';
rvsc.src = 'https://apps.belkapp.com/api/reviews/files/{{ shop.permanent_domain }}/rapid-reviews-core';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(rvsc, s);
})();
</script>