# How to add UGC and shoppable video to a BigCommerce store

A BigCommerce install is one script tag in the Stencil theme and a product feed. Here is what goes where, what works on day one, and what still needs the platform to catch up.

By Rohin Aggarwal · 2026-09-06

The BigCommerce merchant had four thousand tagged Instagram posts, a Stencil theme nobody on the team had opened in a year, and a developer quote for "a UGC section" that ran to three weeks. The section shipped in an afternoon. The three weeks had been the theme surgery, not the widget.

**Quick answer**

- BigCommerce has no app block for third-party UGC widgets, so the install is a Stencil theme edit: one script tag in the footer template and a placeholder div wherever the gallery should render.
- Product tagging works from a CSV or feed export of your catalog; the widget links each tagged post to the product page and tracks the click.
- Add-to-cart from inside the gallery opens the product page on BigCommerce today. In-gallery cart writes and order attribution are Shopify-only until the BigCommerce order webhook ships.
- Budget one afternoon: connect a source, approve a first batch, import the catalog, place the div, publish.

BigCommerce merchants ask the same two questions in the first ten minutes: where does the script go, and will it slow the page down. The answers are the footer template and no. The rest of this piece is the order of operations, with the honest line on what the platform does and does not let a widget do.

## Where the script goes in a Stencil theme

Open the theme editor, choose Edit Theme Files, and find the footer template under templates/components/common/footer.html (some themes use layout/base.html for global scripts). Paste the Idukki loader script just before the closing body tag. The loader is a single deferred request of about 37 KB gzipped; it does not block render and it mounts nothing until it finds a placeholder.

```html
<!-- Idukki loader: once per site, in the footer template -->
<script async src="https://widget.idukki.io/idukki.js"></script>

<!-- Placeholder: anywhere a gallery should render -->
<div data-ugc="idukki" data-guid="YOUR-WIDGET-GUID"></div>
```

For a homepage gallery, the placeholder goes in templates/pages/home.html. For a product-page gallery, it goes in templates/pages/product.html, usually below the description tabs, and you add data-filter-pid with the product id so the gallery shows only posts tagged to that product. BigCommerce exposes the id in Stencil as product.id, so the attribute reads data-filter-pid="{{product.id}}".

## Getting the catalog in so posts can be tagged

Idukki tags posts to products by matching against your catalog, so the catalog has to exist in the dashboard first. BigCommerce exports products as CSV from Products, then Export; the Idukki import accepts that file directly and maps SKU, name, price, image and URL. If you already run a Google Shopping feed, paste its URL instead and set a re-sync schedule; that keeps prices and stock current without another export.

Once the catalog is in, AI tagging suggests matches for each approved post and you confirm or correct them in bulk. The tagging model and its costs are covered in [the build-versus-buy cost model](/blog/cost-of-ugc-build-vs-buy); for a BigCommerce catalog of a few thousand SKUs the first pass usually finishes inside an hour.

## What works on day one, and what waits on the platform

| Capability | BigCommerce today | Notes |
| --- | --- | --- |
| Galleries, carousels, reels, review walls | Yes | Any layout, any page, via the placeholder div |
| Product tagging and click tracking | Yes | From CSV or feed import |
| Rights requests and moderation | Yes | Platform independent |
| Add to cart inside the gallery | Opens the product page | In-gallery cart writes are Shopify only |
| Order attribution to a post | Not yet | Needs the BigCommerce order webhook, on the integration roadmap |
| Core Web Vitals impact | None measurable | Deferred loader, reserved gallery height |

_What a BigCommerce merchant gets today versus a Shopify merchant._

> **Why attribution is the gap:** Attributing an order to a post needs the platform to tell Idukki when an order happens. On Shopify that is the order webhook plus the checkout pixel. BigCommerce has an equivalent webhook; the integration is scheduled, and until it ships the analytics stop at add-to-cart intent and product clicks. Those are still the numbers most teams use to decide which content to keep.

## The afternoon plan

1. Connect Instagram or TikTok and let the first pull finish (a few minutes).
2. Approve twenty to thirty posts so the first gallery is not empty.
3. Import the catalog by CSV or feed URL; run AI tagging on the approved posts.
4. Create a homepage gallery and a product-page gallery in the dashboard; copy each guid.
5. Paste the loader in the footer template, the placeholders in home.html and product.html; publish the theme.
6. Open the embed page in the dashboard and wait for the install check to turn green.

[Download the BigCommerce UGC setup checklist](/downloads/bigcommerce-ugc-setup-checklist)

**The rule:** On BigCommerce, do not let anyone quote you theme work for a UGC gallery. The gallery is two lines of Stencil. Spend the time on the catalog import and the first fifty approvals instead; that is what decides whether the gallery converts.

### FAQs

**Q: Does Idukki have a BigCommerce app in the marketplace?**

A: Not yet. The install is a script tag in the Stencil theme, which takes about as long as installing an app and does not depend on the theme having app-block support.

**Q: Will the widget hurt my Core Web Vitals?**

A: The loader is deferred and the gallery reserves its height before content arrives, so it does not shift layout. The widget speed programme post has the measured numbers.

**Q: Can shoppers add to cart without leaving the gallery on BigCommerce?**

A: Today the gallery opens the product page. In-gallery cart writes use platform cart APIs that are wired for Shopify; BigCommerce support follows the order-webhook integration.

### Sources
- [BigCommerce Dev Center: Stencil theme templates](https://developer.bigcommerce.com/docs/storefront/stencil/themes/context/templates)
- [Idukki: Inside the widget speed program](/blog/widget-speed-program)
- [Idukki: BigCommerce platform page](/platforms/bigcommerce)

---
Canonical: https://idukki.io/blog/add-ugc-shoppable-video-bigcommerce
Tags: bigcommerce, shoppable-video, install, stencil
