To integrate your offer created in the affiliate network on the platform in HOQU with the site created in the Tilda builder, follow the instructions below.

In our example, we will use the option with iframe integration using cookieless tracking technology - https://hoqu.crisp.help/en/article/cookieless-tracking-5s244d/

Getting a tracking link in HOQU

Pixel integration

In the Information tab, select and save the pixel integration type.



In the General Offers tab, go to the Integrations section.

In our example, copy the link in the pixel section.



In the pixel tracking link, replace {action} with the value of the payment model for this offer. For request_id, specify the value $ {window.localStorage.phone}, for click_id - $ {window.localStorage.clickId}.

In our case, we get a link of the following form:

https://trackerhqu.com/1509/pixel.gif?request_id=${window.localStorage.phone}&action=CPA&click_id=${window.localStorage.clickId}

Integration on Tilda's side

Log in to your Tilda account and go to the site editing mode.

Find the very top first block of your landing page, hover over it and click the + button



Find block T123 and click on it.



Next, click the Content button



Add the code to the form for inserting the code (the script writes request_id and click_id to the localStorage of the browser). This code must be installed on the page where the traffic goes, and on all pages where there is a form for creating an application.

<script>
$(function () {
document.getElementsByTagName('input').Phone.onchange = (e) => {
if (e.target.value) {
window.localStorage.phone = e.target.value
.replaceAll(' ','')
.replaceAll('(', '')
.replaceAll(')', '')
.replaceAll('+', '')
.replaceAll('-', '')
window.localStorage.clickId = (new URLSearchParams(location.search)).get('click_id')
}
}
})
</script>


Phone.onchange - the phone number specified by the user in the application.

An alternative version of the script, where cookies are used instead of LocalStorage

<script>
$(document).ready(function () {

function saveData(e) {
if (e.target.value) {
const clickId = (new URLSearchParams(location.search)).get('click_id')

document.cookie = `phone=${e.target.value}`;
document.cookie = `clickId=${clickId}`;
}
}

setInterval(function() {
document.getElementsByTagName('input').Phone.onchange = saveData;
document.getElementsByTagName('input').phone.onchange = saveData;
}, 2000)

})
</script>


Then save the changes and publish them.





Next, find a page that will count towards the target action (conversion) when shown. For example, this could be the “Thank you for order” page after placing an order.

By analogy with the previous paragraph, open block T123 and add a script there with the link that we took from the pixel

https://trackerhqu.com/1509/pixel.gif?request_id=${window.localStorage.phone}&action=CPA&click_id=${window.localStorage.clickId}

It should look like this:

<script>
$(function () {
const img = document.createElement('img');

img.setAttribute('src', `https://trackerhqu.com/1509/pixel.gif?request_id=${window.localStorage.phone}&action=CPA&click_id=${window.localStorage.clickId}`)

img.setAttribute('alt', 'HOQU')
img.setAttribute('width', '1px')
img.setAttribute('heigth', '1px')
img.setAttribute('style', 'position: absolute; left: -999px')

document.body.append(img)
})
</script>


An alternative version of the script, where cookies are used instead of LocalStorage

<script>
$(function () {
function getCookie(name) {
const finded = document.cookie.split('; ').find(item => item.split('=')[0] === name);
return finded.split('=')[1];
}

const img = document.createElement('img');

const clickId = getCookie('clickId');
const phone = getCookie('phone');

img.setAttribute('src', `https://trackerhqu.com/1509/pixel.gif?request_id=${phone}&action=CPA&click_id=${clickId}`)
img.setAttribute('alt', 'HOQU')
img.setAttribute('width', '1px')
img.setAttribute('heigth', '1px')
img.setAttribute('style', 'position: absolute; left: -999px')

document.body.append(img)
})
</script>


This script plugs the recorded data into a pixel and inserts it into the document to make a request.

Similar to the first script, save your changes and publish them to Tilda.

Integration via iframe

In the offer, select and save the type of integration iframe.



In the General Offers tab, go to the Integrations section.

In our example, copy the link in the iframe section.



In the pixel tracking link, replace {action} with the value of the payment model for this offer. For request_id, specify the value $ {window.localStorage.phone}, for click_id - $ {window.localStorage.clickId}



In our case, we get a link of the following form:

https://trackerhqu.com/1509/pixel.html?request_id=${window.localStorage.phone}&action=CPA&click_id=${window.localStorage.clickId}

Integration on Tilda's side

Log in to your Tilda account and go to the site editing mode.

Find the very top first block of your landing page, hover over it and click the + button



Find block T123 and click on it.



Next, click the Content button



Add the code to the form for inserting the code (the script writes request_id and click_id to the localStorage of the browser). This code must be installed on the page where the traffic goes, and on all pages where there is a form for creating an application.

<script>
$(function () {
window.localStorage.clickId = (new URLSearchParams(location.search)).get('click_id')
document.getElementsByTagName('input').Phone.onchange = (e) => {
if (e.target.value) {
window.localStorage.phone = e.target.value
}
}
})
</script>


Phone.onchange - the phone number specified by the user in the application. Then save the changes and publish them.





Next, find a page that will count towards the target action (conversion) when shown. For example, this could be the “Thank you for order” page after placing an order.

By analogy with the previous paragraph, open block T123 and add a script there with the link that we took from the iframe.

It should look like this:

https://trackerhqu.com/1509/pixel.html?request_id=${window.localStorage.phone}&action=CPA&click_id=${window.localStorage.clickId}

<script>
$(function () {
const iframe = document.createElement('iframe');

iframe.setAttribute('src', `https://trackerhqu.com/1509/pixel.html?request_id=${window.localStorage.phone}&action=CPA&click_id=${window.localStorage.clickId}`)

iframe.setAttribute('width', '1px')
iframe.setAttribute('heigth', '1px')
iframe.setAttribute('frameborder', '0')
iframe.setAttribute('scrolling', 'no')

document.body.append(iframe)
})
</script>


This script plugs the recorded data into a pixel and inserts it into the document to make a request.

Similar to the first script, save your changes and publish them to Tilda.

Testing

Create a campaign under a test webmaster and take a tracking link from it.



In incognito mode, follow it to the site and take the targeted action. In case of successful integration, a click and conversion should appear in the statistics of this affiliate.

Was this article helpful?
Cancel
Thank you!