Using Yotpo Reviews with Shopify Hydrogen
- DarkLight
Using Yotpo Reviews with Shopify Hydrogen
- DarkLight
Article summary
Did you find this summary helpful?
Thank you for your feedback
Goals and Outcomes
Shopify Hydrogen lets you build custom storefronts with complete design flexibility, and Yotpo Reviews ensures you can showcase customer feedback and star ratings seamlessly within that experience. By integrating the two, you get the best of both worlds: high-performing, personalized storefronts powered by Hydrogen, and trusted review features from Yotpo that drive conversions and build trust.
Requirements:
A Shopify store
An active Yotpo Reviews subscription
A Shopify Hydrogen storefront
In this article, you’ll learn how to use Yotpo Reviews with Shopify Hydrogen.
Integration Process Overview
Step 1: Set Up Your Hydrogen Storefront
Start by setting up a Hydrogen storefront. Use these Shopify resources for reference:
Step 2: Connect Your Storefront to Yotpo Reviews
To display Yotpo reviews and ratings on your store, follow these steps:
Add the JavaScript Library code – Insert Yotpo’s core script into your site's <head> tag to enable widgets.
Install the Reviews Widget – Add the main widget code to your product pages to show customer reviews and star ratings.
Add the Star Rating – Display average product ratings near product descriptions, with a link to full reviews.
Optional: Add More Widgets – Customize your storefront further with additional widgets like Smart Filters, Review Highlights, and Promoted Products.
Set Up Conversion Tracking – Add a tracking script to your order confirmation page to measure how reviews impact sales.
For a more detailed setup, see Integrating your storefront.
Tip
For more flexibility and better performance, we recommend using Yotpo Reviews' Storefront APIs to fetch and display review data dynamically within your Hydrogen components.
Alternatively, if your Hydrogen storefront employs client-side navigation or dynamic content loading (e.g., infinite scroll, quick view modals), you can use Yotpo's AJAX method to reinitialize widgets after content updates. This approach ensures that reviews and ratings are correctly displayed without requiring full page reloads.
Was this article helpful?
