Bijna altijd heeft een webpagina het doel om de bezoeker iets te laten doen. Bedenk dus goed wat de door jouw gewenste vervolgstap is voor de bezoeker. Wil je dat hij of zij naar de contactpagina gaat, zich inschrijft voor de nieuwsbrief of een aanbieding gaat bekijken?
Zorg dan voor een overtuigende afbeelding of tekst. Dit kan een drukknop zijn, maar ook een opvallende paragraaf met of zonder afbeelding kan prima voldoen.
De zogeheten “Call-To-Action” is de veelgebruikte marketing term voor de genoemde uiting die de bezoeker moet aanzetten tot het uitvoeren van een actie.
Een “Call-To-Action” drukknop
Om een drukknop te maken is kennis van HTML/CSS of Shortcode noodzakelijk, maar in dit artikel laten we je zien hoe je binnen WordPress toch opvallende knoppen en paragrafen kunt maken zonder te programmeren.
Eerst dienen we de volgende plugin te installeren en activeren: Forget About Shortcode Buttons.
Hou er rekening mee dat deze plugin WordPress 3.9 of hoger nodig heeft. Als je gebruik maakt van een oudere versie dien je dus WordPress bij te werken om deze plugin te gebruiken.
Zodra je de plugin hebt geactiveerd, kun je gewoon een nieuw bericht aanmaken of een bestaande bewerken en je zult een nieuwe knop zien in de Visuele modus van de Editor met een soort nooduitgang afbeelding. (zie afbeelding)
Om een nieuwe drukknop aan te maken en in je bericht te plaatsen, dien je te klikken op de “Insert Button” knop. Dit zal dan een popup-venster openen waarin je de nieuwe knop kan ontwerpen.
Het enige wat je dan moet doen is het toevoegen van de tekst voor op de knop en het webadres(URL) dat geopend zal moeten worden door de knop. Kies vervolgens de tekstkleur en achtergrondkleur. Klik daarna op de openklappende meerkeuze lijst om een stijl voor de knop te kiezen.( glanzend, schaduw,ronde hoeken, etc.)
Je kunt hier ook een afmeting kiezen voor de knop.(XS tot XL)
Wanneer je dan het tabblad “icon” opent, kun je optioneel ook nog een pictogram kiezen die je voor of na de tekst aan de knop kunt toevoegen.
Tijdens het configureren kun je direct een voorbeschouwing van de knop zien, zodra je tevreden bent met het resultaat, klik je op Invoegen.(insert)
Je zal nu de knop in de editor zien, precies zoals deze in de werkelijkheid getoond gaat worden aan de bezoekers van je website. De tekst op de knop is eenvoudig te selecteren en aan te passen en door gebruik te maken van de standaard WP uitlijn gereedschappen kan de positie naar links, rechts of het midden van de pagina aangepast worden. Door te dubbelklikken op de knop verschijnt de pop-up weer, zodat je de knop eventueel nog verder naar smaak kan bewerken.
Bijkomende voordeel van deze methode is dat de gecreëerde button ook actief blijft na het uitschakelen/verwijderen van de plugin. De code die is aangemaakt bestaat namelijk uit pure HTML en CSS.
Opvallende drukknoppen en paragrafen
Wanneer je liever een paragraaf tekst een opvallend uiterlijk wil meegeven is er ook een toegankelijke oplossing. De Standout Color Boxes and Buttons plugin. Na installatie komen er twee nieuwe shortcodes beschikbaar, één voor knoppen en één voor paragrafen.
Om een paragraaf met blauwe achtergrond te krijgen voer je bijvoorbeeld in de editor de volgende code in:
[color-box color='blue']Tekst opvallende paragraaf[/color-box]En de basis code voor een rode drukknop is als volgt:
[color-button href='http://nos.nl/' color='red']Knoptekst[/color-button]
Het toevoegen kan gelukkig ook door middel van een druk op de knop. Daarvoor moet wel de tekst modus van de editor actief zijn.
Aanvullend biedt deze plugin nog meer instellingen, zoals afgeronde hoeken, schaduw, etc. etc. Kijk daarvoor bij de instellingen van de plugin: WP dashboard –> Instellingen –> Standout Color Boxes and Buttons. Ook kunnen daar de standaard gedragingen aangepast worden.
Oplossingen met nog meer toeters en bellen
Als laatste, maar niet minste tip willen we ook de volgende gratis plugin nog onder de aandacht brengen:
Deze oplossing kan interessant zijn voor de mensen die behoefte hebben aan nog meer mogelijkheden en controle over de inhoud van de “Call-To-Action”.
We hopen dat dit artikel heeft geholpen om opvallende knoppen en paragrafen toe te voegen zonder te programmeren. Je kunt eventueel hieronder een reactie achterlaten wanneer je vragen of opmerkingen hebt of misschien zelfs tips wil delen.
Geef een reactie