Summary
AMP (Accelerated Mobile Pages) is a web framework that uses a stripped down form of HTML to deliver faster pages. In order to get Blue Triangle analytics from these pages, you'll need to configure the integration as shown below.
Requirements
To get started, you'll need to specify the following in the <head> of the page:
<style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
<script async src="https://cdn.ampproject.org/v0.js"></script>
<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js?optin=stable"></script>
Next, also in the <head> of the page, specify the amp-analytics html tag. Inside of this tag you'll include a JSON object with the analytics details about the page, such as the page name and traffic segment. In the following two sections we'll cover what goes inside of the JSON.
<amp-analytics type="bluetriangle" id="bluetriangle">
<script type="application/json">
{
"vars": {
...
},
"extraUrlParams": {
...
}
}
</script>
</amp-analytics>
Required Parameters
The following are the required parameters that will go inside of the vars in the JSON.
- siteID - the site identifier in Blue Triangle. If you need help finding this, just reach out to your Account Representative and they will provide it for you.
- pageName - the Page Name in Blue Triangle. The Page Names appear in the filter options and in various other parts of the Blue Triangle portal.
- pageType - the Page Group in Blue Triangle. Similar to the Page Name, this would be the Page Group in Blue Triangle's filter options.
- trafficSegment - the Traffic Segment in Blue Triangle.
Optional Parameters
The following are the optional parameters that go inside of the extraUrlParams in the JSON. Note the extraUrlParams is not required.
- AB - the AB Testing Segment field. Will default to "Default" if not specified.
- datacenter - will default as Default if not specified.
- CN1-20 - Custom Numbers in Blue Triangle. Will default to 0 if not specified.
- CSID - Customer Session ID. Will default to blank ("") if not specified.
- CV1-CV5, CV11-CV15 - Custom Variables in Blue Triangle. Will default to blank if not specified.
- CV6-10 - Custom Categories in Blue Triangle. will default to blank if not specified.
- currencyCode - ISO 4217 format. Will default to blank if not specified.
- campaign - the marketing Campaign
Example
The following is an example of the amp-analytics tag in the head. Remember the info from above (in the Requirements section) must also be specified in the <head> for the integration to work.
With the extraUrlParams, default values may be specified such as an empty string ("") or 0 if the values are not available. You can also simply leave them out of the JSON if there is no value.
<amp-analytics type="bluetriangle" id="bluetriangle">
<script type="application/json">
{
"vars": {
"siteID": "demosports",
"pageName": "Homepage",
"trafficSegment": "Prod",
"pageType": "AMP Pages"
},
"extraUrlParams": {
"AB": "ProdA",
"datacenter": "US",
"CN1": 1,
"CN2": 10,
"CN3": 5,
"CV1": "CustomVariableExample1",
"CV2": "CustomVariableExample2",
"CV6": "CustomCategoryExample1",
"CSID": "17583484332647584763",
"campaign": "MarketingCampaign1"
}
}
</script>
</amp-analytics>
Comments
0 comments
Please sign in to leave a comment.