Een "call-to-action", of "oproep tot actie" is een handig middel om bezoekers door je website te leiden.
Bedenk bij elke pagina of bericht wat na het lezen de door jouw gewenste vervolgstap is. Wil je dat de bezoeker naar de contactpagina gaat, een aanbieding bekijkt of naar een productpagina gaat? Zorg dan in ieder geval aan het eind van de pagina voor een overtuigende call-to-action. Dat kan een knop zijn, of een opvallende paragraaf als je meer woorden nodig hebt om te overtuigen.
Hebben al jouw pagina's en berichten al een call-to-action?
In de onderstaande video* leg ik uit hoe je in WordPress eenvoudig een call-to-action toevoegt aan je pagina of bericht. Deze methode is vooral handig als je een thema hebt dat geen uitgebreide opmaak mogelijkheden heeft, zoals het Twenty Eleven thema.
* Excuses voor de mindere geluidskwaliteit van de video.
In de video worden de volgende stukjes html-code gebruikt. Niet ingewikkeld, gewoon kopiëren en plakken!
Voorbeeld van een opvallende paragraaf als call-to-action
Daar gebruik je deze html-code voor:
<div style="background-color: #fffacd; border: 4px dashed #ffa500;
padding: 10px; text-align: center;">Type hier de tekst voor je call-to-action. De tekst kun je in het Wysiwyg-tabblad van je bericht of pagina opmaken op dezelfde manier als de rest van de tekst. Dus je kunt ook eenvoudig een link toevoegen naar je<a href="https://www.vlot-en-goed.nl/contact/" target="_blank">
contactpagina</a> of aanbieding.</div>
Kleuren aanpassen? Hier vind je een overzicht van veel gebruikte kleuren: http://en.wikipedia.org/wiki/Web_colors
En hier vind je een handige kleurkiezer die automatisch de bijhorende kleurcode toont:
https://www.google.nl/search?q=rgb+color+picker
Voorbeeld van een knop als call-to-action
Daar gebruik je deze html-code voor:
<p style="text-align: left;"><a style="box-shadow: inset 0px 1px 0px 0px
#fce2c1; background:-moz-linear-gradient( center top, #ffc477 5%, #fb9e25 100% ); filter: progid;
background-color: #ffc477; border-radius: 6px;
border: 2px solid #eeb44f; display: inline-block; color: #ffffff; font-family: arial; font-size: 15px;
font-weight: bold; padding: 6px 24px; text-decoration: none;"
href="http://www.google.nl">Contact</a></p>
Geen zin in gedoe met HTML- en RGB codes?
Je kunt ook de plugin Shortcodes Ultimate installeren en zonder een letter programmeercode op deze manier een knop maken:
Nog meer tips over het gebruik van links en knoppen vind je in dit artikel.
Meer leren over WordPress?
Plannen om zelf je WordPress website te maken? Ben je begonnen, maar kom je er niet uit of gaat het niet snel genoeg? Overweeg dan de 1-daagse cursus WordPress:
- WordPress wordt stap-voor-stap eenvoudig uitgelegd
- Deze dag bespaart je weken uitzoekwerk
- Installatiehulp vooraf
- Uitgebreide naslag (inclusief extra tips)
- Kleine groep
Verder lezen:
[related_posts limit="3" image="150"] [divider]