# Web

The Evntaly Web SDK is a lightweight JavaScript library designed to simplify event tracking, user identification, and analytics on web applications.

{% embed url="<https://github.com/Evntaly/evntaly-web>" fullWidth="false" %}

## Installation and Initialization

The Evntaly Web SDK can be added directly to your web application using a CDN.

```html
<script async src="https://cdn.evntaly.com/evntaly-web-v1.0.7.js"></script>
<script>
   window.evsq = window.evsq || [];
   window.evntaly = window.evntaly || ((...args) => window.evsq.push(args));
   window.evntaly("init", "YOUR_API_TOKEN" , "YOUR_PROJECT_NAME");
</script>
```

## Automatic Event Tracking

Automatically track events by adding `data-event` attributes to HTML elements.

```html
<button
  data-event="Upgraded Plan"
  data-user-id="user-123"
  data-channel="billing"
  data-icon="💰"
  data-tag-plan="Pro"
  data-tag-period="Monthly"
  data-tag-price="9.99"
  data-payload-country="Egypt">
    Upgrade to Pro
</button>
```

## Manual Event Tracking

For custom event tracking, use the **track** method.

```html
<script>
window.evntaly('track', {
    title: "Manual Event",
    description: "Manually triggered event",
    user: { id: "user-123" },
    feature: "manual-feature",
    type: "Button Click",
    tags: { source: "dashboard" },
    message: "Event successfully tracked.",
    notify: true,
    icon: "🔥",
    sessionID: "session-12345",
    topic: "@Dashboard"
});
</script>
```

## User Identification

Identify a user to associate events with a specific profile.

```html
<script>
window.evntaly('identifyUser', {
    id: "user-123",
    email: "user@example.com",
    full_name: "John Doe",
    organization: "ExampleCorp",
    data: {
        role: "admin",
        plan: "Pro",
        location: "USA",
        timezone: "America/New_York"
    }
});
</script>
```

## Enabling and Disabling Tracking

Control event tracking globally.

```html
<script>
window.evntaly('disableTracking');  // Disables tracking
window.evntaly('enableTracking');   // Enables tracking
</script>
```

## Methods&#x20;

| Method            | Description                               | Example Usage                              | Available Since |
| ----------------- | ----------------------------------------- | ------------------------------------------ | --------------- |
| `init`            | Initializes the SDK with API credentials. | `window.evntalySet(token, projectName)`    | v1.0.0          |
| `track`           | Manually tracks a custom event.           | `window.evntaly('track', eventData)`       | v1.0.0          |
| `identifyUser`    | Identifies a user for analytics.          | `window.evntaly('identifyUser', userData)` | v1.0.0          |
| `disableTracking` | Disables all event tracking.              | `window.evntaly('disableTracking')`        | v1.0.0          |
| `enableTracking`  | Enables all event tracking.               | `window.evntaly('enableTracking')`         | v1.0.0          |
| `trackPageView`   | Automatically tracks page views.          | `window.evntaly('trackPageView')`          | Soon            |

## Best Practices

* **Initialize early:** Always initialize the SDK as soon as possible.
* **Avoid sensitive data:** Do not pass sensitive personal data directly to the SDK.
* **Test thoroughly:** Ensure the event tracking aligns with your analytics goals.

## Troubleshooting

* **Events not sending:** Check if the SDK is correctly initialized with valid API tokens.
* **Network errors:** Make sure the network allows outbound requests to `https://evntaly.com`.

***

## Support

For more help, contact support at **<support@evntaly.com>**.