Skip to main content
knowledgecenter.2checkout.com

Implement Google Analytics in ConvertPlus and InLine Checkout (with GTM)

Overview

You can implement Google Analytics and Google Tag Manager tracking tools to help you track and monitor your ConvertPlus and InLine checkout orders in order to improve the shopping experience and increase conversion rate.

Availability

Google Analytics and Google Tag Manager can be set for all 2Checkout accounts.

Google Analytics Settings

Implement Google Analytics

To implement Google Analytics through Google Tag Manager (GTM) for your ConvertPlus and InLine Checkout, follow these steps:

1. In your browser window, navigate to Tag manager → All accounts.

2. Click on the Create Account button.

Google analytics via GTM_1.png

3. Fill in all the required fields:

  • Account Name
  • Country
  • Container name
  • Target platform → Web

4. Click on the Create button.

5. Copy the Google Tag Manager Container ID. It will be used in the 2Checkout Merchant Control Panel for the Google Tag Manager set-up.

Google analytics via GTM_2.png

Create a Google Analytics Settings variable in Google Tag Manager

If you already have a Google Analytics Settings variable with your Google Analytics Tracking ID, then skip to step 5.

If you do not have a Google Analytics Settings variable created for your website tracking, you will need to create one to add the Google Analytics property to which you want to send data by following these steps:

1. In your Google Analytics account, navigate to Variables → User-Defined Variables → New.

Google analytics via GTM_3.png

2. From the list provided by Google, select the Google Analytics Settings option as Variable Type. Name your variable “Google Analytics Settings”, so you can easily identify it.

3. Under Tracking ID add the Google Analytics Tracking ID to which you wish to send data.

4. To get your Google Analytics Tracking ID, navigate to Google Analytics → Admin → Tracking Info → Tracking Code. You will find the code under Tracking ID. Copy and add it to your variable.

google analytics tracking id.png

5. For cross-domain tracking between your website and the 2Checkout shopping cart, you need to configure cross-domain settings in the Google Analytics variable. This set-up is needed so that Google Analytics counts a shopper coming from your website to the 2Checkout shopping cart, as the same visitor.

Go to More Settings → Cross Domain Tracking and type the following domains separate by a comma in the field named Auto Link Domains: secure.2checkout.com,tracking.avangate.net.

6. Append flags to the Google Analytics cookie with “secure” and “samesite=none”.  To do this, in the Google Analytics Settings variable, click on Fields to set, add a new field and type cookieFlags as Field Name and samesite=none as Value secure, as in the example below.

google analytics with GTM_step6_new.png

7. Click Save.

Create the trigger for the Google Analytics Convert Plus Tag

1. In Google Tag Manager, click on the Triggers section and then click to add a new trigger.

Google analytics via GTM_5.png

2. Create two triggers to track the Convert Plus and InLine shopping carts:

  • One for non-interactive events: checkout and purchase.
  • One for interactive events: removeFromCart (for the removeFromCart type of event, the user interacts with an element on the page by clicking the Remove from cart button. This is why this type of event is considered an interactive event by Google Analytics).

Create the non-interactive event trigger

  1. Name your trigger Event Ecommerce Non-interactive.
  2. From the list provided, choose Custom event as Trigger Type.
  3. In the field Event name, type  .*  and check the box Use RegEx matching.
  4. For the "This trigger fires on" section, select Some custom events.
  5. As rule, fill in the boxes with Event matches RegEx (Ignore case) checkout|purchase.
  6. Click Save.

Google analytics via GTM_6.png 

Create the interactive event trigger

  1. Name your trigger Event Ecommerce Interactive.
  2. From the list provided, choose Custom event as Trigger Type.
  3. In the field Event name, type  .*  and check the box Use RegEx matching.
  4. For the "This trigger fires on" section, select Some custom events.
  5. As rule, fill in the boxes with Event matches RegEx (Ignore case) removeFromCart.
  6. Click Save.Google analytics via GTM_7.png

Create the tag for ConvertPlus eCommerce tracking in Google Tag Manager

  1. In the Google Tag Manager interface, click on New Tag.
  2. Create two tags to track the ConvertPlus & InLine shopping carts.
  • One tag for non-interactive events: checkout and purchase
  • One tag for interactive events: removeFromCart

Google analytics via GTM_8.png

Create the tag for Non-interactive events

  1. Name your tag "Google Analytics Convert Plus – Event Type Non-Interactive”, to keep track of your tags easier.
  2. From the list provided by Google, select the option “Google Analytics: Universal Analytics” as Tag Type.
  3. For Category type Ecommerce, select Event as Track Type.
  4. For Action, select Event from the list provided by Google.
  5. In the Non-Interaction Hit field, select True.
  6. For the “Google Analytics Settings” section, select your Google Analytics Settings variable that contains the Google Analytics ID of your account.
  7. Check the box Enable overriding settings in this tag.

Google analytics via GTM_9.png

8. Under More Settings → Ecommerce → Enable Enhanced Ecommerce Features, select True.

9. Check the Use Data Layer box to capture eCommerce information from the data layer provided by 2Checkout.

Google analytics via GTM_10.png

10. In the Triggering section, select the previously configured trigger for non-interactive events: Event Ecommerce Non-interactive.

Google analytics via GTM_11.png

11. Click Save.

Create the tag for Interactive events

  1. Name your tag “Google Analytics Convert Plus – Event Type Interactive”, to keep track of your tags easier.
  2. From the list provided by Google, select the Google Analytics: Universal Analytics option as Tag Type.
  3. Select Event as Track Type.
  4. Select Ecommerce for Category type.
  5. From the list provided by Google, select Event for Action.
  6. In the Non-Interaction Hit field, select False.
  7. For the Google Analytics Settings section, select your Google Analytics Settings variable that contains the Google Analytics ID of your account.
  8. Check the Enable overriding settings in this tag box.

Google analytics via GTM_12.png

9. Under More Settings → Ecommerce → Enable Enhanced Ecommerce Features, select True.

10. Check the Use Data Layer box to capture eCommerce information from the data layer provided by 2Checkout.

Google analytics via GTM_13.png

11. In the Triggering section, select the previously configured trigger for Interactive events: Event Ecommerce Non-interactive.

Google analytics via GTM_14.png

12. Click Save.

Enable Enhanced Ecommerce in your Google Analytics account

1. To enable Enhanced Ecommerce in your Google Analytics account, go to Admin → View Settings → Ecommerce settings.

2. Make sure the settings for Enable Ecommerce & Enable Enhanced Ecommerce Reporting are both ON.

Google analytics via GTM_15.png

This information applies to Google Analytics without GTM as well.

Exclude the 2Checkout domains from the referral list

To exclude the 2Checkout domains from the referral list in your Google Analytics account, follow these steps:

1. Go to Admin → Property settings → Tracking info → Referral Exclusion List.

 2. Add your website’s domain and the following 2Checkout domains: secure.2checkout.com and tracking.avangate.net.

 

Google analytics via GTM_16.png

This information applies to Google Analytics without GTM as well.

Test your Google Analytics Settings

To test if your Google Analytics settings are correct, follow the steps below:

1. Enter Preview mode from the Google Tag Manager.

Google analytics via GTM_17.png

Google analytics via GTM_18.png

2. Enter the shopping cart while in Preview mode. Because the Google Tag Manager script is placed in an iFrame, additional settings are required for the Preview mode to be available.

3. Right click in the shopping cart and click on Inspect element. Hit Ctrl+F in the Elements section and type <iframe in the search bar. 

google analytics with GTM_test_new_3.png

4. You will find more iFrames and you need to select the one with the Google Tag Manager script. To do so, click to open the iFrame, then click on #document and then click on <html> , <body>, and in the <body> section make sure there is a Google Tag Manager script, as in the example below.

google analytics with GTM_test_new_4.png

5. You need to edit the Style element for the iFrame containing the Google Tag Manager script and provide the width and height attributes. To do this, navigate to Styles in the right-side menu and add the following values under the Style element:

  • width: 1600px
  • height: 600px for ConvertPlus and 1200px for InLine Checkout

Additionally, you will need to remove the hide class option. To do this, double click on class="hide" and delete it. In the end, you will have the iFrame without class="hide" and with the width and height attributes, as in the image below.

google analytics with GTM_test_new_5.png

6. Scroll down to the bottom of the cart page and you will see the Tag Manager section under Tags. Check if the tags you set up for the 2Checkout shopping cart fired.

google analytics with GTM_test_new_6.png

Submit and publish your settings

Google analytics via GTM_20.png

Merchant Control Panel Settings

The Analytics section in your Merchant Control Panel allows you to integrate Google Analytics or/and Google Tag Manager in the ConvertPlus or InLine ordering engines and thus track the behavior of your shoppers on the 2Checkout pages.

Follow these steps to complete your analytics integration:

  1. Log into your Merchant Control Panel.
  2. Navigate to Setup → Ordering options.
  3. Click on the Analytics tab.
  4. Click on the ConvertPlus and InLine Checkout tab.

Google analytics via GTM_Merchant Control Panel_1.png

5. In the Google Analytics box, click on Set up and fill in the Google Analytics Tracking ID. Here is how you obtain it.

Google analytics via GTM_Merchant Control Panel_2.png

6. In the Google Tag Manager box, click on Set up and fill in the Google Tag Manager code. Here is how you obtain it.

Google analytics via GTM_Merchant Control Panel_3.png

7. Complete the integration by using the slider to activate both Google Analytics and the Google Tag Manager. It is not recommended to activate both to send data to the same Google Analytics view, otherwise, duplicate data will occur.

Google analytics via GTM_Merchant Control Panel_4.png

1. 2Checkout data layer for tracking through Google Tag Manager is placed in an iFrame. This data layer has an eCommerce object, that contains eCommerce information built on the structure required by Google Analytics reporting for the following events : checkout, purchase and remove from cart.

2. For fully enhanced eCommerce reporting in Google Analytics, it is recommended that you send information to Google Analytics from your website  that includes product impression, product detail and add to cart. More information on enhanced eCommerce reporting and how to send Product View and Add to Cart data to Google Analytics can be found here: https://developers.google.com/tag-manager/enhanced-ecommerce

3. In addition to the eCommerce object, the data layer also contains an event called  cartUpdated that includes additional parameters with information on the shopping cart. These parameters can be used to capture further information in custom dimensions. Refer to the Google Documentation on how to build custom dimension through  Google Tag Manager: https://support.google.com/tagmanager/answer/6164990?hl=en .

  • Was this article helpful?