Google Ecommerce

Add the GTM container ID.

Flexformz uses the Enhanced Ecommerce features to be able to track the conversions.

To add your container ID to FlexFormz:

1. Log in into your WordPress dashboard.
2. On the left menu select Flexformz » Settings.
3. Add your container ID into the Google Tag Manager (GTM) Container ID field.
4. Save your changes.

Enable Ecommerce on your Google Analytics Account.

1. Sign in to Google Analytics.
2. Click Admin, and navigate to the view for which you want to turn on Enhanced Ecommerce.
3. In the VIEW column, click Ecommerce Settings.
4. Set the Enable Ecomerce status to ON.
5. Set the Enable Enhanced Ecommerce Reporting status to ON.
6. Save.

 

1. Sign in to Google Tag Manager.
2. Select the site container.
3. On the left menu click on Triggers.
4. Click on New.
5. Click on Trigger Configuration.
6. Choose the Custom Event trigger type.
7. To let Flexformz know about the transaccion you need to add ffzDonation as the Event name.
8. Save and name your Trigger.

Create a new Tag on GTM

1. On the left menu click on Tags
2. Click on New
3. Click on Tag Configuration.
4. Choose a Google Analytics - Universal Analytics tag type.
5. Set Page View as Track Type
6. On the Google Analytics Settings field, choose Google Analytics Settings and click on the “i” icon on the right of the field.
7. Check that the Tracking ID is the correct one.
8. Click on More Settings
9. On the Ecommerce tab, check the Enable Enhanced Ecommerce Features option.
10. Check the Use data layer option.
11. Save this setting.
12. Click on Triggering.
13. Search and select the custom trigger that you have created on the previous step.
14. Save and name the tag.

Facebook Conversions API

Introduction

Flexformz is now able to connect to the recent and improved tracking tool that Meta and Facebook are suggesting now: the Conversions API. A tool developed by Meta to be a successor for the Pixel, that allows more freedom, privacy and reliability when tracking users.

With all the new privacy features in modern browsers and operating systems, this tool is now the best way to track visitors, actions in your site, and important events like one time donations or monthly subscriptions. It still requires a Facebook Pixel to associate the data with it, but it works very differently than a regular pixel.

The common FB Pixel setup will only add a JavaScript code that will be triggered and handled by the browser window. This has very low customization options and makes it very difficult to manage exactly when to send the event and what to send inside of it. As privacy becomes more of a concern, it gets more difficult for the sites to get those browser events that will trigger the pixel on their own. One could say that modern browsers are “killing” the Pixel communication with Facebook.

Integrating an app such as Flexformz to the Conversions API means being able to have a lot more control about which actions will send information, what information to send, exactly when to send it, and instead of relying on each user’s browser entirely, we will be asking the Flexformz server to handle the communication between your site and Facebook. This makes the connection more reliable and safer.

The user information needs to be encrypted before being sent; the Conversions API will reject receiving the events if the user’s information is not correctly hashed. Nonetheless, it is important to include a disclaimer on your website about sending this information to Facebook.

Making use of the Conversions API will help optimize ad delivery cost, create even more custom and precise audiences, and keep better track of your users, so you can find it easier to move them through the conversion funnel.

Requirements

To connect your Flexformz instance to the Facebook Conversions API, you will need:

• A Business Manager account: This is where you manage your pixels, pages, data origins. If you do not have this, you will also need a Facebook account to validate your identity. You can only create up to 2 business manager accounts per Facebook account. More information on how to create this account can be found here.
• Access to a Facebook Pixel: You will need an active Facebook Pixel and the rights to use it. In this documentation, it is assumed that you know what a Facebook Pixel is and what it is used for. If you do not know how to obtain it, refer to this documentation. If you do not know what the Pixel is or what it is used for, refer to this section of the help pages.
• An Access Token for your Pixel: The Pixel uses an access token to allow the Conversions API to link the event’s information with it. To generate it, the easiest way is to go to the Business Manager / Data Origins / Selected Pixel / Settings, and click on Generate Access Token. Save this code in a safe place. You could also save it in the Flexformz settings as explained below. A more detailed explanation about how to generate the access token can be found here.
• An App with access to the Pixel: Once you have the Access Token, the next step, if you have not done this already, is to create a Facebook App that will use the Conversions API. You will need to go back to the Overview tab of the Pixel, then click on “Manage Integrations”. In the pop up window, click on “Manage” for the Conversions API row. This automatically creates a Conversions API App, and a Conversions API system user for you. You do not need to submit this app for revision or to request permissions. More information found here.

• An Ads Account: You are required to have an advertising account that has campaigns that run on Facebook Ads, since that is what we will be optimizing with the API.

Settings

On your WordPress website, go to Flexformz Plugin / Settings / Facebook, and expand the available options. You will find the following fields:

• Pixel ID: The identifier for the Facebook Pixel that will be receiving the events from your Flexformz instance. You need access to this pixel to be able to use the information that will be sent.
• Access Token: The generated access key that your app or page needs to have in order to be used with the Conversions API. If you do not have it or do not know what it is, please refer to the previous section of this documentation.
• API Version: We can choose to use a different API version in this field. Different versions have different structures for the API endpoints, so it is recommended to leave it empty for the default version to be used. Please consult us if you intend to use a different version than 15.0.
• Test Mode: We can turn the test mode on or off with this switch. Turning it on means that the next field will be included as the Test Event Code inside of all the events being sent to the API.
• Test Event Code: Corresponds to a code found in the Facebook Events Manager. It changes regularly and it is specifically intended for the browser that you will be using for the tests. If two people are testing the same pixel on different machines, this code will be different for each one. Please consider that it is not recommended that more than one person test the integration at the same time. More information about testing in the next section.

How to Test the Integration

1. Go to your Facebook Events Manager / Data Origins, then select the pixel that you will be using. Go to the “Test Events” tab. On the right side of the screen, you will find a test event code. Copy this code and save it in the “Test Event Code” field of the Facebook settings for Flexformz.
2. Keep this window and tab opened. If the settings are saved, the test mode is turned on and you have used the correct test event code. You can start the testing process.
3. Go to any of your Flexformz forms and fill out the forms per what you are wanting to test. The events will start appearing in the “Test Events” tab of your Events Manager. Sometimes they appear quickly, others take a bit longer.
4. You can click on them to get more information, or export them as a file that you can download and open locally. For safety reasons, some fields will not be included in the information available to export, so do not panic if you feel like there is information that is not being received by Facebook. You can verify the received fields at the bottom description of the events being sent.
5. Please keep in mind that as long as the Test Mode option is turned on, the events will be discarded by Facebook even if the Test Event Code is wrong.

Setting up Event Deduplication

If you already have a Pixel installed on your site, you should consider that Facebook needs a way to tell that the same event that was sent by the server could have also been received directly from the browser.

This is very important since we do not want to count the same event as two different events. We can achieve this by sending special parameters called “Deduplication Parameters”, that serve as identifiers.

The most important parameter is the event_id. This parameter is sent from the browser when the Pixel is installed and configured in your website using Flexformz, and will also be sent through the server when the Conversions API integration is correctly configured in your Flexformz settings. There is nothing else to do from your part in terms of this parameter, because Flexformz will automatically generate it and handle its delivery through both the browser and the server.

However, in order for Facebook to recognize it, detect the duplicate events, and apply the deduplication, you need to add your website’s URL to the list of the allowed websites in your Pixel’s Settings tab, inside the Facebook Events Manager.

To do this, go to Events Manager / Data Origins, then select the Pixel installed on your Flexformz site. Next, switch to the Settings tab, scroll down to “Domains on your allow list” and click on “Edit” to add your site to the list, and this way Facebook will start deduplicating events.

Refer to this deduplication guide for more information, or contact us if you need assistance.

Events Table

Depending on the event type, the plugin will send different parameters to the Conversions API. This is mainly due to some steps not having all the information available. For example, when we complete a donation, we will have more available data than when we only load a form.

The following list describes the parameters that could be sent to the Facebook Conversions API:

The following table displays what fields will be sent for each event type:

X: Sent for the corresponding event.

O: Optional. Not necessary for the event to be sent.

Empty: Not included for the event.

Things to consider

We would like to remind you of the following:

• This is a Flexformz + Facebook Conversions API connection, therefore it will happen only while using Flexformz. If your site has pages or sections where no forms are loaded, those actions will not be sent to Facebook through this integration, so you will need to find other ways to track them.
• The browsers and operating systems will continue to give the users more control about their tracking permissions. This means that we will need to keep finding ways to respect their wishes while also being able to target our audiences in a more effective and efficient manner.
• Even though the user’s data will be ciphered, we still need to let the users know that there is a connection with Facebook. This is extremely important and you are completely responsible about disclosing this on your site if you wish to use this feature.
• While this integration makes the data reception a lot more reliable than before, we cannot guarantee a 100% success rate of the events being stored by Facebook, as this depends on many factors that do not fall completely under our control, and never will.
• With the new anti-tracking capabilities introduced after iOS 14.5, the connection struggles a little more with this OS than with any other operating system. We have detected that especially the “Donate” event sometimes struggles to be sent. This is not a bug, it is completely intentional by the OS.
• As long as the “Test Mode” is enabled, Facebook will discard the received events. Please make sure to turn this feature off when you want to start saving the information.
• Event deduplication is very important. Refer to this deduplication guide for more information, or contact us if you need further assistance.

eCommerce events for GA4

What events are tracked?

The following events are being tracked:

• view_item
• view_item_list
• add_to_cart
• remove_from_cart
• view_cart
• begin_checkout
• purchase

view_item

This event is triggered when the donor starts the process of a donation. For example, on an anywhere button, the event is triggered when the user clicks the button and sees the lightbox to choose the amount. The following parameters will be sent with this event:

view_item_list

This event is triggered when the page has a Gift Catalogz embedded. The following parameters will be sent with this event:

• item _list_name – category
• Items
  • Item_id
  • item_name

 

add_to_cart

This event is triggered when an item of the Gift Catalogz is added to the cart for the first time or when they increase the quantity of the item in the cart. The following parameters will be sent with this event:

remove_from_cart

This event is triggered when the donor removes an item from the cart or if the quantity of the item is decreased in the cart. The following parameters will be sent with this event:

view_cart

This event is triggered when the donor arrives at the checkout form with the details of the gift items in the cart. The following parameters will be sent with this event:

begin_checkout

This event is triggered when the donor arrives at the billing information section. The following parameters will be sent with this event:

purchase

This event is triggered when the donor completes the donation. The following parameters will be sent with this event:

 

GTM Settings

User-Defined Variables

If you would like to track all of the available events, the following variables are required:

• Items
• Value
• Currency
• Transaction Id
• Tax
• List Name

Please follow these steps:

1. Open GTM.
2. Go to variables.
3. Inside User-Defined variables section, create a new one.
4. Name the variable.
5. In Variable Type, choose Data Layer Variable.
6. In Data Layer Variable Name, write the follow:
   1. To track Currency write ecommerce.currency
   2. To track Value write ecommerce.value
   3. To track Items write ecommerce.items
   4. To track Transaction Id write ecommerce.transaction_id
   5. To track Tax write ecommerce.tax
   6. To track Item List Name write ecommerce.item_list_name
7. Data Layer Version choose Version 2.
8. Save.

Triggers

Each event will need its own trigger.

Please follow these steps:

1. Open GTM.
2. Go to Triggers.
3. Create a New Trigger.
4. Name the Ttrigger.
5. In Trigger Type choose Custom Event.
6. Write the event name
   1. add_to_cart
   2. remove_from_cart
   3. view_item_list
   4. begin_checkout
   5. purchase
   6. view_cart
7. This trigger fires on: All Custom Events.
8. Save.

Tags

Each event will need its own tag.

Please follow these steps:

1. Open GTM.
2. Go to Tags.
3. Create a New Tag.
4. Name the tag.
5. Tag Type choose Google Analytics: GA4 Event.
6. Configuration Tag, select your id or write it in.
7. Write the event name (you must NOT change the names)
   1. add_to_cart
   2. remove_from_cart
   3. view_item_list
   4. begin_checkout
   5. purchase
   6. View_cart
8. Event Parameter, according to the above section fill the parameter for each event and choose the corresponding value that we created before.
9. Triggering, select the corresponding trigger for this event.
10.  Save.

 

Google Analytics 4

To see the data collected, pleases follow these steps:

1. Enter your GA4 account.
2. Go to Monetization.
3. Go to Ecommerce purchases.
4. To view the other parameters as item category or item category 2, please select the item name and you will see the list of parameters.