Junip UGC Media Gallery
Note: This widget is only available on the Standard plan and above. To use it you must enable "Show media gallery" via your On-site displays > scroll down to Product reviews box and click Customize > check Show media gallery and click Save.
Examples:
This is an example of how SHEFIT uses Junip's UGC Media Gallery with a tile layout at the top of their dedicated reviews page.
This is an example of how FrostBuddy uses Junip's UGC Media Gallery with a scroll layout at the top of their reviews section on the homepage.
Using your theme customizer
This widget can be added to your Shopify store via the Junip UGC Gallery App block in your theme customizer.
We offer a shortcut for this installation method in your On-site section > scroll down to "UGC Gallery" and click on "Install on product page" or "Install on home page". This will add the block on your homepage or product page, where you can drag the block to adjust its position, and click "Save" on the top right corner.
Adding the UGC Gallery app block on the Homepage:
After adding the block, you can click on the block to personalize the layout (Scroll or Tile), add a title, display media submitted from all product reviews or choose a specific product, and adjust the Padding (spacing) around the content.
Using custom code
The widget can also be added to your Shopify store by inserting the HTML code below into your Shopify theme code. Just ensure you have the Junip script on the page along with your store key (steps 1 & 2 of this article).
We've got you covered with a shortcut for the carousel code as well. Just head over to your On-site section > select "Install with HTML" tab > and scroll down to "UGC Gallery". Feel free to configure the available options within Junip, and then just copy the code when you're ready.
HTML sample code:
<div
class="junip-ugc-gallery"
data-title="Real Reviews 😍"
data-layout="scroll"
data-product-id=""
style="padding-top: 16px; padding-bottom: 16px;"
>
</div>
Customization Options:
Setting name | Values |
data-layout | scroll or tile |
data-title | Optional; any text |
data-product-id | Optional product ID from your ecommerce provider (ex your Shopify product ID). Leaving this empty will show images from all your product reviews. |