A landing button that leads to the offer
The classic setup: a visitor comes from the ad to your landing page, reads it, and leaves
for the offer by a button. In Qubix this is the "Landing with offer" campaign target: Qubix
serves your index.html exactly as you uploaded it — it changes nothing in it and injects
nothing into it. The move to the offer is done by the Browser SDK library, which you connect
yourself.
The main thing you get for free: the offer is picked by the server. Splitting several offers by weight, pinning the offer to the visitor, substituting the tags into the link — all of that has already happened by the time the page opens. Your code only asks the SDK for the ready-made address and puts it on the button.
What you need first
- The landing is uploaded to Qubix — the Websites window, type "landing". How to upload — Uploading a website.
- A campaign with the "Landing with offer" target: the campaign has your website and an offer picked (or several offers with a weighted split).
- A domain connected and active — Domains.
AI mode
Both steps — connecting the SDK and putting the offer on the button — are done with one ask to
the AI assistant. Open your website card: the Websites window → your landing →
the Files tab, the index.html file. Call the assistant right in that window and describe
the task in plain words:
- "Connect the SDK and make the «Play» button lead to the offer with the tags carried over";
- "Make every button of the .btn class lead to the offer";
- "Why doesn't the button get the offer? Here is my code: …".
The assistant writes a ready-made block for your page — all that's left is to insert and save.
Manual mode
The same two steps in your own code — to understand exactly what was inserted, or to do it your own way.
Step 1. Connect the SDK
Add one line to the landing's index.html — the script is served from the same domain the
campaign runs on:
<script src="/sdk.js" defer></script>
No settings and no keys needed: the context — which offer was picked, which tags came with the click — is already in a cookie the server set, and the SDK reads it itself.
Step 2. Put the offer on the button
Set the link right after the page loads:
<a id="cta" class="btn" href="#">Play</a>
<script>
window.addEventListener('DOMContentLoaded', function () {
var offer = sdk.getOffer()
if (offer) {
document.getElementById('cta').href = sdk.buildOfferUrl(offer.url)
}
})
</script>
Or at the moment of the click — when there are several buttons or the address is only needed on action:
<button id="cta" class="btn">Claim the bonus</button>
<script>
document.getElementById('cta').addEventListener('click', function () {
var offer = sdk.getOffer()
if (offer) {
location.href = sdk.buildOfferUrl(offer.url)
}
})
</script>
What each call does:
sdk.getOffer()— returns the offer picked for this visitor:{ id, url }. If the page was opened outside a campaign (for example, you are looking at it directly), it returnsnull— so theif (offer)check is mandatory.sdk.buildOfferUrl(offer.url)— builds the final link: substitutes the macros in the offer address ({click_id},{sub1}…,{all_source_params}) with the values that came with the click. The click id is carried over by itself — the affiliate network receives it under the spelling it expects.
Split and pinning already work
If the campaign has several offers with weights, the server picks one of them before
serving the page and remembers the pick for the visitor. A repeat visit by the same person gets
the same offer. Your landing code needs nothing for this: sdk.getOffer() always returns the
pick already made, it never rolls the dice again.
Statistics — also on its own
The campaign visit is counted by itself — no "visit pixel", no on-load calls needed from you. Your own funnel steps — scrolled to the form, opened a dialog, clicked the button — mark up yourself:
sdk.sendEvent('cta_click', { place: 'hero' })
Where the events land and how to see statistics on them — Your landing's statistics.
With the "Prelanding and PWA store" target the button leads not to the offer but to the app
store card — there you call sdk.showStore() instead of sdk.buildOfferUrl. If you need the
move to the offer — the campaign target must be "Landing with offer". The prelanding scenario
is covered in SDK on your prelanding.
| Campaign target | Where the button leads | Call |
|---|---|---|
| Landing with offer | to the offer, with the tags | sdk.buildOfferUrl(sdk.getOffer().url) |
| Prelanding and PWA store | to the app store card | sdk.showStore() |
Verify
- Assemble the campaign link (the "Example ad URL" block in the domain card) and open it in a private browser window.
- The button must get the offer address with the tags filled in — visible in the browser's status bar on hover or in the developer tools.
- The visit shows up in the events window; your own events (
sdk.sendEvent) — same place, with a short delay.