We hebben diverse sliders beschikbaar. Het blok hieronder is meer een afbeelding die je als CTA kunt instellen met als extra optie om deze automatisch lineair te laten sliden. Dit kan overigens ook zonder links, zodat het meer een interactieve representatie is van een aantal visuals. Goed toe te passen voor logo’s van merken, partijen waarmee je samenwerkt of eigen klanten. Carrouselweergave aan? Dan zal deze pauzeren als je bezoeker een interactie op een CTA wil uitvoeren. Wel net zo makkelijk.
Hoe werkt het?
Stap 1 – CTA blok plaatsen
Voeg het blok CTA’s toe op je pagina.
Wil je dat je CTA blokken verdeeld zijn over de hele breedte, houd daar dan rekening mee met de instellingen. Zet bijvoorbeeld je CTA blok in een Groep die op Volledige breedte ingesteld staat.
Stap 2 – CTA inrichten
Na het invoegen zie je een placeholder visual staan. Je kunt de CTA verder zelf inrichten.
Om de visual te wijzigen klik je op het afbeeldingsicoon in het menu erboven. In de mediatheek selecteer je een afbeelding of je upload een nieuwe.
Met het link-icoon kun je een landingspagina selecteren of een url typen/plakken.
Met het potlood kun je onder de afbeelding een tekst plaatsen. Deze komt uiteindelijk gecentreerd in dit blok te staan.
Stap 3 – Meerdere CTA’s maken
Als je je paginaweergave opent (het trappetjes icoon linksboven) zie je dat er een specifieke ‘groep’ wordt gemaakt voor de CTA’s, waarin weer een afzonderlijk blok CTA staat.
Kies de onderliggende CTA en dupliceer deze om meer CTA’s toe te voegen. Vervang de afbeelding, de link en de tekst en herhaal deze stap voor het aantal CTA’s dat je wil tonen.
Je bent overigens niet verplicht een link of een tekst te plaatsen. Je kunt deze blokken ook als informatie sfeerelement tonen zonder er een landingspagina aan te hangen.
Stap 4 – Stijl je CTA’s
Stijl je CTA’s door op het overkoepelende CTA’s blok te klikken.
Bij je instellingen rechts zie je CTA kleur staan. Deze instellingen gelden voor alle CTA’s. Hieronder heb je de mogelijkheid om de vormgeving van de tegel in te stellen. Als je een SVG afbeelding upload heb je de mogelijkheid om Icoon (én ook Icoon Hover) kleuren in te stellen. Dit is voor jpg/png niet mogelijk.
Wil je specifiek voor één of enkele CTA’s andere kleurinstellingen toepassen, bijvoorbeeld om er enkele uit te lichten, dan kun je per CTA ook deze kleuren instellen.
Stap 5 – Slider, weergave en afmetingen
Zie de slider voor meet uitleg over de inrichting van het CTA blok.
- Het is mogelijk je kleur van het originele bestand te houden indien dit een SVG is. Door een Icoon Hover kleur in te stellen kun je een meerkleurige afbeelding bij hover dus in een enkele kleur tonen.
Vink carrousel weergave aan om in te stellen dat alle CTA’s zich van rechts naar links bewegen. Vul een tijd in om de snelheid te bepalen. Dit is de tijd die één CTA nodig heeft om van rechts naar links te verplaatsen. Zorg ervoor dat het niet té snel gaat voor je bezoeker door de waardes zo nu en dan te testen op je previewpagina. - Je kunt zelf bepalen hoeveel CTA’s er direct zichtbaar zijn per device. Let op dat CTA’s zich herhalen als je deze als carrousel hebt ingesteld en je minder weergaves hebt ingesteld dan er CTA’s zijn.
- Om de CTA’s iets groter of kleiner te maken kun je per device padding instellen. Naast padding kun je ook aspect ratio – dus de verhouding van het klikbare blok instellen. Dit is wel deels afhankelijk van het formaat van je geuploade afbeelding.
Tenslotte kun je nog kiezen om de blokken afgeronde hoeken te voorzien.
