# Tracking Events and Pages for Web

## Track Events

Once you have integrated the ApxorSDK into your web application, log into the Apxor dashboard and click on **Track Events** under the Nudges section in the left menu. 

* On the events listing page, you can see all the events logged, if any.
* Click on the **Start Tracking** CTA in the top right corner to track a new event.

  <figure><img src="https://300211688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQuYbJ9bg7CFtrBaVp9pB%2Fuploads%2FcxLAXUD519UNhoNN0cLB%2FStartTrackingCTA.png?alt=media&#x26;token=8f915bbe-b182-4d9b-9fa8-e2d4e7c09af5" alt=""><figcaption></figcaption></figure>
* On the pop-up that appears, enter the URL of your integrated web application. Click on **Launch** to open your web application in a new tab. For mWeb events, click on **Generate QR**. Once the QR is displayed on the pop-up, scan using your mobile device and open the link.

  <figure><img src="https://300211688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQuYbJ9bg7CFtrBaVp9pB%2Fuploads%2Fktguei9KavHL29EwZadd%2FLaunchURL_TrackEvents.png?alt=media&#x26;token=82e0d171-7594-4253-896e-46e196a22ee8" alt=""><figcaption></figcaption></figure>
* In the top center of your web application, you'll see an **Apxor Widget** titled **Track Events**. Click on it and then click on **Start Tracking**.

  <figure><img src="https://300211688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQuYbJ9bg7CFtrBaVp9pB%2Fuploads%2FugoZjBH2ELZ3aEtyzDzl%2FStartTrackingWidget_TrackEvents.png?alt=media&#x26;token=40ac4833-f22e-4a9e-8c2b-f462b2b8ecfa" alt=""><figcaption></figcaption></figure>
* Click on **Define Event** in the right panel after clicking Start Tracking.

  <figure><img src="https://300211688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQuYbJ9bg7CFtrBaVp9pB%2Fuploads%2FBXwqv73DFT1Wnscd8Cfs%2FDefineEvent_TrackEvents.png?alt=media&#x26;token=0fcceaca-d6e3-4438-8952-dad50b912d4d" alt=""><figcaption></figcaption></figure>
* After clicking **Define Event**, hover over the UI element for which you want to log the event. The UI element will be highlighted with a Red Border as you go over it.

  <figure><img src="https://300211688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQuYbJ9bg7CFtrBaVp9pB%2Fuploads%2FscdB8VHvbjo6mDIp4qjk%2FHoverUIElement_TrackEvents.png?alt=media&#x26;token=99777ef0-5bf5-4026-8f0a-39a2eec92bc0" alt=""><figcaption></figcaption></figure>
* Click on the **UI element** once you see the Red Border as per your requirement. Press **Esc** if you don't want to select an UI element and exit from the hovering mode.
* Enter the details of the event in the right panel.

  <figure><img src="https://300211688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQuYbJ9bg7CFtrBaVp9pB%2Fuploads%2FXsDecoeCwFgwxYNGd9cG%2FEventDetails_TrackEvents.png?alt=media&#x26;token=dc2929ba-2f74-40a4-8c3c-81bf00600722" alt=""><figcaption></figcaption></figure>

  * **Name** (Mandatory): The unique name you want to assign for this event.
    * e.g. ContactUs\_Clicked
  * **Description** (Optional): The description for this event
    * e.g. This event will be logged when the user clicks on the Contact US CTA
  * **Type**: Select when to log this event, **Click, Double Click** or **Right Click**. Select whether the event should be an App Event or a Client Event.
  * **Element Identifier**: The element identifier will be auto-populated.
  * **Pages**:
    * **Only on this Page**: Log this event for the CTA on this page only
    * **For all the Pages**: Log this event for this CTA on all the pages where it is present.
    * **On Pages that match**: Enter the standard URL for the required pages and replace the dynamic part with a star(\*) mark.

Click on **Stop Tracking** in the widget to turn off the widget.

## Track Pages

Once you have integrated the ApxorSDK into your web application, log into the Apxor dashboard and click on **Track Pages** under the Nudges section in the left menu.&#x20;

* On the Page Listing page, you can see all the pages logged, if any.
* Click on the **Start Tracking** CTA in the top right corner to track a new page.

  <figure><img src="https://300211688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQuYbJ9bg7CFtrBaVp9pB%2Fuploads%2FlJTqXuQYviAbmuRonQhn%2FTrackPages_StartTrackingCTA.png?alt=media&#x26;token=583b161f-c38b-4318-a146-f1be6cceae18" alt=""><figcaption></figcaption></figure>
* On the pop-up that appears, enter the URL of your integrated web application. Click on **Launch** to open your web application in a new tab. For mWeb pages, click on **Generate QR**. Once the QR is displayed on the pop-up, scan using your mobile device and open the link.

  <figure><img src="https://300211688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQuYbJ9bg7CFtrBaVp9pB%2Fuploads%2Fktguei9KavHL29EwZadd%2FLaunchURL_TrackEvents.png?alt=media&#x26;token=82e0d171-7594-4253-896e-46e196a22ee8" alt=""><figcaption></figcaption></figure>
* In the top center of your web application, you'll see an **Apxor Widget** titled **Track Pages**. Click on it and then click on **Start Tracking**.

  <figure><img src="https://300211688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQuYbJ9bg7CFtrBaVp9pB%2Fuploads%2FX7D8RFKvrzIwiH74BXNi%2FTrackPages_StartTrackingWidget.png?alt=media&#x26;token=0c12eb9f-d90e-4b14-a988-e8d344eca0c9" alt=""><figcaption></figcaption></figure>
* Click on **Define Page** in the right panel after clicking Start Tracking.

  <figure><img src="https://300211688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQuYbJ9bg7CFtrBaVp9pB%2Fuploads%2FHZYlqA25iUWgKFPoh69i%2FTrackPages_DefinePage.png?alt=media&#x26;token=38dbc416-4134-4da3-9fcd-30ef5454bb01" alt=""><figcaption></figcaption></figure>
* After clicking **Define Page**, Enter the details of the event in the right panel.

  <figure><img src="https://300211688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQuYbJ9bg7CFtrBaVp9pB%2Fuploads%2FjZC4bKBAasG6dmxBzQTu%2FTrackPages_PageDetails.png?alt=media&#x26;token=eb59643e-e8f6-444d-8f64-bbf38338b190" alt=""><figcaption></figcaption></figure>

  * **Name** (Mandatory): The unique name you want to assign for this page.
    * e.g. HomePage\_Launched
  * **Description** (Optional): The description for this page
    * e.g. This page launch event will be logged when the lands on home page
  * **Type**: Select whether the event should be an App Event or a Client Event.
  * **URL**:
    * **Only on this Page**: Log this event for this page only
    * **For all the Pages**: Log this event for all the pages
    * **On Pages that match**: Enter the standard URL for the required pages and replace the dynamic part with a star(\*) mark.

Click on **Stop Tracking** in the widget to turn off the widget.


---

# 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://guides.apxor.com/getting-started-with-apxor/sdk/web-url-based/tracking-events-and-pages-for-web.md?ask=<question>
```

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.