Placing Your Gallery
Placing Your Gallery
Article Summary
Share feedback
Thanks for sharing your feedback!
Once you’ve finished choosing media for your gallery, and designing it to fit your brand, it’s time to embed your gallery on your site.
The way you do this will depend on which eCommerce platform you’re using and where you’d like to place the gallery. The instructions below apply to both product galleries and custom galleries.
Automatically embedding the gallery
If you’re using Shopify, we can place your gallery for you on your site. We’ll place it in a great location, just above the website footer on your homepage or product page. If you’re a Yotpo Reviews customer, we can also place your gallery above your Reviews Widget if you prefer.
Available for:
Shopify only
- In your Visual UGC admin, from the gallery page, click Place for me.
- Choose where you want us to place the gallery.
- You’re done! Go to your site to see your gallery live.
If you want to place the gallery in a different location, you can generate the code and place it yourself. Just click Get the code and follow the instructions for placing it yourself.
Embedding the gallery using code
You can embed the gallery on any page of your site, for example, your product page, homepage, checkout page, or category page. Follow the instructions below according to which eCommerce platform you’re using.
Before you start
In order to embed the gallery on your site, you must first add Yotpo's JavaScript. If you already have a Reviews Widget on your site, then this will already be installed.
For detailed installation instructions on installing the Reviews Widget and adding Yotpo’s JavaScript, choose the relevant article from the list below. In some cases, the JavaScript will be added automatically upon installing the widget. See individual articles for details.
- Shopify: Installing Yotpo
- Adobe Commerce 1: Installing Yotpo
- Adobe Commerce 2: Installing Yotpo
- BigCommerce: Installing Yotpo
- Volusion: Installing Yotpo
- Generic (Other Platforms): Installing Yotpo (v1)
- Generic (Other Platforms): Installing Yotpo (v3)
Shopify-specific instructions
To embed the code:
- Go to your Shopify Themes menu.
- Click Actions > Edit Code.
- Use the table below to help you understand where to paste the code:
| Desired location | Where to paste code |
|---|---|
| On the product page, above the Reviews Widget | In your product.liquid or main-product.liquid file, above the row that contains (yotpo-main-widget). |
| On the product page, just above the footer | In your product.liquid or main-product.liquid file, underneath the last line of code. |
| On the homepage, just above the footer | In your index.liquid file, underneath the last line of code. If you don't have this file (usually because you're using Online Store 2.0), you'll need to embed the gallery automatically. |
Please note:
Depending on the theme you’re using, the file names you see in your account may not match those given in the table above. If you need any additional help, please contact Yotpo support.
BigCommerce-specific instructions
You can embed the gallery on your product page or on your homepage.
To embed the code:
- Log into your BigCommerce account.
- From the homepage, select your store, and click Storefront.
- Navigate to My Themes > Advanced > Edit Theme Files.
- Use the table below to help you understand where to paste the code:
| Desired location | Where to paste code |
|---|---|
| On the product page, above the Reviews Widget | In your product.html file, above the row that contains (yotpo-main-widget) |
| On the product page, just above the footer | In your product.html file, underneath the last line of code |
| On the homepage, just above the footer | In your home.html file, underneath the last line of code |
Please note:
Depending on the theme you’re using, the file names you see in your account may not match those given in the table above. If you need any additional help, please contact Yotpo support.
Was this article helpful?
