# Add a New Tag (Browser)

## Introduction

You can add a new tag to capture browser or client-side data. This helps in tracking specific user interactions or behaviors based on browser activity.

## Procedure

To add a new Tag for browser/client-side, perform the following steps:

**Step 1:** Select **Tags** from the left navigation panel.

<figure><img src="https://2731380315-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FaDMDmegqZUJFhJhF4JQG%2Fuploads%2Fydbra7Sqm0MHpuaTSJW4%2Fimage.png?alt=media&#x26;token=c8cfe9f8-9f85-4a18-891f-d28baf050114" alt=""><figcaption></figcaption></figure>

**Step 2:** Click the **Add Tag** dropdown in the top right, then select **For Browser** from the list.

<figure><img src="https://2731380315-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FaDMDmegqZUJFhJhF4JQG%2Fuploads%2FZEscEjedUbh6qaKyq5b6%2Fimage.png?alt=media&#x26;token=815e9c20-4ea0-4ea7-9395-a37f85680e4d" alt=""><figcaption></figcaption></figure>

**Step 3:** The **Select Provider** panel opens on the right side. You can choose a provider from the list or use the search bar to find and select a provider.

<figure><img src="https://2731380315-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FaDMDmegqZUJFhJhF4JQG%2Fuploads%2Ff8hH6YXihy75r59nZr9u%2Fimage.png?alt=media&#x26;token=b5b46a8c-ac8a-4955-b907-eb336d9d65b9" alt=""><figcaption></figcaption></figure>

After selecting a provider, the **Tags** screen opens.

<figure><img src="https://2731380315-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FaDMDmegqZUJFhJhF4JQG%2Fuploads%2FFK0HD53pRl1NbqQCC8Zy%2Fimage.png?alt=media&#x26;token=c86f3438-5712-4e1f-9cae-884acf6c389e" alt=""><figcaption></figcaption></figure>

**Step 4:** Select Trigger

**Step 4.1:** In **Triggers**, click **Choose Trigger**.

<figure><img src="https://2731380315-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FaDMDmegqZUJFhJhF4JQG%2Fuploads%2Fi3tuCPAQxIKMiaXY1oX4%2Fimage.png?alt=media&#x26;token=14b7dea3-a006-4231-a325-b0bc9092d24e" alt=""><figcaption></figcaption></figure>

**Step 4.2:** The **Choose Triggers** panel opens with two tabs:

* **User-Defined**: Displays custom triggers created by users.
* **Default**: Contains predefined system triggers.

**Step 4.3:** Select a trigger from the list or use the search bar to find and select a trigger.

**Note:** Multiple triggers can be selected.

**Step 4.4:** Click **Done**.

<figure><img src="https://2731380315-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FaDMDmegqZUJFhJhF4JQG%2Fuploads%2FbWwXXypPDhttjV3P20Dz%2Fimage.png?alt=media&#x26;token=774d8e64-f236-47f8-922f-4c98aa1e3a13" alt=""><figcaption></figcaption></figure>

The selected trigger appears on the **Triggers** screen.

**Note 1:** You can remove the selected trigger by clicking the **Clear** button or click the small cancel icon next to each trigger to remove them individually.

<figure><img src="https://2731380315-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FaDMDmegqZUJFhJhF4JQG%2Fuploads%2FN9mzA0cj1lE3QLYngEvJ%2Fimage.png?alt=media&#x26;token=02c8bbee-cbaf-4449-9265-6195215ddeb0" alt=""><figcaption></figcaption></figure>

**Note 2:** If mandatory details are not filled in, the following warning message gets triggered:

![](https://ingest-lab.netlify.app/images/tagsimages/triggerwarning.png)

![](https://ingest-lab.netlify.app/images/tagsimages/mandatoryfieldwarning.png)

**Step 5:** Qualification Criteria (Optional)

The Qualification Criteria are the conditions/triggers that inform Ingest Labs when to trigger a particular tag. You can add multiple Qualification Criteria, and these criteria are layered.

**Step 5.1:** Click **Qualification Criteria (Optional)**.

<figure><img src="https://2731380315-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FaDMDmegqZUJFhJhF4JQG%2Fuploads%2F4kRHJTb2eAtLyuFKbrMf%2Fimage.png?alt=media&#x26;token=7ea75395-ad60-4684-a9d8-0f104ef26f80" alt=""><figcaption></figcaption></figure>

**Step 5.2:** The **Qualification Criteria** panel opens on the right side.

Select a qualification criterion from the list or use the search bar to find and select one.

You can select multiple qualification criteria.

**Step 5.3:** Click **Done**.

<figure><img src="https://2731380315-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FaDMDmegqZUJFhJhF4JQG%2Fuploads%2F6kD8z0nP6ghm7cFmhOom%2Fimage.png?alt=media&#x26;token=9a4b1cce-191c-4677-bb7a-5724e920de41" alt=""><figcaption></figcaption></figure>

The selected qualification criteria appear on the **Qualification Criteria (Optional)** screen.

**Note:** You can click **Clear** to remove all selected qualification criteria at once, or click the small cancel icon next to each one to remove them individually.

<figure><img src="https://2731380315-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FaDMDmegqZUJFhJhF4JQG%2Fuploads%2Fgqofa566quhj5LMUtYtS%2Fimage.png?alt=media&#x26;token=01347504-9756-4ad4-b3df-f232de8ca75c" alt=""><figcaption></figcaption></figure>

**Step 6:** Tag Info

You can set the tag name and validity period. The default validity period is one year for any new tag and can be set to any desired date. To understand tag validity or expiry, see the section **Set the Validity period and Tag Expiry**.

**Step 6.1: Name:** The Tag name.

**Step 6.2: Validity Period:** Denotes the Tag Validity period including Start Date and End Date.

![](https://ingest-lab.netlify.app/images/tagsimages/taginfo.png)

**Set Validity and Tag Expiry**

While creating a tag in Tag Manager, you can set the validity period of a particular tag and define its expiry. The default validity period is one year for any new tag and can be set to any desired date. When the expiry date is close, you will receive a reminder e-mail notification about the tag expiry. If no action is taken, the tag stops triggering post the set validity period.

See ExpirationAlarm for more information.

**Step 7:** Set Provider Attributes

The Provider is a mandatory setting while adding a new tag. You can add any number of Provider attributes using the Key-Value pair and configure the settings using the Settings option. For a particular Provider attribute, you must set the value either from the Data Elements or Transformers. The user can view the provider attributes added from Provider side configuration.

![](https://ingest-lab.netlify.app/images/tagsimages/setproviderattributes.png)

**Step 7.1:** If you do not set the mandatory values, the following message appears:

![](https://ingest-lab.netlify.app/images/tagsimages/attributewarning.png)

**Step 7.2:** After selecting either from the Data Element or Transformer, the value appears in the **Value** column.

![](https://ingest-lab.netlify.app/images/tagsimages/providerattributesvalues.png)

**Step 8:** Set Tag Attributes

To add Attributes, select **Add Attributes** and set the following values.

![](https://ingest-lab.netlify.app/images/tagsimages/addattributes.png)

**Step 8.1: Name**: Set the Attribute name. For example: visitor\_id, user\_id, and so on.

**Step 8.2: Value**: Set the value either for the Data Element or Transformer.

**JSON**: Enter the Attribute name and value, and configure the Settings.

* Mandatory - Denotes the value to be mandatory.
* Ignore If Empty - Ignore the field if empty.
* Hash (SHA256) - denotes the value in the HASH format.

![addanewtagbrowser](https://ingest-lab.netlify.app/images/tagsimages/addattributesjson.png)

**Static**: Denotes the static Value that is known.

**Step 8.3: Attribute Settings**

Enter the **Attribute Settings**.

**Step 8.4: Tool-tip!** Select the **Mandatory** check box to display the **Fatal** check box.

![](https://ingest-lab.netlify.app/images/tagsimages/attributesettings.png)

**Step 8.5:** Set the Data Type Conversion using the following options.

| Data Type Conversion     | Description                                                                               |
| ------------------------ | ----------------------------------------------------------------------------------------- |
| No Conversion            | Indicates that there is no conversion required for the data type.                         |
| Convert to Boolean       | Converts the input data to Boolean.                                                       |
| Convert to Number        | Converts the input data to Number.                                                        |
| Convert to Array         | Converts the input data to Array.                                                         |
| Convert to Object Spread | Converts the JSON attributes under a parent level attribute to the root level attributes. |

**Step 8.6:** Select one of the following Transformer types and click **Confirm**.

| Transformer Type | Description                                     |
| ---------------- | ----------------------------------------------- |
| URL encode       | Converts the URL in the encrypted format.       |
| HASH (SHA256)    | The value is converted to HASH (SHA256) format. |
| Ignore if empty  | May be ignored if the value is empty.           |

**Step 8.7:** Select the **Ignore Redaction** checkbox to display the data elements. Redaction is a setting for each data element, which allows the server-side processing to apply the redaction strategy - like anonymize for email.

**Step Result:** The Provider Attribute is created.

To delete the Provider Attribute, select the **Delete** icon at the right-hand corner of the screen.

**Step 9:** Denote the **Script**.

The Script denotes the code script if available for the tag. Select the **No Script** check box if the script is unavailable.

![addanewtagbrowser](https://ingest-lab.netlify.app/images/tagsimages/script.png)

{% embed url="<https://files.gitbook.com/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FaDMDmegqZUJFhJhF4JQG%2Fuploads%2Fvc4qKJhjUX7u6Qu41ALT%2FAdd%20a%20New%20Tag%20(Browser).mp4?alt=media&token=062b6e54-0e38-43ea-881b-5acf5de633f1>" %}
