WebView Tracking Tag Web

In order to enable WebView tracking, two steps are required:

1. Call the injection API on the native side, in order to inject the Contentsquare JavaScript Bridge into the WebViews and thus allow the Tracking Tag and the SDK to connect. For more information on this step, refer to 📚 iOS SDK WebView tracking and 📚 Android SDK WebView tracking.
2. Inject the Contentsquare Tracking Tag in WebView mode in every the web pages you load in your app’s WebViews. This is the step described on this page.

The Tag in WebView mode is responsible for exposing some APIs and capturing events in the WebView. It then reroutes calls to its API and events tracked to the SDK, through the Contentsquare JavaScript Bridge, which you inject in your webview on the native side.

The Tag needs to be set in WebView mode in order to collect data and pass them to the main SDK that will send them to the dedicated Apps project. To do so, the following command must to be added before loading the Tag (or it will be ignored):

window._uxa.push(['setOption', 'isWebView', true]);

When implementing WebView support, a specific tracker will be created for the WebView context, even if you are already using a Tracker for the Web context. Depending on if you are tracking a page only in WebViews, or also in browsers, you will have two ways to inject the Tracking Tag.

If you detect that the page is loaded in a WebView context, then make sure to set isWebview to true and change the Tag ID to that of the Tracker for WebViews.

<script type="text/javascript">
  (function () {
    window._uxa = window._uxa || [];

    var my_tag_id = YOUR_WEB_TAG_ID;

    if (loadedInAWebview()) {
      window._uxa.push(['setOption', 'isWebView', true]);
      my_tag_id = YOUR_WEBVIEW_TAG_ID;
    }

    var mt = document.createElement("script");
    mt.type = "text/javascript";
    mt.async = true;
    mt.src = "https://t.contentsquare.net/uxa/${my_tag_id}.js";
    document.getElementsByTagName("head")[0].appendChild(mt);
  })();
</script>

For local pages or pages visited exclusively in the WebView context, implement as follows.

<script type="text/javascript">
  (function () {
    window._uxa = window._uxa || [];
    window._uxa.push(["setOption", "isWebView", true]);
    var mt = document.createElement("script");
    mt.type = "text/javascript";
    mt.async = true;
    mt.src = "https://t.contentsquare.net/uxa/YOUR_WEBVIEW_TAG_ID.js";
    document.getElementsByTagName("head")[0].appendChild(mt);
  })();
</script>

In order to set up the Tracking Tag, follow the different implementation guidelines presented in The main Tracking Tag section. Then, finish the implementation by using the APIs supported in WebView mode, as described in the following sections of this documentation.