With HUAWEI Dynamic Tag Manager (DTM), you can deploy and update your tag configuration easily and securely on a web-based UI, and realize data-driven operations.

What You Will Create

In this codelab, you will reference dynamic tags created on HUAWEI DTM in the demo project and experience how to:

What You Will Learn

In this codelab, you will learn how to:

Hardware Requirements

A (desktop or laptop) computer that can connect to the Internet

Software Requirements

Required Knowledge

Before configuration, you must complete the following preparations:

Implementing the Demo App

Enabling Required Services

  1. Sign in to AppGallery Connect and click My projects.
  2. Find your app project, and click the desired app name.
  3. Go to Grow > Dynamic Tag Manager. On the page displayed, click Enable HUAWEI Analytics to enable the HUAWEI Analytics service.
  4. If you have enabled the HUAWEI Analytics service, click Enable Dynamic Tag Manager. In the dialog box displayed, enter a configuration name, and set Operation record.
  5. Click OK. The Configuration tab page is displayed, asking you to install the DTM-Web tracking code snippet.
  6. View the created configuration on the Configuration page.
  7. Copy the tracking code snippet to the top of the page <head> block so that it can take effect immediately. The screenshot below shows an example.
  8. Start your web server. (If you do not have a proper web server, please refer to Software Requirements.)

Creating a Variable

  1. Click Configure on the Variable tab page.
  2. On the Configure preset variable page displayed, select the preset variable to be created and click OK.
  3. Click Create on the Variable tab page. On the Create custom variable page displayed, enter GA in the Name text box, set Type and other parameters, and click Save.

Creating a Condition

  1. Click Create on the Condition tab page.
  2. On the Create condition page displayed, enter a condition name, select a condition type, and set other related parameters.
  3. Set Variable, Operator, and Value for a trigger if you select a condition type and set Trigger to Some xx (for example, Some clicks). You can click Add to add multiple triggers.
  4. Click Save.

Creating a Tag

  1. Click Create on the Tag tab page.
  2. On the Create tag page displayed, enter a tag name, select a tag extension template, and set other related parameters.
  3. On the Create tag page, set Trigger condition and Exception condition for the tag.
    • When the specified trigger condition is met, events will be reported to the analytics platform.
    • When the specified exception condition is met, events will be blocked and not be reported to the analytics platform.
  4. Click Save.

Creating a Version

  1. Click Create on the Version tab page.
  2. In the Create version dialog box displayed, set Name and Description, and click OK.

Releasing a Version

  1. Click Release on the Version details page.
  2. Confirm the information in the dialog box and click OK.

  3. View the released version and its release time on the Version tab page.

Triggering an Event

  1. Open the Chrome browser, enter the demo web app URL in the browser address box, and press Enter.
  2. Click in the toolbar of the Chrome browser to start Tag Assistant, and click Enable.
  3. Refresh the web page, click the click here button to trigger tag execution, and click the Tag Assistant icon in the browser toolbar. If information in the screenshot below is displayed, the relevant event has been triggered and reported.

Viewing the Reported Event

  1. Enter https://analytics.google.com in the address box of the browser, and click Events under Realtime on the left.
  2. On the Events page, view the reported event.

Well done. You have successfully completed this codelab and learned how to:

For more information, please click the following link:

Related Documents
You can click the button below to download the source code:

Sample Code for Web Projects