Plugins
WooCommerce Integration
Full e-commerce funnel for WooCommerce via WordPress hooks and a frontend script.
Full e-commerce funnel for WooCommerce via WordPress hooks plus a frontend script.
1. Include the script — functions.php
define('TH_API_KEY', 'th_YOUR_API_KEY');
add_action('wp_head', function() {
echo '<script src="https://collect.tugus.io/v1/tg.min.js" data-key="' . TH_API_KEY . '" async></script>';
});2. view_content — product page
add_action('woocommerce_after_single_product', function() {
global $product;
if (!$product) return;
?>
<script>
tugus.track('view_content', {
content_id: '<?= esc_js($product->get_sku() ?: $product->get_id()) ?>',
content_name: '<?= esc_js($product->get_name()) ?>',
content_type: 'product',
value: <?= (float) $product->get_price() ?>,
currency: '<?= get_woocommerce_currency() ?>',
});
</script>
<?php
});3. add_to_cart — cart
// Intercept the WooCommerce AJAX add-to-cart event
jQuery(document).on('added_to_cart', function(e, fragments, cart_hash, $btn) {
tugus.track('add_to_cart', {
content_id: $btn.data('product_id')?.toString(),
content_name: $btn.closest('.product').find('.woocommerce-loop-product__title').text().trim(),
content_type: 'product',
value: parseFloat($btn.data('product_price') || 0),
currency: wc_add_to_cart_params?.currency || 'EUR',
quantity: parseInt($btn.closest('form').find('[name="quantity"]').val() || 1),
})
})4. initiate_checkout — checkout start
add_action('woocommerce_before_checkout_form', function() {
$cart = WC()->cart;
$items = [];
foreach ($cart->get_cart() as $item) {
$product = $item['data'];
$items[] = [
'content_id' => (string) ($product->get_sku() ?: $product->get_id()),
'content_name' => $product->get_name(),
'quantity' => (int) $item['quantity'],
'price' => (float) $product->get_price(),
];
}
?>
<script>
tugus.track('initiate_checkout', {
value: <?= (float) $cart->get_total('edit') ?>,
currency: '<?= get_woocommerce_currency() ?>',
num_items: <?= $cart->get_cart_contents_count() ?>,
contents: <?= json_encode($items) ?>,
});
</script>
<?php
});5. purchase — order completion (server-side)
add_action('woocommerce_payment_complete', function($order_id) {
$order = wc_get_order($order_id);
$items = [];
foreach ($order->get_items() as $item) {
$product = $item->get_product();
$items[] = [
'content_id' => (string) ($product?->get_sku() ?: $item->get_product_id()),
'content_name' => $item->get_name(),
'quantity' => (int) $item->get_quantity(),
'price' => (float) ($item->get_total() / $item->get_quantity()),
];
}
wp_remote_post('https://collect.tugus.io/collect/' . TH_API_KEY, [
'headers' => ['Content-Type' => 'application/json'],
'body' => json_encode([
'event' => 'purchase',
'order_id' => (string) $order_id,
'value' => (float) $order->get_total(),
'currency' => $order->get_currency(),
'contents' => $items,
'user' => [
'email' => $order->get_billing_email(),
'phone' => $order->get_billing_phone(),
'first_name' => $order->get_billing_first_name(),
'last_name' => $order->get_billing_last_name(),
'zip' => $order->get_billing_postcode(),
'country' => $order->get_billing_country(),
'city' => $order->get_billing_city(),
],
]),
]);
});Overview: all events
| Event | Trigger |
|---|---|
view_content | woocommerce_after_single_product |
add_to_cart | jQuery added_to_cart |
initiate_checkout | woocommerce_before_checkout_form |
purchase | woocommerce_payment_complete (server-side) |