.svg)
Beluister onze podcast
.svg)
Op deze manier plaats je jouw beïnvloedingswapens van je advertentie ook op de landingspagina, waardoor je de conversieratio verhoogt.
A/B of zelfs A/B/C testen gebeurt al erg vaak. Marketeers testen verschillende advertentieteksten en call-to-actions om te bepalen welke variant het beste werkt. Toch gaat niet iedereen ‘aan’ op dezelfde tekst, call-to-action of belofte.
Een mooi voorbeeld hiervan zijn de 7 beïnvloedingswapens van Cialdini, waar mijn collega eerder al een blog over schreef. Het zijn namelijk niet voor niets 7 verschillende beïnvloedingstechnieken. Niet iedereen wordt warm van dezelfde belofte of geactiveerd door dezelfde call-to-action. Door met twee of meer beïnvloedingstechnieken te testen kom je er achter wat voor jouw doelgroep werkt. Dus test altijd verschillende advertenties met daarin verschillende beïnvloedingstechnieken om zoveel mogelijk klikken naar je website te genereren.
Maar dan? Hoe ga je dan op je website te werk? Misschien noemde je in deze advertentietekst wel dat er ‘nog maar 5 plekken beschikbaar zijn’ om schaarste te creëren. Een andere bezoeker werd wellicht getriggerd door je advertentie met een social proof kreet als ‘al 500 andere personen gingen je voor’ en ging door die advertentie naar je website.
Onderwater weet je dus al wat voor deze verschillende personen werkt en wat ze heeft overtuigd om naar je pagina te gaan. Hoe waardevol zou het dus zijn als ze allebei de kreten op je website zien terugkomen waardoor zij geactiveerd werden? Wellicht schiet je conversieratio hierdoor wel door het dak. Ik wilde dit graag eens testen en vroeg mijn collega Laurenze, die toevallig ook aardig kan programmeren, mij te helpen met een script om dit te maken.
Het resultaat is een script waardoor je de content op je website kunt aanpassen op basis van parameters in de url. Iets makkelijker uitgelegd: stel je url bevat aan het einde ?variabel=a, dan ziet de bezoeker versie A van je pagina. Stel de url bevat ?variabel=b, dan ziet de bezoeker versie B van dezelfde pagina. Stel je hebt een social media campagne waarin je test met twee verschillende beïnvloedingswapens, dan kun je degene die op de advertentie met kreet A klikt ook kreet A laten zien op de landingspagina. Hetzelfde geldt voor B, en als je wilt zelfs met C of D.
Ik kan het blijven uitleggen, maar een voorbeeld is wellicht handiger. Ik heb twee verschillende advertenties voor onze gewaardeerde klant Loof Training & Advies als voorbeeld gemaakt. Allebei landen ze op dezelfde pagina, maar hebben ze een andere variabele in de url. Op basis van deze url veranderen twee elementen op de landingspagina.
Deze advertentie, gericht op social proof, linkt naar https://www.teamversterken.nl/?variant=a. Zoals je kunt zien bevat de url de parameter ?variant=a. Doordat de url deze parameter bevat weet het script welke tekst hij op twee diverse plekken op de website moet plaatsen.
Deze advertentie, gericht op autoriteit, linkt naar https://www.teamversterken.nl/?variant=b. Zoals je kunt zien bevat de url de parameter ?variant=b. Doordat de url deze parameter bevat weet het script welke tekst hij op twee diverse plekken op de website moet plaatsen.
Zoals je in bovenstaande voorbeelden kunt zien verandert de microcopy onder de buttons op de website op basis van de url in de advertenties. Nu is dit slechts één voorbeeld, maar er zijn natuurlijk oneindig veel mogelijkheden met dit soort kreten en triggers. Denk aan het schakelen tussen verschillende beïnvloedingstechnieken maar ook het aanpassen van je content op basis van andere variabelen. Zo heeft een van mijn collega’s eens een landingpage gemaakt voor een recruitmentbureau waarin de bedrijfsnaam van de opdrachtgever werd aangepast in de content. Het recruitmentbureau hoefde in dit geval niet steeds een andere landingpage te maken voor verschillende opdrachtgevers, maar konden door middel van de url de content op de website aanpassen. De titel was dan ‘Wil je werken bij XXX’, waarbij ‘XXX’ werd aangepast op basis van de parameter in de url.
Om bovenstaande technieken ook in jouw website toe te passen is een klein beetje technische kennis vereist, maar we hebben de code redelijk simpel gemaakt zodat vrijwel iedere marketeer met basiskennis HTML ermee uit de voeten kan. Het belangrijkste is dat je twee tekstelementen op je pagina maakt en die de juiste classname geeft. Het script verandert namelijk de elementen met die bepaalde classname. In onderstaand script zijn de classnames ‘dynamic-text-1’ en ‘dynamic-text-2’. Je kunt deze naam echter ook aanpassen, maar ik vind het zelf wel handig het zo te laten (dan hoef je minder aan te passen in het script).
<script>
// Get parameter function
function getParam(name) {
name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
results = regex.exec(location.search);
return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
// Set cookie function
function setCookie(cname, cvalue, exdays) {
const d = new Date();
d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
let expires = "expires="+d.toUTCString();
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}
// Get cookie function
function getCookie(cname) {
let name = cname + "=";
let ca = document.cookie.split(';');
for(let i = 0; i < ca.length; i++) {
let c = ca[i];
while (c.charAt(0) == ' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}
// Wait for the page to load
window.onload = function() {
// Get the parameter from the URL
var variantParam = getParam('variant');
// Set variables if a parameter in the URL exists
if (variantParam) {
setCookie("VariantCookie", variantParam, 30);
}
// Get cookie
var variant = getCookie("VariantCookie");
// Set the dynamic text if variant a or b exists
if (variant == "a") {
dynamicTextOne = "Hier kom je tekst voor de eerste variant";
dynamicTextTwo = "Hier komt je tweede tekst voor de eerste variant";
} else if (variant == "b") {
dynamicTextOne = "Hier komt je eerste tekst voor de tweede variant";
dynamicTextTwo = "Hier komt je tweede tekst voor de tweede variant";
}
// Get the current text if variant a or b doesnot exists
else {
dynamicTextOne = document.getElementsByClassName("dynamic-text-1")[0].innerHTML;;
dynamicTextTwo = document.getElementsByClassName("dynamic-text-2")[0].innerHTML;;
}
// Replace the text on page
document.getElementsByClassName("dynamic-text-1")[0].innerHTML = dynamicTextOne;
document.getElementsByClassName("dynamic-text-2")[0].innerHTML = dynamicTextTwo;
}
</script>
Hieronder leg ik stapsgewijs uit hoe je het script kunt toepassen om jouw pagina teksten te laten aansluiten op je advertentieteksten.
.svg)
.svg)
.svg)
.svg)
