GA4 (Google Analytics 4) event tracking in complete.tpl

thisismatt · February 26, 2021

Whilst GA4 is relatively new, I'm surprised to not be able to find much talk, let alone any references, on how to include the necessary data layer events within WHMCS' order form template files. What little I have found is so very out-of-date and no longer applicable (that I can see, anyway).

So, looking at https://developers.google.com/analytics/devguides/collection/ga4/ecommerce#purchase as a starter, I can't work out how to include this example (including the example data, as I want to see it working) in /orderforms/standard_cart/complete.tpl.

Then, of course, is ensuring that my order-specific data replaces that of Google's example.

So, the short question here is - how do we include Google Analytics events within WHMCS template files?

Has no-one here done this (recently, so that it is still relevant to WMCS v8 and/or GA4)?

I don't suppose @brian! can offer some insight here?

As always, thanks for any help provided.

Edited February 26, 2021 by thisismatt

WHMCS John · February 26, 2021

Hi @thisismatt,

Our official Google Analytics module supports GA4 integration, check out this blog post for the info: https://blog.whmcs.com/133669/google-analytics-4-support-in-the-google-analytics-addon

If you need to add custom code in addition to that, please make sure curly braces are escaped: https://www.smarty.net/docs/en/language.escaping.tpl

thisismatt · February 26, 2021

Hi John, thanks for replying.

So whilst I have indeed used your module to integrate GA4 within my WHMCS installation; I'm looking to add extra information from WHMCS to GA through 'enhanced ecommerce', which appears to require additional code within WHMCS to pass this data.

This is where I'm struggling to proceed; hence reaching out here for help.

MacZil · May 31, 2022

On 2/26/2021 at 8:46 PM, thisismatt said:

Hi John, thanks for replying.

So whilst I have indeed used your module to integrate GA4 within my WHMCS installation; I'm looking to add extra information from WHMCS to GA through 'enhanced ecommerce', which appears to require additional code within WHMCS to pass this data.

This is where I'm struggling to proceed; hence reaching out here for help.

Couldn't agree more, @thisismatt!

Being able to utilize GA's ecommerce tracking with WHMCS (besides the generic GA integration) would be an invaluable feature for customers and should definitely be incorporated into the standard WHMCS mix.

If you haven't done so already, you should request this feature so that members can upvote it.

WHMCS John · June 2, 2022

Hi @thisismatt,

What's the nature of the issue you experience after adding it to complete.tpl and making sure any curly braces are escaped by a blank space?

To test, I suggest placing an order and making a payment. Any syntax errors will be logged to the Configuration > System Log.

jkalia · October 28, 2022

On 2/26/2021 at 9:16 PM, WHMCS John said:

Hi @thisismatt,

Our official Google Analytics module supports GA4 integration, check out this blog post for the info: https://blog.whmcs.com/133669/google-analytics-4-support-in-the-google-analytics-addon

If you need to add custom code in addition to that, please make sure curly braces are escaped: https://www.smarty.net/docs/en/language.escaping.tpl

Is this tracking revenue GA4 by default? Or additional configuration is required?

I was able to config conversion flow - but the revenue value is not being populated.

WHMCS John · October 30, 2022

Hi @jkalia,

Order total is sent to Google Analytics, yes.

Eyder · March 2, 2023

So, how could we get add-to-cart events, and all dataLayer parameters, initiate checkout events and all parameters??

unrealindeed · April 24, 2023

Maybe adding a ShoppingCartCheckoutCompletePage hook with the dataLayer and relevant values would work?

See Make a purchase from google docs.

NOTES:
- Not all $variables are correct here, this is just a starting point.
- This is assuming you have created a 'purchase event' in Google tag manager

add_hook('ShoppingCartCheckoutCompletePage', 1, function() {
    return <<<HTML
    <script>
        window.dataLayer = window.dataLayer || [];
        dataLayer.push({ ecommerce: null }); // Clear the previous ecommerce object.
        dataLayer.push({
            'event': 'purchase',
            'ecommerce': {
                'transaction_id': '{$ordernumber}',
                'value': {$total},
                'tax': {$taxtotal},
                'currency': 'EUR',
                {if $promotioncode}'coupon': '{$promotiondescription}',{/if}
                'items': [
                    {foreach $products as $product}
                    {
                        'item_id': '{$product}',
                        'item_name': '{$product.description}',
                        'price': {$product.amount},
                        'quantity': 1
                    },
                    {/foreach}
                ],
            }
        });
        </script>
    HTML;
});

unrealindeed · April 25, 2023

UPDATE

By dumping the $vars on cart.php?a=complete page using the same hook ShoppingCartCheckoutCompletePage, I can see and access only some variables like orderid and amount.

I dont know how to access tax, currency nor can I create a for loop for each product item to get each purchased product's price, name, quantity etc

Does anyone know how to access the rest of the variables needed?

add_hook('ShoppingCartCheckoutCompletePage', 1, function($vars) {

	$orderid	= $vars['orderid'];
	$amount		= $vars['amount'];

    return <<<HTML
	<script>
        window.dataLayer = window.dataLayer || [];
        dataLayer.push({ ecommerce: null }); // Clear the previous ecommerce object.
        dataLayer.push({
            'event': 'purchase',
            'ecommerce': {
                'transaction_id': '$orderid',
                'value': $amount,
                'tax': ,
                'currency': '',
                'coupon': '',
                'items': [
                    {
                        'item_id': '',
                        'item_name': '',
                        'price': ,
                        'quantity': 1
                    },
                ],
            }
        });
		</script>
	HTML;
});

GA4 (Google Analytics 4) event tracking in complete.tpl

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Similar Content

Recently Browsing 0 members

Important Information