Adding Judge.me widgets in PageFly
Updated over a week ago

PageFly is a powerful and user-friendly page builder on Shopify, offering excellent page speed and flexible customization for creating various page types.

By integrating with Judge.me, you can easily install and display all of our widgets through PageFly.

To install Review Widget, Star Ratings, and review carousel

  • Go to the PageFly page where you want Judge.me widgets to appear.

  • Click Add third-party elements on the left.

  • Choose Edit your 3rd party elements.

  • Search for "Judge.me" and enable the element.

  • Drag and drop the widget you want onto the page.

  • Click Save (or Save & Publish).

To install other widgets

If you wish to add widgets other than the Star Ratings, Review Widget, and Review Carousel, follow these steps:

  • Go to the PageFly page where you want Judge.me widgets to appear.

  • Click Add elements on the left and choose HTML/Liquid.

  • Drag and drop the element onto the page and click Open Code Editor.

Liquid code snippets for various widgets

  • All Reviews Counter

<!-- Start of Judge.me code --> 
<div class='jdgm-widget jdgm-all-reviews-text'>
<a href='javascript:void(0)'>
<span class='jdgm-all-reviews-text__text' data-score='{{ shop.metafields.judgeme.all_reviews_rating }}' data-number-of-reviews='{{ shop.metafields.judgeme.all_reviews_count }}' data-locale='en'>
Customers rate us {{ shop.metafields.judgeme.all_reviews_rating | round: 1 }}/5 based on {{ shop.metafields.judgeme.all_reviews_count }} reviews.
</span>
</a>
</div>
<!-- End of Judge.me code -->
  • Verified Review Count Badge:

<!-- Start of Judge.me code --> 
<div style='clear:both'></div>
<div style='text-align: center'>
<a class='jdgm-verified-count-badget' href='javascript:void(0)'>
{{ shop.metafields.judgeme.verified_badge }}
</a>
</div>
<!-- End of Judge.me code -->
  • Floating Review Tab:

<!-- Start of Judge.me code --> 
<section class='jdgm-widget jdgm-revs-tab' role='complementary'>
{% assign jm_metafields = shop.metafields.judgeme %}
<div class='jdgm-revs-tab-btn btn' position='none' tabindex='0' aria-label='Click to open Judge.me floating reviews tab' role='button'>★ Judge.me Reviews</div>
<div class='jdgm-revs-tab__header'>
<a class='jdgm-close-ico'></a>
<h3 class='jdgm-revs-tab__title'>Let customers speak for us</h3>
<a class='jdgm-revs-tab__url' href='/pages/reviews'>
<div data-score='{{ jm_metafields.all_reviews_rating }}' class='jdgm-all-reviews-rating' aria-label='Average rating is {{ jm_metafields.all_reviews_rating }}' role='img'></div>{{ jm_metafields.all_reviews_count }} reviews
</a>
</div>
{{ jm_metafields.reviews_tab }}
</section>
<!-- End of Judge.me code -->
  • Judge.me Medals

<!-- Start of Judge.me code --> 
{{ shop.metafields.judgeme.medals }}
<!-- End of Judge.me code -->
  • UGC Media Grid

<!-- Start of Judge.me code --> 
<div class='jdgm-widget jdgm-ugc-media-wrapper'data-auto-install='{% if auto_install != nil %}{{ auto_install }}{% else %}false{% endif %}' >
{{ shop.metafields.judgeme.ugc_media_grid }}
</div>
<!-- End of Judge.me code -->
Did this answer your question?