Skip to content
Fitle

Events

The integration of events requires to edit themes and templates in WooCommerce. At this moment, WooCommerce provides two ways to customize the appearance of your store (theming): using Block Theme Development or Classic Theme Development.

You will need to edit your theme and add custom PHP code to add custom Javascript on the product page. The objective is to make the page both (1) import the script and (2) trigger the execution of Javascript code. Please refer to the general Events > Setup section for instructions on what the page should include.

The execution of the Javascript code to send events can be triggered through the use of WooCommerce action hooks.

add_action( 'action_name', 'your_function_name' );


function your_function_name() {
    // Your code
}

Two possible action hooks that might be used are:

  1. woocommerce_add_to_cart

    add_action( 'woocommerce_add_to_cart', 'send_fitle_cart', 10, 6 );
    

    function send_fitle_cart( $cart_id, $product_id, $request_quantity, $variation_id, $variation, $cart_item_data ) {
        // Get information for the event
        // $size = ...
    

        // Output the script to the page
        ?>
        <script>window.ftldataLayer=window.ftldataLayer||[],ftltag=ftltag||function(){ftldataLayer.push(arguments)};</script>
        <script>
            ftltag('event', 'cart', {
                product_id: '<?php echo esc_js( $product_id ); ?>',
                size: '<?php echo esc_js( $size ); ?>'
            });
        </script>
        <?php
    }

  2. woocommerce_thankyou: this might be safer than others because it ensures the order is actually processed, and the payment did not fail.

    add_action( 'woocommerce_thankyou', 'send_fitle_transaction_end' );
    

    function send_fitle_transaction_end( $order_id ) {
        // Get information for the event
        // $products = ...
        // $total_price = ...
    

        // Output the script to the page
        ?>
        <script>
            ftltag('event', 'transaction_end', {
                order_id: '<?php echo esc_js( $order_id ); ?>',
                products:  <?php echo json_encode($products); ?>,
                total_price: '<?php echo esc_js( $total_price ); ?>',
            });
        </script>
        <?php
    }