# Add a New Transformer (Browser)
## Introduction
This document explains step by step how to add Transformers to the browser side. All the information required for client-side or browser-side configuration is provided.
### Procedure
To add a new Transformer in Tag Manager, perform the following steps:
**Step 1:** From the left navigation panel, select **Transformers**.
**Step 2:** Click the **Add Transformer** drop-down and select **For Browser**.
**Step 3:** Under the **Info** section, enter the function name in the **Function Name field**.
**Step 4:** Enter the Description in the **Description** field.
**Step 5:** In the ***Function Arguments*** section, click ***Add Agreement***.
**Step 5.1:** In the ***Name*** field, enter the appropriate name.
**Step 5.2:** Under ***Value***, click ***Select Data Element***.
**Step 5.3:** The *Select Data Element* panel opens on the right side. Two tabs are available — *User-defined* and *Default*. You can select a data element from these tabs or use the search bar to find one.
**Note:** Click the selected argument data element value. The data element details will appear in the right panel.
Note: To clear the selected data element value, click the small **X** icon next to it.
**Step 5.4:** Select the checkboxes for ***Mandatory*** and *URL Encode*, if required.
**Note:** To delete the Argument, click the **Delete** icon on the right-hand corner of the screen.
**Step 6:** To access the Argument, enter the code in the Code section. You can also Test the function using the Test Function tab on the right-hand corner of the screen.
**Step 7:** Click the **Full Screen** icon  to expand the code and view it in full screen mode.
**Step 8:** Click **Test Function**. The **Test Function** panel opens.
**Step 9:** Click the **Select** dropdown and choose an input type:
* **Number** — Use this option if your function requires a numeric input.
* **String** — Use this option if your function requires text input.
* **Boolean** — Use this option if your function requires a true/false value.
* **JSON** — Use this option if your function requires structured data in JSON format.
**Step 10:** Enter the **Argument value** that corresponds to the selected input type.
**Step 11:** Navigate to the **Output** tab to view the result of the executed function.
**Step 12:** Click **Save** to save the Transformers details.
{% embed url="" %}
---
# Agent Instructions: 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:
```
GET https://docs.ingestlabs.com/tag-manager/transformers/add-a-new-transformer-browser.md?ask=
```
The question should be specific, self-contained, and written in natural language.
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.