Clicktag problem in index.html

What we normally do is change the exported html in the end.

Here you see a basic exported Hype document:

<!DOCTYPE html>
<html>
  <head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta http-equiv="X-UA-Compatible" content="chrome=1,IE=edge" />
	<title>Standard</title>
	<style>
		html {
			height:100%;
		}
		body {

			margin:0;
			height:100%;
		}
	</style>
	<!-- copy these lines to your document head: -->

	<meta name="viewport" content="user-scalable=yes, width=1280" />

	<!-- end copy -->
  </head>
  <body>
	<!-- copy these lines to your document: -->

	<div id="standard_hype_container" class="HYPE_document" style="margin:auto;position:relative;width:100%;height:100%;overflow:hidden;">
		<script type="text/javascript" charset="utf-8" src="Standard.hyperesources/standard_hype_generated_script.js?52699"></script>
	</div>

	<!-- end copy -->
  </body>
</html>

What we add after the export is the following based on Germany's IAB Clicktag Principle (page 17).

In the head region:

<!-- ? setTimeout + DOMContentLoaded -->
<script>
    var hypeScriptSrc = "./*_hype_generated_script.js";

    document.addEventListener("DOMContentLoaded", function (event) {
        window.setTimeout(function () {
            var headElement = document.getElementsByTagName('head')[0];
            var scriptElement = document.createElement('script');
            scriptElement.type = 'text/javascript';
            scriptElement.src = hypeScriptSrc;
            headElement.appendChild(scriptElement);
        }, 1000 /* 1 second delay */);

    });
</script>
<!-- ? end setTimeout + DOMContentLoaded -->

In the body region:

<!-- ! change the main div into an <a> tag, add href=void and target=_bl -->
<a id='*_hype_container_name' href='javascript:void(0)' target="_blank" class="HYPE_document">
    <!-- Copy around the main DIV -->
</a>

and at the end of the html body region:

<!-- * OVK/IAB standard clicktag -->
<script>
    var getUriParams = function () {
        var query_string = {}
        var query = window.location.search.substring(1);
        var parmsArray = query.split('&');
        if (parmsArray.length <= 0) return query_string;
        for (var i = 0; i < parmsArray.length; i++) {
            var pair = parmsArray[i].split('=');
            var val = decodeURIComponent(pair[1]);
            if (val != '' && pair[0] != '') query_string[pair[0]] = val;
        }
        return query_string;
    }();
    document.getElementById('*_hype_container_name').setAttribute('href', getUriParams.clicktag);
</script>
<!-- * end OVK/IAB standard clicktag -->

To test the clicktag: Enter this Query in the browsers URL, after the banners index.html.

Clicktag Query Test in the browser: ?clicktag=https://www.google.com

Example:
index.html?clicktag=https://www.google.com

4 Likes