How to add Reviews to Shopify 2026 – Without App

Want to add customer reviews to your Shopify store without paying $30-100/month for an app like Judge.me, Loox, or Yotpo? This complete tutorial walks you through adding a fully-functional product reviews section using a single Shopify section file. No app needed, no monthly fees, no third-party data dependencies – everything stays inside your theme.

Works with Dawn, Refresh, Sense, Craft, Studio, Horizon and any free Shopify 2.0 theme.

Watch the Reviews Tutorial

Prefer to follow along visually? Watch the full walkthrough where I install the section on a live Dawn theme and add reviews with photos in real time:

What You’ll Get With This Shopify Reviews Section

This is not a basic testimonial block. It is a complete reviews system that auto-calculates your average rating, shows a star breakdown, and lets customers filter by rating – all features you would normally pay $30-100 per month for in apps like Judge.me, Loox, or Yotpo. Add up to 30 reviews per instance with photos, verified badges, and reviewer details.

Auto Average Rating
Big number + half-star support, calculated live.
Star Breakdown Bars
Animated bars: 5 stars, 4 stars, 3 stars…
Star Filter Buttons
Customers tap to filter by 5-star, 4-star…
3 Layouts
Grid, swipeable carousel, or masonry.
Up to 3 Photos Per Review
Click to open in fullscreen lightbox.
Verified Badge
Green checkmark next to reviewer name.
Auto Avatar
First letter of name, or upload photo.
Quote Icon
Subtle quote mark in card corner.
Carousel Autoplay
Optional auto-scroll, pauses on hover.
Truncate Long Reviews
Cap at N lines for clean cards.
Photo Lightbox
Click any review photo to expand.
Full Color Control
Stars, cards, accents, borders – all customizable.

Step 1: Create a New Section File

Open Your Theme Code

  1. From your Shopify admin, go to Online Store > Themes.
  2. Click the three dots on your current theme > “Edit code”.
  3. In the left sidebar, scroll to the Sections folder.
  4. Click “Add a new section”.
  5. Name it: reviews-ecomranks
  6. Delete any default code Shopify puts in the file.

Step 2: Copy & Paste the Reviews Code

Click the Copy Code button below, then paste it into your new reviews-ecomranks.liquid file and click Save.

reviews-ecomranks.liquid
{% comment %}
  CUSTOMER REVIEWS -- by EcomRanks
  Fiverr: https://fvrr.co/3BsbtyA
{% endcomment %}

{%- assign s = section.settings -%}

<style>
  /* Full CSS with 40+ customizable properties */
  /* Auto-calculated summary bar with half-star logic */
  /* 3 layout modes: grid, carousel, masonry */
  /* Card hover, quote icon, photo lightbox */
  /* All driven by Customizer settings */
</style>

<section class="ecr-rv-section">
  <!-- Heading + subheading + description -->
  <!-- Auto-calculated summary bar -->
  <!-- Star rating filter buttons -->
  <!-- Review cards (grid/carousel/masonry) -->
  <!-- CTA button -->
</section>

<script>
  /* Filter logic: hide cards by rating */
  /* Carousel arrows + autoplay */
  /* Photo lightbox modal */
</script>

{% schema %}
  /* 40+ settings: heading, summary, filters,    */
  /* layout, cards, carousel, text, colors,      */
  /* CTA, spacing, branding                       */
  /* Per-block: rating, title, body, 3 photos,   */
  /* reviewer name, photo, location, date, verified */
{% endschema %}
Important: The code block above is a preview. Click Copy Code to get the complete working file with all 1,320+ lines of code.

Step 3: Add the Reviews Section in the Customizer

Open Customize and Add the Section

  1. Go to Online Store > Themes > Customize.
  2. Navigate to where you want reviews (Home page, Product page, etc.).
  3. Click “Add section”.
  4. Search for “Customer Reviews”.
  5. The section appears with 6 default review blocks pre-configured. Edit each one with real customer data.
  6. Click Save.

Step 4: Configure Your Reviews Settings

The section comes with 40+ settings split into clear groups. Each review block has its own setup for rating, content, photos, and reviewer info. Here is the full breakdown:

Heading Subheading, main heading, description, alignment, sizes.
Summary Bar Auto-calculated average rating + total + star breakdown bars.
Filters Star-rating filter buttons that hide reviews by rating.
Layout Grid, Carousel, or Masonry. Per-breakpoint columns.
Carousel Options Autoplay toggle and speed (only when layout = carousel).
Text Styling Title size, body size, star size, optional truncation.
Colors Background, text, accent, card bg, card border, filled and empty stars.
Call-to-Action Optional “Write A Review” button with link, shape, spacing.
Per Review Block 1-5 star rating, title, body, up to 3 photos, reviewer name, photo, location, date, verified toggle.

Need Custom Shopify Development?

I build custom Shopify sections, full theme customizations, and conversion-optimized stores. If you need something beyond this free code – I am here to help.

Hire Me on Fiverr Free Website Audit

Don’t Have a Shopify Store Yet?

Start your Shopify store for just $1/month – 3-day free trial + $1/month for 3 months (90 days total).

Start Your Shopify Store

Shopify Reviews FAQ & Troubleshooting

Does this Shopify reviews section work on mobile?

Yes. The reviews section is fully responsive. The grid adjusts column count for desktop, tablet, and mobile separately. The carousel layout supports native swipe on mobile, and all photo lightboxes work with touch gestures.

Can I use this reviews section on product pages?

Yes. The section is enabled on all templates – home, product, collection, page, blog. Add a separate instance per product page, or use one global instance on the home page for site-wide social proof.

Does it work with all Shopify themes?

It works with Dawn and all free Shopify 2.0 themes including Refresh, Sense, Craft, Studio, Origin, Colorblock, Crave, Spotlight, and Horizon. For paid themes or heavily customized themes, minor CSS adjustments may be needed – hire me on Fiverr if you want it integrated cleanly with your theme.

Can I add multiple reviews sections on one page?

Yes. Each instance uses a unique scoped ID, so you can add multiple reviews sections without CSS or JavaScript conflicts. For example, you can show product-specific reviews on a product page and general site reviews on the home page.

How does the average rating get calculated?

Automatically. Liquid loops through every review block and calculates the average from each star rating. The result displays as a big number with matching star icons (including half-star support for ratings like 4.5). The total count and per-star breakdown bars also update on their own.

Can customers write their own reviews?

This section is admin-managed – you add reviews from the Customizer, which gives you full control over what is shown. To accept customer-submitted reviews, link the “Write A Review” CTA button to a contact form or external review submission page. For a full self-service review system with form submission, message me on WhatsApp or hire me on Fiverr.

Can I import reviews from Judge.me or Loox?

Not directly inside this section, but you can copy review content from those apps into the Customizer manually. If you have hundreds of reviews to migrate, I can build a custom import script – contact me on WhatsApp for migration help.

Will this slow down my Shopify store?

No. The section uses zero external dependencies, no jQuery, no app SDK. Photos are lazy-loaded, CSS is scoped, and the JavaScript is under 3KB minified. It will be significantly faster than any review app since there are no third-party API calls.

I need help or want more custom features.

Happy to help. Send me a message on WhatsApp or hire me on Fiverr for custom review system integrations, theme-specific styling, review form submission, or full store builds.

Let’s Build Your Dream Shopify Store

I’m a Shopify developer specializing in theme customization, CRO, and custom sections. Small tweak or full store build – I’m here to help.

Hire on Fiverr Hire on Upwork WhatsApp
Subscribe on YouTube ecomranks.net [email protected]

Built by EcomRanks – Shopify Development & CRO


Leave a Comment

Your email address will not be published. Required fields are marked *