Shopify isn't WordPress. You don't have a Custom HTML block you can drop anywhere — you have theme sections, a page editor with an HTML mode, and the theme code editor for anything deeper. Where you paste your testimonial widget depends on which part of your store you're adding it to and which generation of Shopify theme you're running.

This guide covers how to add a GetPureProof video testimonial widget to Shopify across the four scenarios that cover most stores: the theme customizer on OS 2.0 themes (Dawn and its successors), static pages and blog posts, the theme code editor for universal placement, and product pages specifically — the highest-impact placement for e-commerce. Plus the Shopify-specific troubleshooting and performance notes that trip up teams debugging why a widget refuses to render.

Prerequisites: a Shopify store you can edit, Admin or Staff role with theme-editing permissions, and an account with at least one widget already created.

Step 1 — Create your widget

Before you touch Shopify, create the widget in your dashboard. This takes about a minute:

1. Log into your dashboard.
2. Open the Space with the testimonials you want to embed.
3. Click Widgets in the sidebar.
4. Click New Widget and pick your layout — Wall of Love, Carousel, Single Spotlight, Floating Pop, or Avatars.
5. Select the testimonials you want to include, pick a theme (light, dark, or transparent to blend with your Shopify theme), and save.

Each widget gets a unique ID. You can create multiple widgets from the same Space — one for your homepage, a different one for product pages, a third for a collection page — and each has its own embed snippet.

Step 2 — Copy your embed code

From the widget list, click Code on the widget you just created. You'll see two lines:

<div class="pureproof-widget" data-widget-id="your-unique-widget-id" data-mode="inline"></div>
<script src="https://app.getpureproof.com/embed.js" async></script>

A container div that tells the embed script where to render, and the async script itself. No external dependencies, no framework bundle, no configuration files.

Copy both lines. You'll paste them into Shopify in the next step.

Step 3 — Add the widget to your Shopify store

Pick the method that matches your setup.

Using the theme customizer (OS 2.0 themes)

If your store runs an OS 2.0 theme like Dawn — or any of Shopify's modern reference themes released since 2021 — you have a Custom Liquid block available directly in the theme customizer:

1. From your Shopify admin, go to Online Store → Themes.
2. On your current theme, click Customize.
3. Navigate to the page where you want the testimonials: home page, collection page, product page, or any page with section support.
4. Click Add section or Add block, depending on where you're placing it.
5. Choose Custom Liquid (sometimes labelled Custom HTML on certain themes).
6. Paste your embed code into the code field.
7. Click Save and preview the live store to confirm the widget renders.

Custom Liquid blocks accept raw HTML and script tags. The block renders as part of the live theme on the frontend.

Using a page or blog post

For a dedicated testimonials page, a blog article, or any static content:

1. Go to Online Store → Pages (or Online Store → Blog posts).
2. Create a new page or open an existing one.
3. In the page editor toolbar, click the Show HTML icon (</>).
4. Paste your embed code at the position where you want the widget.
5. Click Save.

The HTML mode accepts raw script tags. If you switch back to the visual editor after pasting, Shopify preserves the HTML — you just won't see the widget rendered until you preview the page on the live store.

Using the theme code editor (universal placement)

If you need the widget somewhere that isn't exposed through the customizer — site-wide footer, a specific template file, or a legacy pre-OS 2.0 theme without section support:

1. From Online Store → Themes, click Actions → Edit code on your current theme.
2. Navigate to the file where you want the widget:
   • sections/footer.liquid — site-wide footer
   • templates/product.liquid or sections/product-template.liquid — product pages on legacy themes
   • templates/page.liquid — all static pages
   • Any other template file as needed
3. Paste your embed code in the appropriate location — between existing HTML, not inside a Liquid tag.
4. Click Save.

One thing worth flagging: edits to theme code files aren't versioned the way page edits are. Before editing, duplicate your theme via Actions → Duplicate and work on the copy. If something breaks, you can revert by publishing the original.

Adding the widget to product pages

Product-page testimonials are the highest-impact placement for most e-commerce stores, so this deserves its own walkthrough.

On OS 2.0 themes:

1. Go to Online Store → Themes → Customize.
2. In the top page selector, choose Products → Default product (or a specific product template if you've created one).
3. Click Add block in the product section.
4. Choose Custom Liquid.
5. Paste your embed code.
6. Drag the block to position it where you want — typically below the product description or just under the buy button.
7. Save.

This adds the testimonial widget to every product that uses that template. If you want different testimonials per product — for example, cosmetic-specific testimonials on skincare products and different ones on haircare products — create multiple widgets in your dashboard (each with handpicked testimonials) and create multiple product templates in Shopify, one per product category, each with its own Custom Liquid block pointing to a different widget ID.

On legacy themes (pre-OS 2.0):

Use the theme code editor on templates/product.liquid or sections/product-template.liquid as described in step 3. Legacy themes don't support the customizer-based block approach for product pages.

Troubleshooting

Four failure modes cover most problems.

1. Widget doesn't render in a Custom Liquid block.

First check: is the block on a section that's actually visible on the page? Sometimes Custom Liquid blocks added to a collapsed drawer or a hidden tab don't render in the default view. Second check: view page source on the live store and search for pureproof. If the script tag isn't there, Shopify's HTML sanitizer stripped it — this occasionally happens on heavily modified themes. Fix: duplicate your theme to a fresh copy, or use the theme code editor approach instead of the customizer.

2. Content Security Policy error in the browser console.

Some Shopify themes and third-party apps inject CSP headers that block scripts from domains not explicitly allowed. Open DevTools and check the Console for a CSP violation message. If you see one, add app.getpureproof.com to your CSP allowlist — usually editable in the theme's theme.liquid file or in the settings of whichever app is injecting the CSP. If you can't find where the CSP comes from, temporarily disable recently installed apps one at a time until the error goes away.

3. Widget shows in preview but not on the live site.

Usually theme caching. Shopify caches theme assets aggressively at the CDN layer. After saving, wait two to three minutes and hard-refresh your browser (Ctrl+Shift+R or Cmd+Shift+R). If the widget still doesn't appear, open Actions → Edit code and save any file without changes — that forces a rebuild.

4. Widget works on desktop but not on mobile.

Almost always a theme CSS issue where the widget container has overflow: hidden or a restrictive max-width at mobile breakpoints. Inspect the container on a mobile view in DevTools and look for CSS rules clipping or hiding it. The widget itself is mobile-responsive; the theme around it can still constrain it.

Checkout pages. One platform-level limitation: on standard Shopify plans, you cannot add custom HTML to the checkout. That's Shopify's restriction, not something any widget can work around. On Shopify Plus, custom checkout scripts are available via checkout.liquid or the newer Checkout Extensibility framework, and the embed works there the same way it does elsewhere.

Shopify-specific performance notes

The widget is already optimized — async script, lazy-loaded thumbnails, iframe-isolated rendering, click-to-load video. You don't need special configuration for it to perform well on Shopify.

Two things to avoid:

• Don't bundle the embed script with a "speed optimization" app. Some Shopify apps aggressively combine third-party scripts to reduce HTTP request count. The embed script is already minified and delivered from a CDN — combining it with your theme's JavaScript cancels the async benefit and can break the loader entirely. If you run such an app, exclude app.getpureproof.com from its combination rules.
• Don't delay the script until user interaction. Some performance tools defer all third-party JavaScript until a click or scroll. For testimonials visible on initial page load, this defeats the purpose — the widget should render with the page, not wait for interaction.

For the broader picture on how testimonial widgets affect Core Web Vitals and what to audit, testimonial widgets and Core Web Vitals covers the diagnostic side.

Bottom line

Adding video testimonials to Shopify is straightforward once you match the method to where you want the widget: Custom Liquid blocks in the theme customizer for OS 2.0 themes, HTML editor for pages and blog posts, theme code editor for anything deeper, or a product-template block for the e-commerce killer use case.

The snippet is the same across all four methods. The variable is where you paste it.

Create the widget. Copy the embed. Pick the placement. Save. Preview on the live store. Ship. If it doesn't render, walk the four troubleshooting steps — the problem is almost always CSP, theme caching, Custom Liquid sanitization, or mobile CSS, in that order.

If you're running on WordPress as well as Shopify, adding video testimonials to WordPress covers the same workflow for that platform.