Galleries are multi-post widgets that display your approved content in customizable layouts on your website. They automatically update with your latest posts and provide interactive shopping experiences through shoppable product tags.
Navigate to UGC -> On-site widgets to manage your galleries.
Use Cards to create a shoppable widget for a single image or video.
How galleries work
Galleries dynamically display content based on your content source settings. When a visitor clicks one of the posts, a popup opens the post in full size and shows additional information and product tags. Customize what’s included in the UGC popup.
Key features:
- Automatic updates: Galleries refresh with new approved content that matches their filters
- Shoppable experience: Product tags link directly to your product pages
- Easy to design: Layout and design can be adjusted for each gallery
- Localized: Adjusts language, links, currency, and prices based on the market
- Responsive design: Adapts to different screen sizes and devices
- Performance optimized: Images are lazy-loaded and cached for fast loading
Available galleries
Cevoid provides several pre-configured gallery types to cover common use cases. Each gallery type is designed for a specific purpose, making it easy to get started. You can also create custom galleries when you need more control over what content is displayed.
Product dynamic galleries
Product dynamic galleries automatically change their content based on the ecommerce page they’re displayed on. This is powered by product tags and the product information from your product catalog.
This allows you to use one gallery across all product pages, one across all collection pages, and one across all category pages. This minimizes the work needed to populate your ecommerce pages with relevant and inspiring content.
The real time-saver: a single product tag added to a post makes that post available across all three gallery types. It can appear on the product page, the collection page, and the category page where that product belongs.
Product page gallery
The product page gallery shows posts featuring the product the visitor is viewing. It uses Cevoid’s fallback AI to make sure there’s always something to show, even for products with limited UGC.
How content is prioritized:
- Posts tagged with the exact product variant the visitor is viewing
- Posts tagged with other variants that share attributes (like color or size)
- Posts tagged with the primary product or any variant of the same product
- Posts featuring similar products based on Cevoid’s AI (optional)
When AI fallback is enabled, it finds similar products based on criteria you can prioritize in Settings -> AI:
| Criteria | What it matches |
|---|
| Names | Products with similar titles |
| Visual appearance | Products that look alike in photos |
| Categories & Collections | Products from the same or related categories and collections |
| Product specs | Products by size, color, material, etc. |
Fallback settings are managed under Design -> Fallback on your product page gallery.
| Setting | Options |
|---|
| Use AI fallback | Yes or No |
| Fallback type | Gallery |
| Fallback gallery | Select which gallery to use as fallback |
If no posts match any of these criteria and fallback is disabled, the gallery will be hidden on that product page.
Collection page gallery
The collection page gallery automatically displays posts featuring products from the collection the gallery is loaded on. When a visitor browses your “Summer Collection” page, they’ll see UGC featuring products from that collection. The gallery detects which collection page it’s on and fetches relevant content automatically.
Category page gallery
The category page gallery is designed for hierarchical category structures. It shows posts featuring products in the category the gallery is loaded on and all its subcategories, giving visitors a broader view of content across related products.
If your store doesn’t use hierarchical categories, the collection page gallery is usually a better fit.
Social feed galleries
Social feed galleries display content from your brand’s connected social media accounts. These are perfect for showcasing your brand’s own Instagram aesthetic or TikTok presence on your website.
| Gallery | Description |
|---|
| Instagram feed gallery | Shows approved posts from your brand’s connected Instagram accounts. Great for bringing your Instagram aesthetic to your website. |
| TikTok feed gallery | Shows approved posts from your brand’s connected TikTok accounts. Perfect for featuring your brand’s video content. |
General galleries
General galleries display all of your posts or all of your UGC posts.
| Gallery | Description |
|---|
| UGC gallery | Shows all approved user-generated content from your customers and community. This excludes any content your brand created, making it purely customer voices. |
| All posts gallery | Shows everything: both UGC from customers and content your brand has created. Use this when you want to combine authentic customer content with your own branded visuals. |
Custom galleries
Custom galleries let you build galleries for specific pages and sections. Choose from multiple content sources and combine them to create galleries for specific campaigns, pages, or purposes.
| Content source | What it does | Example use cases |
|---|
| Post labels | Shows posts that have specific labels applied | Create a “Summer Vibes” label and use it to curate a seasonal homepage gallery. Or label your best content “Featured” to handpick what appears. |
| Source | Shows posts from specific collection methods | Create a gallery just for your #BrandHashtag campaign, or showcase all uploads from a specific upload form or challenge. |
| Profiles | Shows all posts from selected profiles | Build an ambassador landing page featuring all content from your top creators. |
| Products | Shows posts tagged with specific products | Create a gallery for a new product launch featuring all UGC of that product. |
| Categories | Shows posts with product tags in selected categories | Build a “Skincare” gallery that pulls in all posts featuring skincare products. |
| Brands | Shows posts featuring products from selected brands | If you carry multiple brands, create brand-specific galleries for each. |
Create a post label for a specific use case and use it as a content source. This gives you full control to handpick exactly which posts appear in the gallery.
Create a custom gallery
- Navigate to UGC -> On-site widgets
- Click New widget
- Select Custom gallery
- Click the Content tab
- Click Add content
- Select your content sources: you can combine multiple sources
- Optional: Click More and rename your gallery
- Click Save changes
Design and customize galleries
Every gallery can be customized to match your brand and website. Choose from different layouts, adjust how posts are displayed, and add features like filters and upload buttons.
Styling changes apply on the next page view after clicking Save changes.
Galleries automatically inherit typography and fonts from your website once embedded, so they’ll feel native to your site right away.
- Navigate to UGC -> On-site widgets
- Select your gallery
- Click the Design tab
- Apply your changes
- Click Save changes
Gallery layouts
Choose how your posts are arranged. Each layout offers different settings to control the number of posts shown, how they’re organized, and how visitors load more content.
Grid layout
Posts display in a clean, uniform grid. This is the most common layout and works well for most use cases.
| Setting | Options |
|---|
| Style | Even grid (all posts the same size) or Variable grid (highlights one larger post per load) |
| Rows | Number of rows on desktop, tablet, and mobile |
| Columns | Number of columns on desktop, tablet, and mobile |
| Space between posts | Spacing in pixels for desktop and mobile |
| Load more behavior | Load more button, Infinity scroll, or No load more |
| Load more color | Button background color |
| Load more roundness | Button corner radius |
Slider layout
Posts display in a horizontal carousel that visitors can scroll through. Great for compact spaces or when you want to encourage browsing.
| Setting | Options |
|---|
| Columns | Number of posts visible at once on desktop, tablet, and mobile |
| Space between posts | Spacing in pixels for desktop and mobile |
| Show arrows | Yes or No |
| Position | Inside, Outside, or Center |
| Color | White, Black, or Grey |
| Icon | Arrow or Chevron |
Masonry layout
Posts display in a Pinterest-style layout where images maintain their original aspect ratios. This creates a more dynamic, editorial feel.
| Setting | Options |
|---|
| Columns | Number of columns on desktop, tablet, and mobile |
| Space between posts | Spacing in pixels for desktop and mobile |
| Load more behavior | Load more button, Infinity scroll, or No load more |
| Load more color | Button background color |
| Load more roundness | Button corner radius |
Collage layout
Posts display in a fixed artistic arrangement. Perfect for hero sections or when you want a more curated, designed look.
| Setting | Options |
|---|
| Style | 5 posts or 2 posts |
| Animate | Animate the first image every 10 seconds (Yes or No) |
| Space between posts | Spacing in pixels for desktop and mobile |
Post styles
Control how individual posts look within the gallery. Each style emphasizes different information and creates a different feel.
Shows product tag hotspots directly on the posts, making it immediately clear that products are shoppable. Visitors can see exactly where to click.
| Setting | Options |
|---|
| Product tags | Display on hover or Always show |
| Roundness | Corner radius in pixels |
| Post height | Height ratio |
| On click | Open popup or Link to product |
Product style
Displays product information (name, price) below each post. This style is great when you want to emphasize the shopping aspect and show visitors what products are featured.
| Setting | Options |
|---|
| Hide price on posts | Yes or No |
| Roundness | Corner radius in pixels |
| Post height | Height ratio |
| On click | Open popup or Link to product |
| Username location | Inside post or Outside post |
| Username alignment | Left, Center, or Right |
| Username icon | Icon, @-sign, or None |
Social style
Gives posts a social media feel by showing the creator’s name or handle. Perfect for highlighting the community aspect and giving credit to your customers.
| Setting | Options |
|---|
| Hover effect | None, Zoom, Overlay center, or Overlay bottom |
| Roundness | Corner radius in pixels |
| Post height | Height ratio |
| On click | Open popup or Link to product |
| Username location | Inside post or Outside post |
| Username alignment | Left, Center, or Right |
| Username icon | Icon, @-sign, or None |
Clean style
A minimal look that lets the content speak for itself. No overlays or information by default: just the images and videos.
| Setting | Options |
|---|
| Hover effect | None, Zoom, Overlay center, or Overlay bottom |
| Roundness | Corner radius in pixels |
| Post height | Height ratio |
| On click | Open popup or Link to product |
Add an upload button to your gallery so visitors can submit their own content directly from your website. When clicked, it opens a popup version of one of your upload forms.
Content submitted through the upload button goes to your Inbox for approval before appearing in any galleries.
- Navigate to UGC -> On-site widgets and select the gallery
- Click Design -> Upload button
- Set Visible to Yes
| Setting | Options |
|---|
| Visible | No or Yes |
Filter labels
Let visitors filter the gallery by topic using clickable filter buttons. Filters are based on post labels. Create labels for topics relevant to your customers and apply them to posts, then enable those labels as filters in the gallery.
- Navigate to UGC -> On-site widgets and select the gallery
- Click Design -> Filter labels
- Toggle on Show filter labels
- Select which labels should appear as filters
- Optional: Enable Show “All” button so visitors can see all posts again after filtering
| Setting | What it controls |
|---|
| Alignment | Position the filters on the left, center, or right |
| Show count | Display how many posts each filter contains |
| Show label icons | Show any icons you’ve added to your post labels |
| Corner roundness | Round the corners of the filter buttons |
| Active colors | Background and text color for the currently selected filter |
| Inactive colors | Background and text color for unselected filters |
Advanced settings
| Setting | Options |
|---|
| On product link click | Open in same window or Open in new tab |
| Autoplay video | Yes or No |
Global settings
These settings apply to all galleries and cards.
| Setting | Options |
|---|
| html-tag | Add overflow hidden or Remove overflow hidden |
| Product variant titles | Display settings for variant titles |
Exclude posts from a gallery
Sometimes you want certain posts to appear in some galleries but not others. You can use post labels to control this.
Create a label like “Exclude from homepage” or “Exclude from PDPs” and apply it to any posts you want to hide from specific galleries. Then tell the gallery to exclude posts with that label.
- Navigate to UGC -> On-site widgets and select the gallery
- Click the Content tab
- Click Exclude labels
- Select the label(s) containing posts you want to exclude
- Click Save changes
Pin posts to the top
By default, galleries show your newest posts first. But sometimes you have standout content that you want to feature at the top, regardless of when it was posted. Pinning lets you lock specific posts to the beginning of the gallery.
- Navigate to UGC -> On-site widgets and select the gallery
- Click the Content tab
- Hover on a post in the preview or content list
- Click the pin icon
- Click Save changes
Pinned posts stay at the top even as new content is added to the gallery. New posts will appear after your pinned content.
Embed galleries on your website
Once your gallery is designed and configured, adding it to your website is straightforward. The method depends on your platform.
Shopify
General implementation
CMS block
If you’re using Cevoid’s UGC Shopify app, you can add galleries using prebuilt theme sections: no code required.Have a headless Shopify setup? Use the general implementation instructions instead.
- Navigate to UGC -> On-site widgets and select your gallery
- Click Embed gallery
- Copy the Gallery ID
- Open your Shopify theme editor
- Navigate to the page where you want the gallery
- Add the appropriate Cevoid section:
- Cevoid gallery: for standard galleries on any page
- Product page gallery: for product pages (automatically shows content relevant to each product)
- Collection page gallery: for collection pages (automatically shows content relevant to each collection)
- Paste the Gallery ID
- Adjust section settings as needed
- Click Save
You can embed galleries on any HTML-based website using Cevoid’s script and a div element.
-
Add Cevoid’s script to your website’s
<head> or <footer> (you only need to do this once):
<script type="module" src="https://gallery.cevoid.com/index.js" defer></script>
-
Navigate to UGC -> On-site widgets and select your gallery
-
Click Embed gallery
-
Copy the div code
-
Paste the div code wherever you want the gallery to appear on your page
-
Save and publish your changes
If your development team has built a Cevoid gallery block in your CMS, you just need the Gallery ID.
- Navigate to UGC -> On-site widgets and select your gallery
- Click Embed gallery
- Copy the Gallery ID
- In your CMS, add a Cevoid gallery block and paste the ID