Want to display customer reviews from Google on your Jumpseller store? This guide explains how to add the Widget House Google Reviews Widget to one selected template or display it across your storefront through the shared footer component.
Before you begin, make sure you've created your widget and copied the installation code from your Widget House dashboard
Step-by-step guide to getting your Widget House widget code
Choose How You Want to Display the Widget
Add the widget to a single page
Log in to your Jumpseller Admin Panel and open the store where you want to install the Google Reviews Widget.
Open your Widget House dashboard and copy the complete installation code generated for your widget.
The installation code contains two parts: a loading <script> and a visible <div> container with your unique widget ID.
Keep both parts together and in the original order.
The code shown in this guide is an example. Always use the installation code generated for your own widget so the correct reviews, settings, and design are displayed.
Step 1: Open Jumpseller and Copy the Widget Code
In the Jumpseller Admin Panel, go to Themes → Visual Editor.
You can also open the Theme Gallery and click Customize on the current theme or use the theme actions menu to customize a secondary theme.
Use the template selector in the Visual Editor to open the page type where you want the Google Reviews Widget to appear.
Depending on your store, this may be the Homepage, Product, Category, Page, Contact, or another available template.
If the editor allows you to select a specific product, category, or page for the preview, choose the resource where you plan to display the reviews.
The Google Reviews Widget is static, which means it appears exactly where its Custom Code component is placed inside the selected template.
Step 2: Open the Visual Editor and Select a Template
Before adding the widget, check whether the selected template is also used by other pages, products, or categories.
Changes made to a shared Product, Category, or Page template can appear on every resource that uses that template.
If you want the widget to appear on only one specific resource, open the relevant template type and click Create New Template.
Enter a clear template name, select the existing template that should be used as the base, and associate the new template with the required product, category, or page.
Confirm the settings to create the template and open it in the Visual Editor.
You can skip this step for the Homepage or when the selected resource already uses a dedicated template.
Step 3: Create a Dedicated Template If Needed
In the Visual Editor preview, find the exact position where you want visitors to see the Google Reviews Widget.
For example, you can place the reviews below a product or service description, above a contact section, before a call-to-action, or near the bottom of the page.
Click Add component above or below the surrounding content.
Select Custom Code from the list of available components. Themes earlier than version 4.0 may display this component as Code.
Choose a new component rather than reusing an existing shared component when the widget should appear only in this template. Changes to a reused component can affect every template where it is used.
A wide or full-width position is usually the best choice for a Google Reviews carousel, slider, or grid.
Step 4: Add a Custom Code Component
Open the new Custom Code component and paste the complete Google Reviews Widget installation code into the Code field.
Keep the loading <script> and the Google Reviews <div> container together and in the original order.
Do not remove, split, rename, or change any part of the installation code.
Do not wrap the code in additional <pre>, <code>, or <iframe> tags.
Set the component width to a wide or full-width option when available.
Adjust the top and bottom margins if the widget needs more space between the surrounding sections.
Click Save in the upper-right corner of the Visual Editor.
Step 5: Paste the Google Reviews Widget Code
Open the page, product, or category on your storefront and make sure the Google Reviews Widget appears in the selected position.
If you edited a secondary theme, use its preview link to check the result before making it your current storefront theme.
When you are ready to make the changes visible to customers, return to the Theme Gallery and set the updated theme as the current theme.
Check the widget on desktop, tablet, and mobile devices. Make sure the reviews are fully visible and do not overlap product information, navigation, buttons, forms, or other content.
If the widget appears on more pages than expected, those pages probably use the same template. Create a dedicated template and associate it only with the required resource.
If the widget is missing, make sure the component is visible, the changes were saved, and both the <script> and <div> are still present in the Code field.
You may also need to refresh the storefront, open it in a private browser window, or clear your browser and storefront caches.
Step 6: Check the Widget on the Storefront
Show the widget on All pages
Show It on All Pages of Your Website
Because the Google Reviews Widget is static, it must be added to a visible shared component when you want it to appear across your storefront.
Before you begin: We recommend testing the installation in a secondary theme first. Preview the updated theme on several page types before making it your current storefront theme.
In the Jumpseller Admin Panel, go to Themes → Code Editor.
You can also open Themes → Visual Editor, open the theme actions menu, and use the direct link to the Code Editor.
Jumpseller recommends editing theme code only when you are comfortable working with Liquid, HTML, CSS, and JavaScript.
Save a copy of the original code section before making changes. If you are not comfortable editing the theme, ask a website developer or Jumpseller support for help.
Step 1: Open the Jumpseller Code Editor
In the Code Editor file list, expand the Components section.
Open footer.liquid.
The Footer component is shared across the standard storefront templates that use the theme footer, which makes it a suitable location for a site-wide static reviews section.
Changes to this file can affect multiple storefront pages. Review the surrounding Liquid and HTML markup carefully before adding the widget.
If your customized theme uses a differently named footer component or another file structure, open the Footer settings in the Visual Editor or ask your theme developer to identify the shared visible footer file.
Step 2: Open the Shared Footer Component
Find the closing </footer> tag or the final visible content wrapper inside footer.liquid.
To display the reviews near the bottom of every storefront page, place the widget code inside the footer markup and immediately before its final closing tag.
Make sure the code is inserted between complete HTML or Liquid blocks.
Do not paste the widget inside an opening HTML tag, Liquid condition, loop, existing script, or another element's attribute.
Theme note: Standard themes commonly use footer.liquid, but customized themes may use a differently named shared footer component. If you cannot find this file, use the Visual Editor to identify the Footer section or ask your theme developer for help.
Do not use the Theme Settings fields for Top or Bottom Head Code for the complete static widget. Those fields can load scripts globally but do not provide a controlled visible position for the Google Reviews container.
Step 3: Choose a Site-Wide Widget Position
Paste the complete Google Reviews Widget installation code from your Widget House dashboard into the selected position in footer.liquid.
Keep the loading <script> and the Google Reviews <div> container together and in the original order.
Do not edit the script URL, widget ID, container ID, or any other part of the installation code.
Add only one copy of the installation code to the shared footer component.
If you previously added the widget through a Custom Code component, remove that copy from the relevant templates to prevent the reviews from appearing twice.
Click Save in the upper-right corner of the Code Editor.
The code shown in the screenshots is an example. Always use the installation code generated for your own widget before saving the theme.
Step 4: Paste the Widget Code and Save the Theme
If you edited a secondary theme, preview it on several storefront page types before making it your current theme.
Open pages such as the home page, a product page, a category page, a content page, the contact page, and the cart if applicable.
The Google Reviews Widget should appear in the shared footer position on every storefront template that renders the updated Footer component.
Check the widget on desktop, tablet, and mobile devices. Make sure it is fully visible and does not overlap navigation, product controls, forms, buttons, payment information, or other footer content.
If the widget is missing from a particular page, that page may use a different template, footer component, or system-controlled storefront flow.
If the widget appears twice, make sure the installation code has not also been added through a Custom Code component or another shared theme file.
If your latest changes are not visible, confirm that you edited the current theme or set the updated secondary theme as the current theme, then refresh the storefront and clear any applicable browser or storefront cache.
If the footer layout is affected, restore the original code and ask a theme developer or Jumpseller support team to help identify a safer insertion point.
Step 5: Check the Widget Across Your Jumpseller Store
All set. Your Google Reviews Widget should now be working on your Jumpseller store.
Need a hand with setup?
Contact our support team at support@widget-house.com and we will help you get the widget running on your Jumpseller store.
support@widget-house.com