# Digia WebEngage Integration

***

The Digia WebEngage plugin intercepts **WebEngage in-app** campaign payloads and pipes them directly into Digia's rendering engine. When a campaign triggers, the plugin maps the incoming payload to your custom UI designs built in Digia Studio, instantly rendering a 100% native experience on the device—no WebViews required.

This guide walks you through the end-to-end integration process—covering SDK installation, plugin initialization, and how to map your dashboard campaigns to Digia's native components.

## 1. Prerequisites

Before integrating, ensure you have:

* **Digia Access Key**: Log in to [Digia Studio](https://app.digia.tech), open your project, and copy your key from **Settings → App Settings**.
* **Active WebEngage Account**: Ensure you have an active WebEngage workspace with access to your License Code.
* **WebEngage SDK**: Installed and initialized (see [Flutter](https://docs.webengage.com/docs/flutter-getting-started), [Android](https://docs.webengage.com/docs/android-integration-guide), [iOS](https://docs.webengage.com/docs/ios-integration-guide), or [React Native](https://docs.webengage.com/docs/react-native-getting-started) Quick Start).

### Minimum Supported Versions

| Platform         | Environment                                                       | Minimum Dependencies                                                                                                                               |
| ---------------- | ----------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Flutter**      | <p>Dart <code>>=3.3.0</code><br>Flutter <code>>=3.20.0</code></p> | <p><code>digia\_engage: ^1.1.2</code><br><code>digia\_webengage\_plugin: ^1.0.0</code><br><code>webengage\_flutter: installed</code></p>           |
| **Android**      | `minSdk 24`                                                       | <p><code>tech.digia:engage:2.0.0</code><br><code>tech.digia:engage-webengage:1.1.0</code><br><code>com.webengage:android-sdk: installed</code></p> |
| **iOS (Swift)**  | iOS `16+`                                                         | <p><code>DigiaEngage: 2.0.0</code><br><code>DigiaWebEngage: 1.0.0</code></p>                                                                       |
| **React Native** | React Native `0.73+`                                              | <p><code>@digia-engage/core: 2.0.1</code><br><code>@digia-engage/webengage: ^1.1.0</code><br><code>webengage-react-native: installed</code></p>    |

***

## 2. Install

> **Note:** We assume the core WebEngage SDK is already installed and initialized as part of your standard app setup (see [Prerequisites](#1-prerequisites)). The snippets below only cover adding the Digia plugin packages.

{% tabs %}
{% tab title="Flutter" %}
Add the Digia packages using the `flutter pub add` command:

```bash
flutter pub add digia_engage digia_webengage_plugin
```

{% endtab %}

{% tab title="Android" %}
Add dependencies in app `build.gradle.kts`:

```kotlin
dependencies {
  implementation("tech.digia:engage:2.0.0")
  implementation("tech.digia:engage-webengage:1.1.0")
}
```

Sync the project (Gradle sync).
{% endtab %}

{% tab title="iOS (Swift)" %}
Add packages using **Xcode → File → Add Package Dependencies** (or in `Package.swift`):

```swift
dependencies: [
    .package(url: "https://github.com/Digia-Technology-Private-Limited/digia_engage_iOS.git", exact: "2.0.0"),
    .package(url: "https://github.com/Digia-Technology-Private-Limited/digia_webengage_iOS.git", exact: "1.0.0"),
],
```

Then add these products to your app target dependencies:

* `DigiaEngage`
* `DigiaWebEngage`
  {% endtab %}

{% tab title="React Native" %}
Install the Digia packages using npm or yarn:

```bash
npm install @digia-engage/core@2.0.1 @digia-engage/webengage@1.1.0
```

#### iOS — Additional Native Setup (CocoaPods)

Add the Digia iOS pod to your `Podfile`:

```ruby
pod 'DigiaEngage',
  :git => 'https://github.com/Digia-Technology-Private-Limited/digia_engage_iOS.git',
  :tag => '1.0.0'
```

Then run:

```bash
cd ios && pod install
```

{% endtab %}
{% endtabs %}

***

## 3. Initialize Digia with WebEngage

Initialize Digia **after** the WebEngage SDK and **before** plugin registration.

{% tabs %}
{% tab title="Flutter" %}
In your `main.dart`, initialize Digia and register the WebEngage plugin:

```dart
import 'package:digia_webengage_plugin/digia_webengage_plugin.dart';
import 'package:digia_engage/digia_engage.dart';
import 'package:flutter/material.dart';

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();

  // 1. Initialize Digia before registering any CEP plugin.
  await Digia.initialize(
    DigiaConfig(apiKey: 'YOUR_ACCESS_KEY'),
  );

  // 2. Register the Digia WebEngage plugin.
  Digia.register(DigiaWebEngagePlugin());

  runApp(const MyApp());
}
```

#### iOS — Additional Setup (`AppDelegate.swift`)

On Flutter iOS, add the following to your `AppDelegate.swift` to wire the WebEngage push notification delegate through the Digia bridge:

```swift
import Flutter
import UIKit
import WebEngage
import webengage_flutter
import digia_engage_webengage
import UserNotifications

@main
@objc class AppDelegate: FlutterAppDelegate {

  var bridge: WebEngagePlugin? = nil

  override func application(
    _ application: UIApplication,
    didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
  ) -> Bool {
    GeneratedPluginRegistrant.register(with: self)
    UNUserNotificationCenter.current().delegate = self
    application.registerForRemoteNotifications()

    // Create the Flutter-WebEngage bridge.
    bridge = WebEngagePlugin()

    // Wire push notification delegates.
    WebEngage.sharedInstance().pushNotificationDelegate = self.bridge
    WebEngage.sharedInstance().application(
      application,
      didFinishLaunchingWithOptions: launchOptions,
      notificationDelegate: DigiaSuppressPlugin.shared
    )
    return super.application(application, didFinishLaunchingWithOptions: launchOptions)
  }
}
```

{% endtab %}

{% tab title="Android" %}
In your `Application` class, configure WebEngage and then initialize Digia:

```kotlin
import android.app.Application
import com.digia.engage.Digia
import com.digia.engage.DigiaConfig
import com.digia.engage.DigiaLogLevel
import com.webengage.sdk.android.WebEngageConfig
import com.webengage.sdk.android.WebEngageActivityLifeCycleCallbacks
import com.webengage.sdk.android.WebEngagePlugin

class MyApplication : Application() {
    override fun onCreate() {
        super.onCreate()

        // 1. Initialize the WebEngage SDK.
        val webEngageConfig = WebEngageConfig.Builder()
            .setWebEngageKey("YOUR_WEB_ENGAGE_KEY")
            .setDebugMode(true)
            .build()
        registerActivityLifecycleCallbacks(
            WebEngageActivityLifeCycleCallbacks(this, webEngageConfig)
        )

        // 2. Initialize Digia before registering any CEP plugin.
        Digia.initialize(
            this,
            DigiaConfig(
                apiKey = "YOUR_ACCESS_KEY",
                logLevel = DigiaLogLevel.VERBOSE
            )
        )

        // 3. Register the Digia WebEngage plugin.
        Digia.register(WebEngagePlugin())
    }
}
```

{% endtab %}

{% tab title="iOS (Swift)" %}
Register `AppDelegate` via `@UIApplicationDelegateAdaptor` so the WebEngage SDK is initialized before any scene is created.

**`AppDelegate.swift`**

```swift
import UIKit
@preconcurrency import WebEngage
import DigiaEngageWebEngage

@objc final class AppDelegate: NSObject, UIApplicationDelegate {

    func application(
        _ application: UIApplication,
        didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]? = nil
    ) -> Bool {
        WebEngage.sharedInstance().application(
            application,
            didFinishLaunchingWithOptions: launchOptions,
            notificationDelegate: DigiaWebEngagePlugin.notificationDelegate
        )
        return true
    }
}
```

**App entry point (SwiftUI)**

```swift
import SwiftUI
import DigiaEngage
import DigiaEngageWebEngage

@main
struct MyApp: App {
    @UIApplicationDelegateAdaptor(AppDelegate.self) var appDelegate

    init() {
        Task {
            do {
                try? await Digia.initialize(
                    DigiaConfig(
                        apiKey: "YOUR_ACCESS_KEY",
                        logLevel: .verbose
                    )
                )
                Digia.register(DigiaWebEngagePlugin())
            }
        }
    }

    var body: some Scene {
        WindowGroup {
            RootView()
        }
    }
}
```

{% endtab %}

{% tab title="React Native" %}
In your root component (e.g. `App.tsx`), initialize Digia and register the WebEngage plugin:

```tsx
import { useEffect } from 'react';
import { Digia } from '@digia-engage/core';
import { DigiaWebEngagePlugin } from '@digia-engage/webengage';

export function RootApp() {
  useEffect(() => {
    (async () => {
      // 1. Initialize Digia before registering any CEP plugin.
      await Digia.initialize({ apiKey: 'YOUR_ACCESS_KEY' });

      // 2. Register the Digia WebEngage plugin.
      //    The overlay host attaches automatically — no <DigiaHostView> needed.
      Digia.register(
        new DigiaWebEngagePlugin(),
      );
    })().catch(console.error);
  }, []);

  return <AppNavigator />;
}
```

#### iOS — Additional Native Setup (`AppDelegate.swift`)

On React Native iOS, add the following to your `AppDelegate.swift` to wire the WebEngage in-app notification delegate through the Digia bridge:

```swift
import WebEngage
import DigiaWebEngage

// Inside application(_:didFinishLaunchingWithOptions:):
WebEngage.sharedInstance().application(
    application,
    didFinishLaunchingWithOptions: launchOptions,
    notificationDelegate: WEDigiaSuppressProxy.shared()
)
```

{% endtab %}
{% endtabs %}

***

## 4. How Digia Maps to WebEngage Campaigns

| Experience Type | Digia Component | WebEngage Campaign Type | Description                                                                                               |
| --------------- | --------------- | ----------------------- | --------------------------------------------------------------------------------------------------------- |
| **Nudge**       | `DigiaHost`     | In-App Notification     | Receives the campaign payload and renders overlay experiences (bottom sheets, dialogs) above app content. |
| **Inline**      | `DigiaSlot`     | In-App Notification     | Receives placement key/value pairs and renders inline content (banners, cards) within the app layout.     |

```mermaid
flowchart TD
    Trigger[WebEngage Campaign Trigger]
    SDK[WebEngage SDK]
    Plugin[Digia WebEngage Plugin]
    Runtime[digia_engage runtime]
    UI[Campaign UI<br>native widgets from Digia Studio]

    Trigger --> SDK
    SDK -- "In-app notification callback" --> Plugin
    Plugin -- "maps payload -> InAppPayload" --> Runtime
    Runtime -- "SHOW_BOTTOM_SHEET / SHOW_DIALOG<br>-> DigiaHost renders overlay" --> UI
    Runtime -- "SHOW_INLINE<br>-> DigiaSlot renders inline" --> UI
```

***

## 5. Setting Up Nudges

### In-App Campaigns: What They Are and Why They're Needed

WebEngage delivers in-app notification payloads to your app code when a campaign triggers. The Digia WebEngage plugin registers an in-app notification listener that intercepts this payload, parses the `<digia>` custom HTML tag, maps it to a `SHOW_BOTTOM_SHEET` or `SHOW_DIALOG` command, and delegates rendering to Digia's runtime. **Without configuring the WebEngage campaign as Custom HTML with a `<digia>` tag, the experience will not render.**

### In-App Campaigns: Set Up in Dashboard

No device-side sync is required — the plugin responds automatically once registered. Configure your campaign in the WebEngage dashboard:

1. Log in to the **WebEngage dashboard** and go to **Campaigns → In-App Notifications**.
2. Click **Create** and give the campaign a name.
3. In the **Content** step, choose **Custom HTML** as the template type.
4. Configure the trigger event, audience, and schedule as required.
5. In the **Custom HTML** editor, enter the Digia `<digia>` tag (see [Trigger a Nudge from WebEngage](#trigger-a-nudge-from-webengage) below).

### Add the Nudge Container

Wrap your app root so overlay campaigns can render above app content.

{% tabs %}
{% tab title="Flutter" %}

```dart
import 'package:digia_engage/digia_engage.dart';
import 'package:flutter/material.dart';

MaterialApp(
  navigatorKey: DigiaHost.navigatorKey,
  navigatorObservers: [DigiaNavigatorObserver()],
  builder: (context, child) => DigiaHost(
    child: child!,
  ),
  home: const HomeScreen(),
)
```

{% endtab %}

{% tab title="Android (Jetpack Compose)" %}

```kotlin
import com.digia.engage.DigiaHost

DigiaHost {
    AppNavHost()
}
```

{% endtab %}

{% tab title="Android (XML Layout)" %}
For XML-based Android layouts, use `DigiaHostView` as a full-screen overlay in your root layout. This is the View-system wrapper around `DigiaHost`, so you do not need Compose code in your `Activity` or `Fragment`.

```xml
<FrameLayout
    android:id="@+id/root_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- Your normal views / fragments -->

    <!-- Must be the last child so it draws on top -->
    <com.digia.engage.DigiaHostView
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</FrameLayout>
```

Or programmatically in your Activity:

```kotlin
import com.digia.engage.DigiaHostView

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)

    val rootLayout = findViewById<FrameLayout>(R.id.root_layout)
    val digiaHost = DigiaHostView(this)
    rootLayout.addView(
        digiaHost,
        FrameLayout.LayoutParams(
            FrameLayout.LayoutParams.MATCH_PARENT,
            FrameLayout.LayoutParams.MATCH_PARENT,
        )
    )
}
```

{% endtab %}

{% tab title="iOS (Swift)" %}

```swift
import SwiftUI
import DigiaEngage

struct RootContainerView: View {
    var body: some View {
        DigiaHost {
            AppRootView()
        }
    }
}
```

{% endtab %}

{% tab title="React Native" %}
No additional host container is required. The Digia overlay host attaches automatically to the Activity when `Digia.register(new DigiaWebEngagePlugin())` is called during initialization — no `<DigiaHostView>` needed in your component tree.
{% endtab %}
{% endtabs %}

### Trigger a Nudge from WebEngage

In the WebEngage campaign **Custom HTML** editor, enter a `<digia>` tag with the appropriate attributes:

```html
<digia
  command="SHOW_BOTTOM_SHEET"
  view-id="promo_offer_sheet"
  args='{
    "coupon": "SAVE20",
    "title": "Special Offer",
    "cta": { "text": "Claim Now" }
  }'
></digia>
```

| Attribute | Required | Example value           | Description                                                                             |
| --------- | -------- | ----------------------- | --------------------------------------------------------------------------------------- |
| `command` | Yes      | `SHOW_BOTTOM_SHEET`     | `SHOW_BOTTOM_SHEET` or `SHOW_DIALOG`.                                                   |
| `view-id` | Yes      | `promo_offer_sheet`     | Digia page slug. See [Finding Slugs](/studio-workspace/builder-tool/finding-slugs.md).  |
| `args`    | No       | `'{"coupon":"SAVE20"}'` | JSON object passed as a single-quoted string. Available in Digia page logic at runtime. |

> **`args` format:** Write the value as a single-quoted JSON object directly in the HTML attribute — e.g., `args='{"coupon":"SAVE20"}'`. The plugin parses it automatically.

***

## 6. Setting Up Inline Widgets

`DigiaSlot` is a composable/widget that renders Digia-powered content inline within your screen layout. Each slot is identified by a `placementKey` — a string that must match the `placement` attribute in the WebEngage campaign `<digia>` tag. When an in-app campaign with `type="inline"` is active, Digia resolves the component to display for each placement key and renders it inside the slot. If no campaign is active for a slot, it collapses to zero height.

### Add an Inline Slot

Place `DigiaSlot` where you want in-app inline content rendered.

{% tabs %}
{% tab title="Flutter" %}

```dart
import 'package:digia_engage/digia_engage.dart';
import 'package:flutter/material.dart';

class HomeScreen extends StatelessWidget {
  const HomeScreen({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Home')),
      body: ListView(
        children: const [
          // Renders a Digia-powered banner campaign at the top of the feed.
          // placementKey must match the placementId in the WebEngage campaign payload.
          DigiaSlot('home_hero_banner'),
          SizedBox(height: 16),
          ProductCarousel(),
          SizedBox(height: 16),
          // Renders an inline offer card between content sections.
          DigiaSlot('product_offers'),
          SizedBox(height: 16),
          RecommendationList(),
        ],
      ),
    );
  }
}
```

{% endtab %}

{% tab title="Android (Jetpack Compose)" %}

```kotlin
import com.digia.engage.DigiaSlot

// placementKey must match placementId in WebEngage campaign payload
Column {
    DigiaSlot(placementKey = "home_hero_banner")
    DigiaSlot(placementKey = "product_offers")
}
```

{% endtab %}

{% tab title="Android (XML Layout)" %}
For View/XML layouts, use `DigiaSlotView`. It wraps the Compose `DigiaSlot` API and reads `app:placementKey` from XML.

```xml
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <com.digia.engage.DigiaSlotView
        android:id="@+id/homeHeroBanner"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:placementKey="home_hero_banner" />

    <com.digia.engage.DigiaSlotView
        android:id="@+id/productOffers"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:placementKey="product_offers" />

</LinearLayout>
```

Or set the placement programmatically after inflation:

```kotlin
import com.digia.engage.DigiaSlotView

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_home)

    findViewById<DigiaSlotView>(R.id.homeHeroBanner).placementKey = "home_hero_banner"
    findViewById<DigiaSlotView>(R.id.productOffers).placementKey = "product_offers"
}
```

`DigiaSlotView` requires a `DigiaHostView` (or a Compose `DigiaHost`) in the same window so the Digia rendering engine is already mounted before the slot renders.
{% endtab %}

{% tab title="iOS (Swift)" %}

```swift
import SwiftUI
import DigiaEngage

struct HomeScreen: View {
    var body: some View {
        ScrollView {
            VStack(spacing: 16) {
                DigiaSlot("home_hero_banner")
                ProductCarousel()
                DigiaSlot("product_offers")
                RecommendationList()
            }
            .padding()
        }
    }
}
```

{% endtab %}

{% tab title="React Native" %}

```tsx
import React from 'react';
import { ScrollView } from 'react-native';
import { DigiaSlotView } from '@digia-engage/webengage';

export function HomeScreen() {
  return (
    <ScrollView>
      {/* placementKey must match the placement in the WebEngage campaign payload */}
      <DigiaSlotView placementKey='home_hero_banner' />

      <ProductCarousel />

      <DigiaSlotView placementKey='product_offers' />

      <RecommendationList />
    </ScrollView>
  );
}
```

{% endtab %}
{% endtabs %}

### Serve Inline Content from WebEngage

In the WebEngage campaign **Custom HTML** editor, enter a `<digia>` tag with `type="inline"` and the matching placement key:

```html
<digia
  type="inline"
  placement="home_hero_banner"
  view-id="home_hero_banner-v2N8"
  args='{
    "title": "Special Offer",
    "message": "Get 20% off",
    "cta": { "text": "Shop Now" }
  }'
></digia>
```

| Attribute   | Required | Description                                                                                                         |
| ----------- | -------- | ------------------------------------------------------------------------------------------------------------------- |
| `type`      | Yes      | Must be `inline` for inline slots.                                                                                  |
| `placement` | Yes      | Must match the `DigiaSlot` / `DigiaSlotView` placement key in your app code (case-sensitive).                       |
| `view-id`   | Yes      | Digia component or page slug. See [Finding Slugs](/studio-workspace/builder-tool/finding-slugs.md) for slug lookup. |
| `args`      | No       | JSON object passed as a single-quoted string. Available in Digia page logic at runtime.                             |

***

## 7. Test Your Integration

Follow these steps to verify end-to-end functionality before releasing:

1. **Verify initialization order** — `Digia.initialize` completes, then `Digia.register(DigiaWebEngagePlugin(...))` / `Digia.register(WebEngagePlugin())`, before `runApp` / first activity.
2. **Verify host placement** — `DigiaHost` must be in `MaterialApp.builder` (Flutter), the root Composable (Android Compose), or the root SwiftUI wrapper (iOS). For Android View/XML apps, `DigiaHostView` should be mounted once as the last full-screen child of the root `ViewGroup`. For React Native, the host overlay attaches automatically on `Digia.register(...)` — no manual host placement needed.
3. **Verify Flutter iOS AppDelegate** — confirm `DigiaSuppressPlugin.shared` is passed as the `notificationDelegate` in `AppDelegate.swift`.
4. **Create a test campaign** — create an in-app campaign with a known `viewId` and trigger it immediately for your test device.
5. **Verify inline slots** — place `DigiaSlot` / `DigiaSlotView` on a visible screen, create an in-app campaign with `SHOW_INLINE` and a matching `placementKey`, and confirm content renders.
6. **Verify screen tracking** — navigate between screens and confirm that screen-triggered campaigns fire on the correct screen (use `DigiaNavigatorObserver` on Flutter, `Digia.setCurrentScreen(...)` or `digiaScreen("...")` in Android View/XML apps, route/screen change hooks calling `Digia.setCurrentScreen(...)` on Swift, and navigation listeners calling `Digia.setCurrentScreen(...)` on React Native).

### Health Check

Use `plugin.healthCheck()` to verify plugin wiring. The report always includes `isHealthy` plus diagnostic metadata.

{% tabs %}
{% tab title="Flutter" %}

```dart
final plugin = DigiaWebEngagePlugin();
Digia.register(plugin);

// Later, for testing:
final report = plugin.healthCheck();
if (!report.isHealthy) {
  debugPrint('Plugin issue: ${report.issue}');
  debugPrint('Resolution: ${report.resolution}');
}
```

{% endtab %}

{% tab title="Android" %}

```kotlin
val plugin = WebEngagePlugin()
Digia.register(plugin)

// Later, for testing:
val report = plugin.healthCheck()
if (!report.isHealthy) {
  Log.w("Digia", "Plugin issue: ${report.issue} - ${report.resolution}")
}
```

{% endtab %}

{% tab title="iOS (Swift)" %}

```swift
let plugin = DigiaWebEngagePlugin()
Digia.register(plugin)

// Later, for testing:
let report = plugin.healthCheck()
if !report.isHealthy {
    print("Plugin issue: \(report.issue)")
    print("Resolution: \(report.resolution)")
}
```

{% endtab %}

{% tab title="React Native" %}

```tsx
import { Digia } from '@digia-engage/core';
import { DigiaWebEngagePlugin } from '@digia-engage/webengage';

const plugin = new DigiaWebEngagePlugin();
Digia.register(plugin);

// Later, for testing:
const report = plugin.healthCheck();
if (!report.isHealthy) {
  console.warn('Plugin health check failed', report.metadata);
}
```

{% endtab %}
{% endtabs %}

***

## 8. Troubleshooting

### Campaign not rendering

* Confirm initialization order — `Digia.initialize(...)` then `Digia.register(DigiaWebEngagePlugin(...))` / `Digia.register(WebEngagePlugin())`.
* Ensure the WebEngage campaign uses **Custom HTML** as the template type and the `<digia>` tag is correctly placed in the HTML editor.
* **Flutter iOS**: Confirm `DigiaSuppressPlugin.shared` is passed as the `notificationDelegate` in `AppDelegate.swift` and `import digia_engage_webengage` is present.
* Ensure `DigiaHost` is mounted in `MaterialApp.builder` (Flutter), the root Composable (Android Compose), or `DigiaHostView` is mounted as the last full-screen child in your Android View/XML root layout.
* Check `viewId` exactly matches the published Digia page slug (case-sensitive). See [Finding Slugs](/studio-workspace/builder-tool/finding-slugs.md).
* Verify campaign eligibility and trigger conditions in the WebEngage dashboard.

### Inline content not showing

* Confirm the `<digia>` tag includes `type="inline"` and a `placement` attribute.
* Ensure `placement` in the `<digia>` tag matches `DigiaSlot('placement_key')` or `DigiaSlotView app:placementKey` exactly (case-sensitive).
* Verify the slot exists on the currently visible screen.
* **Android XML**: Ensure a `DigiaHostView` is mounted in the same window before `DigiaSlotView` renders.
* **React Native**: Confirm `DigiaSlotView` is imported from `@digia-engage/webengage` and the `placementKey` exactly matches the `placement` in the campaign tag.

### Screen-triggered campaign not firing

* Add `DigiaNavigatorObserver()` to `navigatorObservers` (Flutter).
* Call `Digia.setCurrentScreen(...)` on navigation changes (Android Compose: `navController.addOnDestinationChangedListener`).
* **Android XML / Views**: Call `digiaScreen("screen_name")` from `Activity.onResume()` or `Fragment.onResume()`.
* For unnamed routes, call `Digia.setCurrentScreen('screen_name')` manually.
* **iOS (Swift)**: On tab/route changes, call `Digia.setCurrentScreen("screen_name")` from your navigation layer.
* **React Native**: Wire navigation change events (React Navigation / Expo Router) to `Digia.setCurrentScreen(routeName)`.

### WebEngage SDK not initialized (Android)

* Ensure `registerActivityLifecycleCallbacks(WebEngageActivityLifeCycleCallbacks(this, webEngageConfig))` is called in `Application.onCreate()` before `Digia.register(...)`.
* Verify the WebEngage license key is correctly set in `WebEngageConfig.Builder().setWebEngageKey(...)` and matches your WebEngage dashboard.

***

## Official WebEngage References

* [Flutter SDK](https://docs.webengage.com/docs/flutter-getting-started)
* [Android Integration Guide](https://docs.webengage.com/docs/android-integration-guide)
* [iOS Integration Guide](https://docs.webengage.com/docs/ios-integration-guide)
* [React Native Getting Started](https://docs.webengage.com/docs/react-native-getting-started)


---

# 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.digia.tech/engagement-sdk/digia-engage/webengage-integration.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.