> For the complete documentation index, see [llms.txt](https://docs.abtasty.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.abtasty.com/account/how-to-implement-the-transaction-tag/how-to-use-the-transaction-tag-generator.md).

# How to use the Transaction Tag Generator

[***Transaction tag generator***](/account/how-to-implement-the-transaction-tag/how-to-create-a-transaction-tracker-via-datalayer.md) enables you to implement your transaction tag easily as you just need to indicate where to find the transaction data. The transaction tag will be automatically embedded in the generic tag with no need for creating or modifying any code.&#x20;

{% hint style="danger" %}
This feature is deprecated. Please read our [How to implement the transaction ta](/account/how-to-implement-the-transaction-tag.md)[g](/account/how-to-implement-the-transaction-tag.md) article for alternative methods.
{% endhint %}

***Transaction tag generator*** enables you to implement your transaction tag easily as you just need to indicate where to find the transaction data. The transaction tag will be automatically embedded in the generic tag with no need for creating or modifying any code.&#x20;

**Benefits**:

👉 Debugging is made easier since we have more visibility on what has been set up compared with a code you have to add to your source code or your TMS.

👉 The transaction tag generator is based on data layer variables or CSS selectors you have defined. These parameters are more stable than using a custom code.

{% hint style="warning" %}
**Heads up** ⚡

👉 You must implement and find the exact variable names to make the transaction tag generator work.

👉 If the variables are modified on your website, it will also impact the transaction tag collection. You will need to adapt the transaction tag implementation accordingly.

When implementing the transaction tag directly in the settings, you do not need to implement it again into your source code.
{% endhint %}

### **Configuration** <a href="#id-01gp0qakfgm7qanxtb2ccdx0tm" id="id-01gp0qakfgm7qanxtb2ccdx0tm"></a>

You can implement your transaction tag using one of the three following methods:

👉[**Datalayer mode**](#h_01gft5svrnhm9gme8k3vp9ssvf): by declaring the variables from your data layer containing the transaction-related information.

👉[**Selector mode**](#h_01gft5tb1hx6g5xk9d4pajrxy5): by declaring the CSS selectors containing the transaction-related information.

👉[**Expert mode**](#h_01f7rksbz2bg34kzfx3xn0eteg): by completineg the code snippet.

To use the data layer mode, you first need to integrate[ ***your data layer into your AB Tasty account settings***](/integrations/integrations-general-information.md)***.***

Depending on the settings you specified, a JavaScript code is created and will be automatically included in the AB Tasty tag. This code is updated each time the configuration is modified and saved with the tag up-to-date.

First, you need to create an affiliation, which coincides with the name you will give to your transaction tag.<br>

<figure><img src="/files/nljLt6lzO8b0uCIh3Gde" alt="" width="375"><figcaption></figcaption></figure>

Then, you must specify the URL(s) of your website on which the transaction information is available, such as the confirmation page.

<img src="/files/8RtLDqE3lBfItJ1mWnU0" alt="" width="375">

You can create as many affiliations as you want and you can edit and delete them.

You need to select the method with which you want to implement your transaction tag:

#### **Data Layer Mode** <a href="#h_01gft5svrnhm9gme8k3vp9ssvf" id="h_01gft5svrnhm9gme8k3vp9ssvf"></a>

The **data layer mode** enables you to implement your transaction tag based on the variables defined in your data layer.

For each mandatory field, you need to enter the name of the key that will be extracted from the corresponding variable. These keys can be found in your data layer.

For example, to fill in the transaction ID, you need to enter the key corresponding to the transaction ID you configured in your data layer. If the transaction is available in the key **order\_id** with a corresponding value **OD564**, this means that you need to enter the **order\_id** in the **transaction ID** field.

Please note that the tag will try its best to automatically format your data to the correct data type, ie. transform a character string into a number, but some specific data conversion will not be possible. You should type in already formatted data rather than let the tag automatically convert them to avoid any issues.

<img src="/files/ESVwjMKzegVo6Qod3O7y" alt="" width="375">

#### **Selector Mode** <a href="#h_01gft5tb1hx6g5xk9d4pajrxy5" id="h_01gft5tb1hx6g5xk9d4pajrxy5"></a>

The selector mode can be used if the transaction data is available directly in the code of your confirmation page. In this case, you need to fill in each field with the corresponding CSS selector that can be used in the **document.querySelector** function.

The item count number (icn) coincides with the total number of items purchased during the transaction. It can be calculated via three different methods.

Example:

```
{
"transaction_id": "transac1234",
"items_count": 5
"products": [
{
"name": "item 1",
"quantity": 2
},
{
"name": "item 2",
"quantity": 3
}
]}
```

👉 If your key (data layer mode) or selector (selector mode) contains the total number of purchased items, select **Default**.

In the code example, the key would be *items\_count* (returns 5)

👉 If your key or selector contains unitary purchased items, select **Count.**

In the code example, the key would be *products\[]* (returns 2)\
👉 If your key or selector contains the quantity of each purchased item, select **Sum**.

In the code example, the key would be *products\[].quantity* (returns 5)

#### **Expert mode** <a href="#h_01f7rksbz2bg34kzfx3xn0eteg" id="h_01f7rksbz2bg34kzfx3xn0eteg"></a>

The Expert mode enables you to implement your transaction tag via a JavaScript code.\
By default, there is a code example that you can edit and replace with your own data, available in your source code or Datalayer. You also need to apply the appropriate format to your values (string, float or integer) as described in our [***developer portal***](https://developers.abtasty.com/).

The *transaction affiliation/name* (ta), *transaction id* (tid), *transaction revenue* (tr) and *item count number* (icn) must be declared during transaction tag implementation. The other settings are optional, however we recommend configuring them also in order to enable the application of matching filters in the reports later on.

### **Adding Purchased Items Data** <a href="#id-01gp0qakfgmh8hdpn632h2f86b" id="id-01gp0qakfgmh8hdpn632h2f86b"></a>

Information related to the purchased items can be linked to each transaction to apply matching filters in the campaign reports or to use purchase-related targeting criteria.

Purchased items data can be collected via the three available methods: Datalayer, Selecto&#x72;***,*** or Expert.

* First, select **Array of items** as an optional value and enter the key or selector corresponding to the array of objects of all items purchased during the transaction.\
  ![How\_to\_Implement\_the\_Transaction\_Tag\_04.png](/files/9WS2XMIk6vids8YGYt2K)

In the above example, all item-related data are stored in the **transactionProducts** array of the data layer, on the purchase confirmation page.

<img src="/files/CaIOAW57QMI89F3wDYss" alt="How_to_Implement_the_Transaction_Tag_05.png" width="563">

* Click **Add optional value**:\
  All the data corresponding to items’ characteristics appear as additional fields where you can insert the data layer key or selector corresponding to the item name, price, quantity, ID, and category:<br>

  <figure><img src="/files/bVeMEjFPpUtRbBWyWBbj" alt="" width="375"><figcaption></figcaption></figure>

In this example, on the data layer, the item name can be found in the **name** key, the ID in the **SKU** key, and so on.

<img src="/files/9fyACozVgg7Qh4TPWhWo" alt="" width="375">

To add the purchased items data in the Expert mode, apply the following steps:

1. Complete the variable corresponding to “\_\_TRANSACTION \_ITEMS\_ARRAY\_\_”.
2. Complete all the items characteristics with their corresponding variables in tid, in, ip, iq, ic and iv.<br>

   <figure><img src="/files/4ATNC6FWOoqTQerojuiH" alt="" width="563"><figcaption></figcaption></figure>

### **Preview** <a href="#id-01gp0qakfg1cpgxkwed3305m73" id="id-01gp0qakfg1cpgxkwed3305m73"></a>

The preview enables you to verify that your transaction tag has been correctly configured by showing the latest transactions registered on your website.

The Transaction Tag Generator is using universal collect data. This is why, after you have implemented your transaction tag, it may take a few hours for the first transactions to be visible in the preview.

Once the new affiliation has been saved, do not forget to refresh the tag (in the header right) to be sure that all your modifications are taken into account in production.

For each transaction, the values corresponding to the keys you specified in your transaction tag are displayed:

<figure><img src="/files/J3lBSnOpVcCcqld76eLe" alt="" width="375"><figcaption></figcaption></figure>

If the preview is still empty after several hours, it probably means that one of the fields has not been implemented correctly. Please, check the URL page and all the fields again to be sure that everything is set up correctly. If not, you should ask your technical team or your dedicated AB Tasty consultant to do it for you.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.abtasty.com/account/how-to-implement-the-transaction-tag/how-to-use-the-transaction-tag-generator.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
