Stripe buy button can be identified in Developer tools by the text “buy-button," this means that you are using Stripe’s buy button integration - https://docs.stripe.com/payment-links/buy-button
This works for one or more buttons on a page.
Integration steps:
Install Trackdesk app
Our Stripe app is available here in the Stripe marketplace - https://marketplace.stripe.com/apps/trackdesk
Fill in all necessary information in the settings of the Stripe app and save changes.
Tenant ID - Your Tenant ID can be found at the bottom of the Settings page
Personal token - Personal tokens can be found at the bottom of the Settings page, or a new one can be created via the Personal tokens menu in the Setting
3. Add the click script.
Track clicks by including the following code on every page of your website where you want to track clicks, including all landing pages added to this offer. For best results, position the code as high as possible within the <head> tag of your HTML document.
<!-- Trackdesk tracker begin -->
<script async src="//cdn.trackdesk.com/tracking.js"></script> <script>
(function(t,d,k){(t[k]=t[k]||[]).push(d);t[d]=t[d]||t[k].f||function(){(t[d].q=t[d].q||[]).push(arguments)}})(window,"trackdesk","TrackdeskObject");
trackdesk('YOUR TENANT ID', 'click');
</script>
<!-- Trackdesk tracker end -->
Make sure to replace YOUR TENANT ID with your actual tenant ID.
The next step is integrating a help script that will establish connection for the Stripe app.
Add the snippet below to all pages where buy buttons are located. Add the snippet ideally at the end of the <body> tag.
The help script will differ depending on if the Stripe buy button is on a different page than the landing page or if it is on the same page.
Buy button on different page than landing page
This script is pasted to the page where the Stripe buy button/s are present in case that this page is different than the landing page.
<!-- Trackdesk set client_reference_id buy button help fuction begin -->
<script>
(function () {
var cookie = document.cookie.match('(^|;)\\s*trakdesk_cid\\s*=\\s*([^;]+)');
if (Array.isArray(cookie)) {
try {
var trakdeskCid = JSON.parse(cookie.pop());
var cid = trakdeskCid['cid'];
document.querySelectorAll('stripe-buy-button').forEach(function (e) {
e.setAttribute('client-reference-id', cid)
});
} catch (e) {
console.log(e);
}
}
})();
</script>
<!-- Trackdesk set client_reference_id buy button help fuction end -->
Buy button on same page as landing page
This script is pasted to the page where the Stripe buy button/s are present in case that it is directly the landing page.
<!-- Trackdesk set client_reference_id pricing buy button help fuction, click script on the same page as help script begin -->
<script>
(function () {
var linksUpdated = false;
setInterval(function () {
var cookie = document.cookie.match('(^|;)\\s*trakdesk_cid\\s*=\\s*([^;]+)');
if (Array.isArray(cookie) && !linksUpdated) {
try {
var trakdeskCid = JSON.parse(cookie.pop());
var cid = trakdeskCid['cid'];
document.querySelectorAll('stripe-buy-button').forEach(function (e) {
e.setAttribute('client-reference-id', cid)
});
} catch (e) {
console.log(e);
} finally {
linksUpdated = true;
}
}
}, 300)
})();
</script>
<!-- Trackdesk set client_reference_id pricing buy button help fuction, click script on the same page as help script end -->
Please note that Stripe payment links (buy.stripe...), Stripe pricing tables, Stripe buy buttons all have a slightly different code.