# UGC widget for WooCommerce and WordPress: install, tag, measure

WordPress gives you three ways to place a UGC gallery: a theme footer script, a Custom HTML block, or a shortcode. Here is which to use, how product tagging works with WooCommerce, and what add-to-cart does on Woo today.

By Rohin Aggarwal · 2026-09-06

The WooCommerce store ran a page builder, a caching plugin, a lazy-load plugin and a "social feed" plugin that had not been updated since 2023 and loaded jQuery twice. Removing that last one was the biggest speed win of the quarter. The gallery that replaced it was one shortcode.

**Quick answer**

- Load the Idukki script once, site wide, with a header-and-footer plugin or your theme's functions.php; place galleries with a Custom HTML block in Gutenberg or the same div in any page builder.
- WooCommerce products come in through the built-in product export CSV or a feed plugin; tagging then works exactly as it does on Shopify.
- Add-to-cart inside the gallery works on WooCommerce when the store's cart fragments are available; otherwise it opens the product page. Order attribution waits on the WooCommerce order webhook integration.
- Delete the old social-feed plugin. It is almost certainly the slowest thing on the page.

WordPress is the platform where the install question has the most possible answers, which is why merchants get stuck. There are three that work; pick by who will maintain the site.

## Three ways to place the gallery

### 1. A header-and-footer plugin (most teams)

Plugins such as WPCode or Insert Headers and Footers let you add a script to every page without touching the theme. Paste the loader into the footer slot. Then, on any page, add a Custom HTML block containing the placeholder div. Theme updates never touch it.

### 2. functions.php (developer-maintained sites)

```php
add_action( 'wp_footer', function () {
  echo '<script async src="https://widget.idukki.io/idukki.js"></script>';
} );
```

Use a child theme so the hook survives updates. The placeholder div still goes in the page content or template where the gallery belongs.

### 3. A shortcode you write once

```php
add_shortcode( 'idukki', function ( $atts ) {
  $a = shortcode_atts( [ 'guid' => '', 'pid' => '' ], $atts );
  $pid = $a['pid'] ? ' data-filter-pid="' . esc_attr( $a['pid'] ) . '"' : '';
  return '<div data-ugc="idukki" data-guid="' . esc_attr( $a['guid'] ) . '"' . $pid . '></div>';
} );
```

With the shortcode in place, editors drop [idukki guid="…"] into any post or product description. On a WooCommerce single product template, pass the product id so the gallery filters to that product: [idukki guid="…" pid="{product id}"], or in a template file use get_the_ID() to fill it.

## Getting WooCommerce products into the tagger

WooCommerce ships a product exporter (Products, then Export) that writes a CSV with SKU, name, price, image and permalink. Import that file in the Idukki dashboard and map the columns once. Stores that already run a Google Shopping feed plugin can paste the feed URL instead and schedule a re-sync, which keeps prices honest when a sale starts.

Variable products are the one wrinkle: tag the parent product, not each variation. The gallery links to the parent page, where WooCommerce handles variation selection the way it always does.

## Add to cart and measurement on Woo, honestly

On a stock WooCommerce theme the gallery can add to cart in place, because WooCommerce exposes its cart parameters and fragments on the page and the widget uses them. Some themes and optimisation plugins strip or defer those globals; when they are missing, the gallery falls back to opening the product page rather than failing silently. If you see the fallback and want in-place cart writes, the usual culprit is a script-defer plugin excluding jQuery from the page.

Measurement follows the same shape as the [BigCommerce guide](/blog/add-ugc-shoppable-video-bigcommerce): impressions, post clicks, product clicks and add-to-cart intent are tracked on every platform; attributing an order to a post needs the platform's order webhook, which is live for Shopify and scheduled for WooCommerce. Until then, the WooCommerce numbers stop at intent.

## The plugin you should remove

Most WordPress stores that come to us already have a social-feed plugin. The typical one injects its own copy of jQuery, loads every image at full size, and fetches the feed on the client on every page view. Replacing it with a single deferred loader is usually the largest Largest Contentful Paint improvement available on the site, before any UGC benefit is counted. Measure before and after with PageSpeed Insights; the widget speed programme post shows what to look for.

**The rule:** On WordPress, the install method matters less than the removal. One script, one div or shortcode, and the old feed plugin gone. Then spend the saved time on the catalog import and the first approvals.

### FAQs

**Q: Is there an Idukki WordPress plugin?**

A: Not in the WordPress directory today. The script-and-div install works on every WordPress site, including page builders, and does not depend on plugin updates.

**Q: Does it work with Elementor, Divi or Bricks?**

A: Yes. Each builder has an HTML or code widget; paste the placeholder div into it. The loader goes in the site footer as described above.

**Q: Why does add-to-cart open the product page on my store?**

A: The widget writes to the WooCommerce cart only when the store exposes its cart parameters on the page. A script-defer or optimisation plugin that removes jQuery from the page triggers the product-page fallback.

### Sources
- [WooCommerce documentation: Product CSV importer and exporter](https://woocommerce.com/document/product-csv-importer-exporter/)
- [WordPress developer resources: Shortcode API](https://developer.wordpress.org/plugins/shortcodes/)
- [Idukki: Inside the widget speed program](/blog/widget-speed-program)
- [Idukki: WooCommerce platform page](/platforms/woocommerce)

---
Canonical: https://idukki.io/blog/ugc-widget-woocommerce-wordpress-shoppable-video
Tags: woocommerce, wordpress, shoppable-video, install