How to set a dynamic se_la (label) with Google-AMP-Tracker-v2?

For engineers Tracking SDKs
1

I’m trying to set a dynamic label for an event.
I’ve tried following the data-vars- method mentioned here.

My html looks like this:

<a href="https://some-url" data-vars-test="custom_event_label">Click</a>

Then in my JSON configuration:

<amp-analytics type="snowplow_v2" id="event1">
<script type="application/json">
{
  "vars": {
    "collectorHost": "snowplow-collector.acme.com",  // Replace with your collector host
    "appId": "campaign-microsite"                    // Replace with your app ID
  },
  "triggers": {
    "trackMyCustomEventClick": {  
      "on": "click",
      "selector": "a"
      "request": "structEvent",
      "vars": {
         "structEventCategory": "CTA",
        "structEventAction": "my_action",
        "structEventLabel": "{ this_should_be_test_value: ${ test }}"
      }
    }
  }
}
</script>
</amp-analytics>

My expectation is that the se_la= "{ this_should_be_test_value: custom_event_label }"
But I’m getting just “{ this_should_be_test_value: }”.

Can anyone share any insights and maybe let me know if I’m doing anything wrong?

Thanks!

2

The documentation you refer to is mostly for vendors and developers of analytics products. If you are using snowplow v2 and not doing it from scratch. I recommend using this documentation:

As far as I remember from working on v2, curly braces are special constructs in AMP and AMP treats variables in triggers differently than in vars. AMP has very bad documentation around this, it took a while for us to figure it out when working on v2.

Try removing first set of braces and moving the compound moving value to vars then using that var instead (i.e.):

<amp-analytics type="snowplow_v2" id="event1">
<script type="application/json">
{
  "vars": {
    "collectorHost": "snowplow-collector.acme.com",  // Replace with your collector host
    "appId": "campaign-microsite",                              // Replace with your app ID
    "customLabel": "this_should_be_test_value: ${test}"
  },
  "triggers": {
    "trackMyCustomEventClick": {  
      "on": "click",
      "selector": "a"
      "request": "structEvent",
      "vars": {
         "structEventCategory": "CTA",
        "structEventAction": "my_action",
        "structEventLabel": "${customLabel}"
      }
    }
  }
}
</script>
</amp-analytics>

You can also follow the example in AMP Git repo when working on your implementation:

3

@mbondarenko Thanks for the reply!
I am not trying to implement my own solution, but rather I’m using the Google AMP Tracker v2 · snowplow/snowplow Wiki · GitHub
I just don’t understand how I can create a label for an event based on the data I have at hand.

All I’m trying to do is have the link I click to add data (the ID of an article link that was clicked) to the label.

Is there a more simple way?

I’ve tried your suggested approach and it didn’t work (removing the braces and defining the customLabel as a global var).

I really don’t understand why everything with AMP is so difficult, it’s seriously frustrating, especially not being able to debug anything.

4

Unfortunately AMP could be very frustrating, mostly due to poor/unorganized documentation when it comes to amp-analytics and a lot of undocumented/unreferenced restrictions. I do not have ability to spin off a local AMP testing environment now and don’t quite remember how this could be resolved off top of my head. I’ll take a look in the evening once I am done with work. In the meantime, I suggest trying the following:

<amp-analytics type="snowplow_v2" id="event1">
<script type="application/json">
{
  "vars": {
    "collectorHost": "snowplow-collector.acme.com",  // Replace with your collector host
    "appId": "campaign-microsite"                              // Replace with your app ID
  },
  "triggers": {
    "trackMyCustomEventClick": {  
      "on": "click",
      "selector": "a"
      "request": "structEvent",
      "vars": {
         "structEventCategory": "CTA",
        "structEventAction": "my_action",
        "structEventLabel": "this_should_be_test_value: ${test}"
      }
    }
  }
}
</script>
</amp-analytics>

and this:

<amp-analytics type="snowplow_v2" id="event1">
<script type="application/json">
{
  "vars": {
    "collectorHost": "snowplow-collector.acme.com",  // Replace with your collector host
    "appId": "campaign-microsite"                              // Replace with your app ID
  },
  "triggers": {
    "trackMyCustomEventClick": {  
      "on": "click",
      "selector": "a"
      "request": "structEvent",
      "vars": {
         "structEventCategory": "CTA",
        "structEventAction": "my_action",
        "structEventLabel": "this_should_be_test_value: `${test}`"
      }
    }
  }
}
</script>
</amp-analytics>

or this:

<amp-analytics type="snowplow_v2" id="event1">
<script type="application/json">
{
  "vars": {
    "collectorHost": "snowplow-collector.acme.com",  // Replace with your collector host
    "appId": "campaign-microsite"                              // Replace with your app ID
  },
  "triggers": {
    "trackMyCustomEventClick": {  
      "on": "click",
      "selector": "a"
      "request": "structEvent",
      "vars": {
         "structEventCategory": "CTA",
        "structEventAction": "my_action",
        "structEventLabel": "this_should_be_test_value: $REPLACE(`${test}`, `.+`,`${test}`)"
      }
    }
  }
}
</script>
</amp-analytics>
2 Likes
5

Thanks @mbondarenko!
I’ll try these options and report back.

6

First one worked!
Thanks again @mbondarenko! :pray: :smiley:

7

You are welcome! Glad I was able to help!

1 Like