Wat zijn contentplaatsingen?

Pad in de interface: Instellingen → Contentplaatsing (of vanuit een afzonderlijke actie).

Placeholders zijn benoemde plekken op je website waar Personyze-content verschijnt — een banner in je header, aanbevelingen op een productpagina, een bericht boven het categorieraster, alles daartussen. Je maakt een placeholder één keer aan, en vanaf dan kan elke campagne erop richten.

Daar gaat het om: een placeholder is een benoemd anker waarin Personyze in de pagina weergeeft, in plaats van er als pop-up of overlay boven te zweven. Stel de plek één keer in en wissel daarna verschillende content door voor verschillende doelgroepen, zonder je site opnieuw aan te raken.

Liever doorklikken? Gebruik de interactieve rondleiding hieronder en scrol daarna omlaag voor de uitgebreide naslag.

Een placeholder maken

1234567

Contentplaatsing openen

Ga naar Instellingen → Contentplaatsing. Elke placeholder staat erin met de selector en waaraan hij is gekoppeld. Klik op + Nieuwe placeholder toevoegen.

💡 De kolom Gekoppeld vertelt je hoeveel acties en doelgroepen van een placeholder afhangen voordat je eraan komt.

Volgende →⛶ Vergroten

Kies een methode

Drie manieren om Personyze te vertellen waar content komt: Zoeken op pagina’s (klik het aan op je site), Ik ken de selector (plak CSS) of Code om in de pagina-HTML te plaatsen (een div voor je developer). Het resultaat is hetzelfde — deze rondleiding volgt de kiezer.

← TerugVolgende →⛶ Vergroten

De kiezer openen

Kies Zoeken op pagina’s, voer de URL van een pagina op je site in en klik op Kiezer openen. Personyze laadt die pagina in de QA-simulator, met het placeholderpaneel ernaast.

← TerugVolgende →⛶ Vergroten

Het element aanwijzen en aanklikken

Klik onder Select the placeholder element op een willekeurig element op de live pagina om eraan te verankeren. De plaatsing gebruikt een CSS-selector — gebruik Select parents om hoger in de hiërarchie te komen, of Reselect om opnieuw te beginnen.

💡 Kom je uit op iets met een dynamische ID zoals #cart-SS4443? Gebruik Select parents om naar een stabieler element te klimmen.

← TerugVolgende →⛶ Vergroten

Beschrijf hem (en laat AI hem een naam geven)

Typ waarvoor de placeholder is — “balk voor gratis verzending, getoond aan nieuwe bezoekers.” Suggest with AI stelt een duidelijke naam voor, het element om op te richten en de aanbevolen plaatsing. Apply suggestion vult alles in.

💡 De beschrijving blijft bij de placeholder, zodat teamgenoten maanden later nog weten waarvoor een plek is.

← TerugVolgende →⛶ Vergroten

Plaats hem en test het uiterlijk

Put personalized content to bepaalt waar de content wordt ingevoegd ten opzichte van je element: Inside, Before, After of Replace. Daarna geeft Test the look iets weer op die plek — bekijk een echte actie uit je account, of zet er een leeg advertentieformaat in (336×280, 300×250, 728×90) om te controleren of het past.

💡 Test voordat je opslaat. Een plek waar een 300×250 in past, kan de lay-out breken met een 728×90.

← TerugVolgende →⛶ Vergroten

Gebruik hem in een actie

Sla de placeholder op en kies daarna in de stap Plaatsing, trigger & frequentie van de builder voor Inline-element → Klik om placeholder in te stellen. Gebruikt een ander contentitem die plek al, stel dan de prioriteit in — het laagste nummer wordt eerst getoond.

💡 Prioriteit doet er alleen toe als twee items tegelijk kunnen afgaan. Doelgroepen die niet overlappen, concurreren nooit.

← TerugKlaar ✓⛶ Vergroten

Contentplaatsing openen

Ga naar Instellingen → Contentplaatsing. Elke placeholder staat erin met de selector en waaraan hij is gekoppeld. Klik op + Nieuwe placeholder toevoegen.

💡 De kolom Gekoppeld vertelt je hoeveel acties en doelgroepen van een placeholder afhangen voordat je eraan komt.

Volgende →✕ Sluiten

Kies een methode

← TerugVolgende →✕ Sluiten

De kiezer openen

Kies Zoeken op pagina’s, voer de URL van een pagina op je site in en klik op Kiezer openen. Personyze laadt die pagina in de QA-simulator, met het placeholderpaneel ernaast.

← TerugVolgende →✕ Sluiten

Het element aanwijzen en aanklikken

💡 Kom je uit op iets met een dynamische ID zoals #cart-SS4443? Gebruik Select parents om naar een stabieler element te klimmen.

← TerugVolgende →✕ Sluiten

Beschrijf hem (en laat AI hem een naam geven)

💡 De beschrijving blijft bij de placeholder, zodat teamgenoten maanden later nog weten waarvoor een plek is.

← TerugVolgende →✕ Sluiten

Plaats hem en test het uiterlijk

💡 Test voordat je opslaat. Een plek waar een 300×250 in past, kan de lay-out breken met een 728×90.

← TerugVolgende →✕ Sluiten

Gebruik hem in een actie

💡 Prioriteit doet er alleen toe als twee items tegelijk kunnen afgaan. Doelgroepen die niet overlappen, concurreren nooit.

← TerugKlaar ✓✕ Sluiten

De lijst Contentplaatsing

Elke placeholder in het account staat erin met de methode en selector die hij gebruikt (bijvoorbeeld CSS · banner.hero), waaraan hij is gekoppeld — hoeveel acties en doelgroepen er op dit moment van afhangen — wanneer hij is aangemaakt, en een schakelaar Actief. Zoek op naam, of filter op Alle / Actief / Inactief. Het potlood bewerkt een placeholder; het menu … bevat de rest.

De pagina Contentplaatsing van Personyze met placeholders, hun methode, selector, gekoppelde acties en doelgroepen, en schakelaar voor actief — De lijst Contentplaatsing. De kolom Gekoppeld is degene om in de gaten te houden — die toont hoeveel acties en doelgroepen van een placeholder afhangen, zodat je weet wat er breekt als je hem wijzigt of deactiveert.

Klik op + Nieuwe placeholder toevoegen om er een te maken. Geef hem een naam die je later herkent — je kiest hem uit een keuzelijst als je campagnes bouwt.

Kies een methode

Personyze moet weten waar op de pagina je content moet komen. Er zijn drie manieren om dat te vertellen, en het resultaat is identiek — kies wat past bij hoeveel je van de markup van de pagina weet en of je die kunt bewerken.

Zoeken op pagina’s

De visuele kiezer, en de optie om naar te grijpen als je de markup niet kent — of er niet naar wilt gaan graven. Voer de URL van een pagina op je site in en klik op Kiezer openen: Personyze laadt die pagina in de QA-simulator met een placeholderpaneel ernaast, zodat je de plek op de echte pagina kiest in plaats van een selector te raden.

Het element aanwijzen en aanklikken

Klik onder Select the placeholder element op een willekeurig element op de pagina om eraan te verankeren. Personyze bepaalt de CSS-selector voor je — voor een paginatitel kiest hij bijvoorbeeld H1. Twee knoppen zijn hier belangrijk:

Select parents — loopt vanaf wat je hebt aangeklikt omhoog door de DOM-hiërarchie. Dit is je uitweg als je uitkomt op een element met een dynamische ID (zie de waarschuwing hieronder).
Reselect — begint de keuze opnieuw.

De contentplaceholderkiezer van Personyze, geopend op een live pagina, met de vraag een element aan te wijzen en aan te klikken als placeholder — De kiezer naast je live pagina. Klik op een element om het als anker voor de placeholder te gebruiken; Select parents klimt omhoog in de hiërarchie als het aangeklikte element niet stabiel genoeg is.

Beschrijf hem — en laat AI hem een naam geven

In Describe this placement zeg je in gewone taal waarvoor de plek is: “balk voor gratis verzending, getoond aan nieuwe bezoekers”. Klik op Suggest with AI en Personyze stelt een duidelijke naam voor de placeholder voor, het element om op te richten en een aanbevolen plaatsing ten opzichte daarvan. Apply suggestion vult die in.

Dit is de moeite waard, zelfs als je het antwoord al weet. De beschrijving blijft aan de placeholder vastzitten, zodat je team zes maanden later nog kan zien waarvoor H3.main-title-heading eigenlijk bedoeld was.

Het paneel Describe this placement met een AI-suggestie die een naam, een element en een aanbevolen plaatsing voor de placeholder voorstelt — Describe this placement: zeg waarvoor de plek is, en AI stelt een naam voor, het element, en waar de content ten opzichte daarvan moet komen. Apply suggestion vult ze in.

Plaats hem en test het uiterlijk

Put personalized content to is de versie van Acties plaatsen in de kiezer — het bepaalt waar content wordt ingevoegd ten opzichte van het element dat je hebt geselecteerd: Inside (erin toegevoegd, aan het eind), Before, After of Replace.

Test the look is het deel dat je beter niet overslaat. Het geeft iets weer op de plek, zodat je kunt zien hoe de content er echt komt te staan voordat je vastlegt:

Een actie uit je account bekijken — kies een echte actie en klik op Preview in this location om de echte content op zijn plek te zien.
Of een leeg advertentieformaat testen — zet er een blok in van 336×280, 300×250 of 728×90 om te controleren of de plek die afmetingen aankan zonder de lay-out te breken.

Het kiezerpaneel dat laat zien waar content ten opzichte van het geselecteerde element wordt ingevoegd, en de voorbeeldopties van Test the look — Put personalized content to bepaalt het invoegpunt; Test the look geeft een echte actie of een leeg advertentieformaat weer op de plek, zodat je ziet of het past voordat je opslaat.

Klik op Save placeholder als de plek er goed uitziet.

Ik ken de selector

Plak een CSS-selector die het element al aanwijst — .hero-banner, #product-grid, [data-slot='recommendations'].

Let op dynamische ID’s. Veel sites genereren selectors met een ID die per bezoeker of per product verandert — #cart-SS4443. Een placeholder die daarop is gebouwd, werkt voor jou en voor niemand anders, omdat die exacte selector op niemands anders pagina bestaat. Gebruik in plaats daarvan een algemene ouder (#cart of .cart-wrap), zodat de placeholder blijft werken als die ID’s veranderen. In de visuele kiezer brengt de optie select parents je omhoog naar een stabieler element.

Zelf een selector vinden

Klik met de rechtermuisknop op het element op je pagina en kies Inspecteren om de ontwikkelaarstools van je browser te openen met dat element gemarkeerd. Klik met de rechtermuisknop op het gemarkeerde element in de inspector en kopieer het selectorpad. Noemt je browser het anders, zoek dan op “HTML-selector vinden in [je browser]”. Kort wat je krijgt in tot de kortste stabiele vorm — lange automatisch gegenereerde paden breken zodra de structuur van de pagina verschuift.

Code om in de pagina-HTML te plaatsen

Personyze genereert een lege ankerdiv — <div id="placeholder-5rf9"></div> — en jij (of je developer) plakt die waar de content moet verschijnen: in een template, een CMS-blok, een React-component, waar dan ook.

Dit is de robuustste van de drie, omdat het anker van jou is en niet afhangt van de bestaande structuur van de pagina — geen selector die breekt als de site opnieuw wordt ontworpen. De keerzijde is dat het een codewijziging aan jouw kant vraagt.

De methode Code om in de pagina-HTML te plaatsen met het gegenereerde div-snippet om aan een developer te geven — Code om in de pagina-HTML te plaatsen: kopieer de gegenereerde div en geef die aan een developer. Omdat de div zelf het anker is, heeft deze methode geen instelling Acties plaatsen — de content wordt er gewoon in weergegeven.

Waar moet de content verschijnen?

Bij de methoden op basis van een selector bepaalt Acties plaatsen de positie ten opzichte van het element dat je hebt gekozen:

Binnen het geselecteerde element — de content wordt erin toegevoegd (de standaard).
Vóór het geselecteerde element — de content wordt er direct boven ingevoegd.
Ná het geselecteerde element — de content wordt er direct onder ingevoegd.
Het geselecteerde element vervangen — het oorspronkelijke element wordt vervangen door je content.

De keuzelijst Acties plaatsen, geopend, met Binnen, Vóór, Ná en Het geselecteerde element vervangen — Acties plaatsen. Binnen voegt toe in het element; Vóór en Ná laten het intact en staan eromheen; Vervangen ruilt het volledig in — handig om een bestaande bannerplek over te nemen.

Meerdere campagnes afhandelen

Meerdere campagnes kunnen om dezelfde placeholder concurreren. Drie instellingen bepalen wat er gebeurt:

Maximaal te tonen acties — hoeveel acties hier tegelijk mogen worden weergegeven. Sta je er meer dan één toe, dan wordt de content geordend op campagneprioriteit — laagste nummer eerst.
Content rouleren — toon alle concurrerende content één voor één, in plaats van de overloop te verbergen. Gebruik het als je liever alles om de beurt toont dan de verliezers te laten vallen.
Meerdere elementen kunnen de selector matchen — geef weer bij elk passend element in plaats van alleen het eerste. Dat wil je voor een selector als .product-card die terecht veel elementen matcht; laat het uit als de selector naar precies één plek moet leiden.

Klik op Nieuwe container opslaan als je klaar bent.

Een placeholder kiezen vanuit een actie

Je hoeft placeholders niet vooraf te maken. Als je een actie bouwt — in de Pop-up-, banner- en HTML-builder, bij stap 3, Plaatsing, trigger & frequentie — kies je Waar op de pagina de content komt:

Inline-element — wordt weergegeven in een sectie van je pagina. Natuurlijk en niet opdringerig: het staat tussen je andere content. Dit is de optie die een placeholder gebruikt — klik op Klik om placeholder in te stellen om er een te kiezen.
Zwevende pop-up — ligt over de pagina, met een optionele gedimde achtergrond. Geen placeholder nodig; je stelt in plaats daarvan een schermpositie in.

Met de kiezer koppel je een bestaande placeholder of maak je er ter plekke een met + Nieuw. Elke placeholder toont hoe hij wordt gebruikt — bijvoorbeeld gebruikt in 1 acties, 0 actief — zodat je ziet of je op het punt staat een plek te delen voordat je je eraan vastlegt.

Een placeholder delen tussen campagnes

Een placeholder is niet van één campagne. Een willekeurig aantal acties kan naar dezelfde plek wijzen, en dat is precies wat hem nuttig maakt: dezelfde plek op de pagina toont elke doelgroep een andere boodschap.

Kies je een placeholder die een ander contentitem al gebruikt, dan waarschuwt Personyze je en toont het de lijst met alle contentitems die deze placeholder gebruiken. Kunnen er twee tegelijk afgaan, dan bepaal jij de volgorde met prioriteit — laagste nummer eerst. Sleep de items, of gebruik de pijlen bij Positie, om de actie die je bewerkt omhoog of omlaag in de rij te zetten.

Het paneel Placeholder selecteren in een Personyze-actie, met de placeholderchip, de lijst met contentitems die hem gebruiken en hun prioriteitsvolgorde — Een placeholder selecteren vanuit een actie. Het paneel toont elk contentitem dat deze plek al gebruikt en laat je ze in de volgorde slepen waarin ze moeten worden getoond — de actie die je bewerkt is gemarkeerd, zodat je ziet waar die terechtkomt.

Twee dingen om hier goed uit elkaar te houden:

Prioriteit doet er alleen toe als items concurreren. Als de doelgroepen nooit overlappen, kan maar één actie ooit bij een bepaalde bezoeker passen en maakt de volgorde niet uit. Prioriteit lost het geval op waarin meerdere tegelijk passen.
Prioriteit ordent; die vermenigvuldigt niet. Standaard toont de placeholder één item — de match met de hoogste prioriteit — en de rest valt weg. Om er meerdere tegelijk te tonen als de lay-out dat toelaat, moet de placeholder zelf meer dan één item toestaan; dat is de instelling Maximaal te tonen acties die hierboven is behandeld (het paneel noemt het show multiple items).

Om te zien welke campagnes op live verkeer echt om een plek concurreren, toont het tabblad QA-campagnes overlappingen van placeholders en je prioriteit tegenover die van hen, voordat je lanceert.

Een plaatsing in een campagne gebruiken

Eenmaal opgeslagen is de placeholder beschikbaar voor elke actie die visueel wordt weergegeven — banners, aanbevelingen, formulieren. Hij verschijnt niet voor JavaScript- of e-mailacties, die niet op deze manier in de pagina worden weergegeven.

Omdat de plek los staat van de content, kun je meerdere campagnes op dezelfde placeholder richten en elke doelgroep op dezelfde plek van de pagina iets anders tonen.