Affiliate website maken in Wordpress - stappenplan

Affiliate website maken met WordPress – stap-voor-stap

Je wilt graag met affiliate marketing gaan starten. Je hebt al een niche gekozen, een thema waarover je wilt schrijven en hebt al een idee welke producten je wilt promoten. Je staat te popelen om aan de slag te gaan. 

Je hebt echter nog nooit een website gemaakt. is dat dan wel iets voor jou? Tuurlijk wel! Je kan de website uitbesteden, via een framework werken of deze zelf maken volgens de onderstaande stappen.

Wat is een affiliate website?

Een affiliate website is een website waar je voornaamste inkomsten via affiliate marketing komen. Je hebt geen eigen producten maar promoot producten van anderen en krijgt een commissie zodra iemand dat product koopt. 

Affiliate website maken – stappenplan

Als jij de volledige tutorial stap-voor-stap wil kunnen volgen dan heb je de volgende dingen nodig:

Elementor Pro is een betaalde plugin. Je kan ook met de gratis versie werken, maar dan heb je een ander theme nodig. Ik kies voor al mijn sites voor Elementor Pro omdat je hier een theme builder in hebt. Je kan je eigen thema maken. 

Ik heb voorheen verschillende thema’s uitgeprobeerd en er was altijd iets wat me niet aan stond. Dan was de homepage heel mooi, maar het blogoverzicht was totaal niet overzichtelijk. En als dat wel ok was, dan wilde ik liever een andere header of footer.

Elementor pro kost heel weinig en je kan dit allemaal naar je hand zetten zoals je hieronder zal merken. Bovendien kan je er ook popups mee maken waar je anders toch ook een (betaalde) plugin voor nodig hebt. Nu werkt alles mooi samen wat ook zorgt voor een snellere en dus beter vindbare website.

Domeinnaam en hosting

Bestel je domeinnaam. Als je een domeinnaam kiest, kijk dan dat niet enkel de .be naam vrij is. Als de .nl al bezet is en de .be vrij, zou ik de naam niet kopen. Ik koop altijd zowel de .be als de .nl versie van de domeinnnaam. Anders krijg je verwarring met je concullega.

Zelf ben ik recent overgestapt van hostingfirma (het bedrijf waar je de domeinnaam en de ruimte om je website op te zetten koopt). Mijn vorige gaf steeds vaker dalen in bezoekers omdat de verbinding ermee niet altijd even stabiel was. Ik las online nog verhalen van personen die dat voor hadden, dus ik besloot mijn sites over te zetten op Neostrada

Bij de vorige partij was de klantenservice meestal traag. Nu ik overgestapt ben heb ik ook al eens enkele vragen gesteld, en ze hielpen met steeds heel snel verder waardoor de problemen snel gefixt waren.

Vul je domeinnaam in en klik op “check”. Hier controleer je eerst of je domeinnaam nog beschikbaar is.

Als je pas start heb je nog geen webhosting, dus deze koop je samen met je domeinnaam.

Gebruik je een kant-en-klaar websitesysteem zoals Phoenix dan hoef je enkel een domeinnaam aan te kopen. De hosting staat dan bij de firma waar je de website huurt.

Maar wij gaan nu een WordPress website maken, dus bestel je ook hosting mee. Dat is de ruimte waarop je website komt te staan. 

Zodra de betaling rond is, ontvang je een mail dat je domeinnaam geregistreerd is. Bovendien ontvang je een tweede mail met de gegevens over je webhosting. Hierin staan de inloggegevens voor het controlepaneel, genaamd cpanel.

Website maken met WordPress

Nu je alle logingegevens hebt ontvangen kan je je website opzetten. WordPress zet je met enkele klikken al op. Ik kies hier voor WordPress omdat dat één van de meest gebruikte systemen is en dat heeft enkele voordelen. Er blijven jaar in jaar uit steeds updates komen waardoor het systeem steeds mee gaat met zijn tijd. 

Het is een systeem dat de meeste webdesigners, webontwikkelaars of VA’s kennen. Wil je in de toekomst je website liever uitbesteden, dan is dat makkelijk mogelijk. Ook als je een probleem met je website hebt, dan is er altijd wel iemand die er naar kan kijken.

Met de logingegevens die je krijgt, kan je naar cPanel. Dat is een beheeromgeving waarmee je allerlei zaken van je hostingpakket kan instellen en waar je ook makkelijk verschillende apps kan installeren, waaronder ook WordPress.

Ga naar de link die in deze mail staat. Het is je domeinnaam/cpanel

Vul de inloggegevens in.

Onder Software klik je op “Select PHP Version”.

PHP versie wijzigen

Zorg dat deze op de meest recente (hoogste nummer) versie staat.

E-mailadres aanmaken

Je kan een e-mailadres aanmaken speciaal voor je website, bijv. info@jouwsite.be of jouwnaam@jouwsite.be

Deze kan je ook gebruiken om in te loggen en om mensen die je via je site contacteren terug te contacteren. Het komt professioneler over dan als je je gmail of hotmail adres op je site zou zetten.

In cPanel zie je onder de kop Email “Email Accounts”. Klik hier op.

Emailadres aanmaken

Klik op “create” om een nieuwe aan te maken.

Kies je domeinnaam. Kies een username (info, je naam…).

Vul een paswoord in of genereer er eentje.

Emailadres aanmaken instellingen

Klik op “+Create”

WordPress installeren

Onder “Softaculous apps Installer” zal je WordPress vinden. Klik hier op.

Wordpress installeren

Klik op de knop “Install Now”.

Wordpress installeren

Installeer de meest recente versie.

Kies de url waarvoor je WordPress wilt installeren. Zorg ervoor dat je bij het eerste gedeelte https:// selecteert.

Geef je blog een naam en site description.

Kies een gebruikersnaam voor de administrator en ook een veilig paswoord. Vul hier ook het emailadres in dat je net hebt aangemaakt.

Zet de taal op Nederlands

Klik “Advanced options” open. Bij “Automated Backups” kies je voor “Oce a day”

Selecteer ook de optie dat er dagelijks backups gemaakt worden.

Klik op “Install”.

Zodra WordPress geïnstalleerd is, kan je naar je site  (frontend) via je domainnaam.

Als je www.jouwdomeinnaam.be/wp-admin intypt dan kom je in de beheeromgeving (backend). Hier zal je je layout goed zetten, maar ook al je artikels gaan plaatsen.

Updates bijwerken

Zodra je ingelogd bent in WordPress zal er bovenaan komen te staan als er updates zijn. Onder Dashboard – updates vind je de rest van de updates. Dit is ter beveiliging en verbetering van zowel wordpress, de thema’s als de plugins. Deze kan je regelmatig bijwerken zodat het systeem up-to-date blijft.

Wordpress bijwerken

Permalinks aanpassen

Je merkt dat WordPress standaard een pagina heeft aangemaakt en een blogbericht. Als je op dit blogbericht klikt dan zie je in de url jouwdomeinnaam.be/2020/08/25/naam-van-de-blog.

De datum mag verwijderd worden uit de url. Dit gaan we als eerste doen voor wel zelf allerlei blogberichten online gaan zetten. Dan is het meteen ook goed bij je eigen berichten.  

Ga naar instellingen – permalinks.

Standaard staat dit op “Jaar, maand, dag en naam”. Dit wijzig je naar “Berichtnaam”. Klik op “wijzigingen opslaan”.

Permalinks aanpassen in WordPress

Als je nu op het standaard blogbericht klikt, merk je dat de url anders geworden is, zonder de datum.

Maar als je nu naar de oude url zou gaan, krijg je de melding dat deze pagina niet gevonden is.

Plugins installeren

Redirection

Dat gaan we fixen door een plugin te installeren. Het kan nog wel eens voorkomen dat je de naam van je url wilt veranderen. Dan is het handig als de oude url automatisch door linkt naar de nieuwe url.

Ook als je een pagina wilt verwijderen is dit belangrijk. Zo komen mensen niet op een doodlopende pagina terecht, maar kan je hen verder sturen naar een andere relevante pagina.

Ga naar Plugins – nieuwe plugin. Type “redirection” in het zoekvenster. Je ziet de plugin verschijnen. Klik op “nu installeren”. Zodra dat gedaan is klik je op “activeren”.

Ga nu naar de Instellingen van de plugin. Dat kan bij het plugin-overzicht, of je kan in de menubalk aan de linkerkant naar Gereedschap – Redirection.

Redirection plugin

De allereerste keer dat je er gebruik van maakt moet je een wizard doorlopen. 

Klik op “Begin configuratie”.

Bij basisconfiguratie vink je het eerste vakje aan (Bewaak permalink veranderingen in WordPress berichten en pagina’s) 

Klik nu op “Doorgaan met configuratie”. Klik vervolgens op “Installatie afronden”.

Nu de plugin geïnstalleerd is en de instellingen goed staan kan je klikken op “Verwijzigingen”.

Redirection plugin gebruiken

Hier kan je nu een oude url gaan verwijzen naar de nieuwe url

Bij Bron-url zet je de oude url: jouwdomeinnaam.be/2020/08/25/naam-van-de-blog

Bij Doel-url plaats je de nieuwe url: https://jouwdomeinnaam.be/naam-van-de-blog

Klik nu op “Verwijzing toevoegen”.

Antispam

Als je site een tijdje live staat zal je merken dat je allemaal spamreacties binnen begint te krijgen via je reactie formulier. Dit voorkomen we door het installeren van een antispam plugin.

Standaard staat er de plugin “akismet anti-spam”. Deze kan je installeren en er is een gratis en een betaalde versie van, maar hiervoor moet je sowieso een account aanmaken.

Zelf installeer ik meestal “antispam bee”. Zoek de plugin, installeer en activeer deze.

Yoast SEO

Met deze plugin kan je je blogberichten en pagina’s optimaliseren zodat ze goed gevonden kunnen worden in Google.

Zoek de plugin Yoast SEO. Installeer en activeer deze zoals je voorgaand ook met de andere plugins gedaan had.

Bij de blogberichten zal je onderaan de instellingen van de plugin vinden. Je kan nu van een blogbericht de SEO titel (de titel die zichtbaar is in de zoekresultaten) aanpassen. Je kan ook een meta-omschrijving meegeven.

yoast seo plugin installeren
Plugins overzicht welke je zeker moet installeren

Op zich is het niet goed te veel plugins te hebben. Hoe meer plugins je installeert hoe trager je website zal worden. Maar je zal er toch enkele nodig hebben.

  • Yoast SEO: hiermee kan je de instellingen goed zetten voor je SEO zodat je website goed in Google gevonden kan worden.
  • Antispam bee: Als je geen hoop spam op je website wilt dan kan je hiervoor best een antispam installeren. Je zal anders merken dat na verloop van de tijd er heel wat spamreacties via de reactieformulieren bij je blogs zullen binnen komen. Je zou deze reactievelden kunnen uitschakelen, maar het is voor je SEO ook goed dat deze reacties binnen komen, want daardoor zal je blogbericht als waardevoller beschouwd worden. Bovendien is het ook wel leuk om reacties binnen te krijgen. Standaard staat er in de installatie ook de antispam Askimet, maar daar heb je een aparte account voor nodig. Antispam bee kan je gewoon installeren.
  • Redirection: om een (oude) pagina te laten doorlinken naar een nieuwe. Dit is nodig als je de url gewijdigd hebt, of een pagina hebt verwijderd.
  • Google analytics voor WordPress: hiermee kan je je google analyics code op je website zetten en checken hoeveel bezoekers elke pagina krijgt. Zodra de website in grote lijnen klaar is, gaan we dat instellen. Daar komen we een beetje verder nog op terug.
  • Cache plugin: zoals autopstomize of WP Super Cache

Elementor downloaden

Standaard heeft WordPress het meest recente theme ingesteld. Dit kan je wijzigen door een ander theme te kiezen. Kies hier voor een rustig, modern theme Als je een oubollig of heel druk design kiest, zal je website niet zo goed, zelfs minder professioneel overkomen. 

Zelf kies ik tegenwoordig voor het Hello Theme in combinatie met Elementor Pro.

Elementor is een pagebuilder voor WordPress. Bekijk hier ook mijn Elementor review. Je kan er pagina’s mee bouwen zoals je zelf wil. Bij een standaard thema staat het meeste vast. Je kan de tekst en foto en misschien ook een kleur aanpassen. Maar je kan niet de ene rij boven de andere zetten, of bepaalde elementen weg laten. Met een pagebuilder kan je dat volledig opbouwen zoals je zelf wilt.

In deze tutorial toon ik je hoe ik het doe. Ik merk namelijk dat als je een kant-en-klaar theme kiest, er altijd wel iets is wat je liever anders gezien had. Niet de juiste header of footer, het blogoverzicht is onder elkaar en je wilt het liever naast elkaar,… 

Met de pro versie van Elementer heb je de functionaliteit om je eigen thema in elkaar te steken. Het is bovendien heel eenvoudig om te doen. Op deze manier kan je alles naar je eigen hand zetten.

Verder kan je er ook popups mee maken. Meestal moet je daarvoor nog een extra (betalende) plugin installeren. Wat ook weer voor vertraging kan zorgen. Omdat dit allemaal in Elementor zit, werkt dit veel sneller en zal er ook geen dubbele code in je website komen te staan.

Vervolgens kan je inloggen bij Elementor om een zip-bestand te downloaden. Het is hier niet de bedoeling dat je het zip-bestand uitpakt.

Elementor downloaden

Ga in WordPress naar Plugins – Nieuwe plugin

Klik bovenaan op “Plugin uploaden”. Klik op “Bestand kiezen” en selecteer het zip-bestand dat je van Elementor gedownload hebt. Klik op “Nu installeren”. Daarna klik je op “activeren”.

Elementor uploaden

Elementor Pro heeft Elementor als basis nodig. Klik nu op de knop “Install Elementor now”. Klik op “Plugin activeren”.

Elementor installeren

Nu zie je dat Elementor is de menubalk is toegevoegd.

Elementor in de menubalk

Bovenin krijg je de melding dat je Elementor pro nog moet connectoren. Dit is enkel nodig als je de betaalde plugin gebruikt. Klik op de knop “Connect & Activate”.

Elementor pro connecteren

Nu kan je a.h.v. je mailadres een koppeling maken en je licentie activeren.

Elementor pro connecteren en licentie activeren.

Wil je niet met de Pro versie van Elementor werken, maar met de gratis variant dan kan dat. Ik zou je dan wel aanraden een ander theme te kiezen. Hello theme is namelijk een naakt thema. Dat wil zeggen dat het zo gebouwd is met zo weinig mogelijk code of overbodigheden, waardoor het snel is, maar de stijling daarvan doe je via de Pro versie van Elementor. Doe je dat niet, dan zal je site er niet uit zien.

Kies dus ofwel voor Elementor Pro in combinatie met Hello theme ofwel voor de gratis versie van Elementor, in combinatie met een ander gekozen theme.

Thema installeren

Een thema is hoe de layout van je website er uit komt te zien.

Download het Hello theme. Dit is een zip-bestand. NIET uitpakken.

Ga in WordPress naar Weergave – Thema’s.

Daar zie je de standaard thema’s van WordPress. Klik bovenaan op “Nieuwe toevoegen”.

Vervolgens klik je bovenaan op “Thema uploaden”. Klik op “Bestand kiezen” en selecteer het zip-bestand van Hello Theme. Klik op “Installeren” en daarna op “Activeren”

Child theme instaleren

Wat we ook gaan doen is een Child Theme opladen. Dat is een afgeleide van je gekozen theme. Je hoeft dit niet te doen, maar mocht je nu of later wijzigingen willen aanbrengen in het theme (in de code of toegevoegde css) en er komt een update van je thema, dan kan je eigen wijzigingen kwijt zijn. Vandaar dat we het hier al gaan installeren.

Ga naar https://github.com/elementor/hello-theme-child

Klik op “code” en vervolgens op “Download zip”.

Nu doe je net hetzelfde als daarnet bij het installeren van het thema.

Ga naar Weergave – Thema’s

Klik bovenaan op “nieuwe toevoegen”

Klik bovenaan op Thema uploaden.

Klik op “Bestand kiezen” en selecteer de zip die je net gedownload hebt.

Klik op “installeren” en vervolgens op “Activeren”.

Als je nu naar je website gaat kijken, zal je merken dat het helemaal geen mooie layout is. Er is zelfs bijna niks te zien. Maar daar gaan we nu verandering in brengen.

Blog en home pagina aanmaken

We gaan twee pagina’s aanmaken: eentje waarop je blogoverzicht te zien zal zijn en je homepage.

Ga naar Pagina’s – Nieuwe pagina

Geef de eerste als titel “Blog” en klik op “Publiceren”.

Maak ook de tweede pagina aan. Geef deze de titel “Home” en klik op “publiceren”.

WordPress moet nog weten dat die pagina ook daadwerkelijk de homepage is en de andere dat daarop je blogoverzicht moet komen.

Ga naar Weergave – Customizer

Klik op “homepage instellingen”.

Homepage instellingen wordpress

Vink “een statische pagina” aan.

Bij Homepagina, selecteer je de pagina Home die je net hebt aangemaakt. Bij Berichtenpagina selecteer je de pagina Blog.

Homepage en blog instellingen in WordPress

Klik op “publiceren”.

Logo uploaden

In Customize kan je ook je logo opladen. Ga naar Weergave – Customizer

Klik op “Site-identiteit”. Klik vervolgens op “Selecteer logo”. Selecteer het bestand op je computer en laad het op. WordPress raad een afbeelding aan van 350 x 100 pixels.

Als je het logo geselecteerd hebt, geef je het een alt-tekst en omschrijving.

Klik op “selecteren” – Bijsnijden overslaan

logo uploaden wordpress

Menu aanmaken

In het menu gaan we onze homepagina en blog pagina plaatsen. Hier kan je later ook andere pagina’s aan toevoegen zoals over mij, contact, (affiliate) webshop,… of in plaats van het blogoverzicht kan je ook de losse categorieën in je menu zetten.

Ga naar Weergave – Menu

Wordpress menu maken

Standaard staat er “Sample Page”, deze verwijder je.

Menu-item verwijderen

Om extra items aan je menu toe te voegen kan je op Pagina’s, berichten, aangepaste links of categorieën klikken, iets selecteren en klikken op “aan menu toevoegen”

Menu-item toevoegen in WordPress

Klik nu op “Menu aanmaken”.

Met een ander thema zal je menu nu zichtbaar zijn op je website. Met het naakte thema dat wij gebruiken is dit nog niet zichtbaar. Hiervoor gaan we een header aanmaken.

Header aanmaken

Ga naar templates – thema bouwer

Thema bouwer Elementor

Klik op + Add new om een nieuwe template aan te maken. In dit geval gaan we kiezen voor een header.

Header aanmaken met Elementor

Klik op het map-icoontje.

Bibliotheek Elementor openen

De bibliotheek van Elementor zal openen en je krijgt allemaal templates te zien voor de header. Kies een header die jou aan staat. Als niet alles is zoals je wil, geen probleem, je kan het achteraf nog allemaal gaan aanpassen.

Zodra je over jouw gekozen template gaat hangen, verschijnt “invoegen”. Klik daar op.

Template van Elementor invoegen

Door over de layout van de header met je muis te gaan, zullen er verschillende dingen oplichten. Als je klikt op het pennetje dat dan verschijnt, zal je de inhoud en stijl van dat stuk kunnen aanpassen.

Pas de achtergrondkleur, tekstkleur,… aan zoals jij wilt. In de video zie je duidelijk hoe je dat allemaal kan doen.

Layout aanpassen met Elementor

Had je je logo opgeladen dan zal je zien dat dit hier ook verschijnt. Als het formaat niet goed is kan je dat gaan aanpassen. Ga over het logo hangen. Klik op het pennetje. Ga naar “Stijl”. Zet hier de breedte goed.

Breedte logo aanpassen

Als je klaar bent, klik je op “Publiceren”. Nu klik je op “Add condition”. Je kan nu bepalen waar deze template zichtbaar moet worden. Aangezien het hier om een header gaat wil je dat deze over je hele website getoond wordt.

Display conditions

Klik op “Save & close”.

Aanmaken blogbericht

We gaan een eerste blogbericht aanmaken. Dit is handig om te doen voordat we de blogpagina gaan stijlen omdat we dan meteen zien hoe het eruit komt te zien.

Ga naar Berichten – Nieuw bericht

Blogbericht aanmaken

Voordat je begint met schrijven heb je eerst goed zoekwoordonderzoek gedaan zodat je het zoekwoord / de zoekwoordcombinatie goed kunt gebruiken in je blogbericht.

Geef je blogbericht een titel. Hierin staat jouw zoekwoord, maar het moet wel een logische zin blijven. 

Plaats de tekst van je artikel. Heb je dit nog niet geschreven, dan kan je voorlopig even een lang stuk faketekst plaatsen. Zo kan je zo dadelijk toch al de stijling goed zetten.

Zorg dat je artikel ook goede tussentitels heeft. Ga op de tussentitel staan en klik op het paragraaf icoontje. Je kan paragraaf nu wijzigen in “Kop”

Titel maken

Kies de hoofdfoto die je voor dit artikel wilt gebruiken. Je kan zelf foto’s maken of je kan gratis foto’s downloaden.

Voordat je de afbeelding upload geef je deze een relevante naam met daarin ook het zoekwoord waarvoor je wilt scoren.

Om de foto bij je blogbericht te plaatsen, selecteer je “document” (bovenaan rechts). Daar zie je “uitgelichte afbeelding”. Hier kan je de hoofdafbeelding van het artikel gaan uploaden. Deze hoofdafbeelding zal zichtbaar zijn bij het blogbericht, zal de foto zijn die je te zien krijgt bij je blogoverzicht en zal ook de foto zijn die je ziet als je het blogbericht op bijv. Facebook deelt. 

Uitgelichte afbeelding selecteren

Geef deze foto ook een alt-tekst en omschrijving mee.

Uitgelichte afbeelding - alt tekst en omschrijving

We gaan het blogbericht ook in een categorie plaatsen. Zo verzamel je alle artikels van een zelfde thema. Dit is zowel heel overzichtelijk voor je bezoeker als goed voor Google.

Klik aan de rechterzijde op “categrorieën” (dit staat ietsje boven je uitgelichte afbeelding).

Standaard staat daar “Uncategorized”. Dit mag je uitvinken. Klik op “Nieuwe categorie toevoegen”.

Vul de naam in van je categorie en klik op “Nieuwe categorie toevoegen”. Zorg er steeds voor dat er een vinkje staat bij de categorie waarin je net aangemaakte blogbericht valt.

Categorie toevoegen

Als je blogbericht klaar is, klik je op “publiceren”.

Blogoverzicht maken

We gaan nu de layout van het blogoverzicht maken. Standaard staan nu alles onder elkaar wat niet zo overzichtelijk is, dus we gaan dit nu in blokjes in meerdere kolommen plaatsen.

Ga naar templates – thema bouwer

Klik op +add new en kies vervolgens voor “archive”.

Archive - blogoverzicht maken

Je komt nu in de bibliotheek van elementor. Je hebt keuze uit enkele templates om je blogoverzicht te tonen. Ook hier maakt het niet uit als er een stuk is van een template dat je niet zo leuk vind. Dat kan je nadien nog allemaal wijzigen.

Als je er een gekozen hebt, klik je op “invoegen”.

Klik op de het stuk van het blogoverzicht om de inhoud ervan te bewerken. Hier kan je kiezen hoeveel kolommen je wilt hebben. Je kan je afbeeldingen ook hoger of lager maken.

Pas de Read More Text aan zodat dit in het Nederlands komt te staan. Ik heb deze gewijzigd naar “Lees verder >>”

blogoverzicht maken

Klik op “Pagination”.

Standaard staat hier bij “Page Limit” 5. Dat wil zeggen dat enkel de eerste 5 pagina’s getoond worden. Maar als je heel veel blogberichten hebt, wil je deze natuurlijk allemaal tonen. Verwijder daarom het cijfer 5. Verplaats ook het schuivertje achter “Shorten” zodat dit op staat. Dit zorgt ervoor dat als je 20 pagina’s hebt dat er niet nummertje 1 t.e.m. 20 komt te staan maar een verkorte vorm. 1 2 3 …. 20.

pagination instellen

Bij stijl kan je ook allerlei wijzigingen doen zoals de ruimte tussen de kolommen, het lettertype wijzigen, kleuren wijzigen, een schaduw of afgeronde hoeken maken,…

Klik al deze onderdelen eens open en kijk of er dingen zijn die je wilt veranderen.

Klik op “publiceren”.

Klik op “Add condition”.

Hier kies je voor “All Archives”. Wil je de layout per categorie anders hebben, dan kan je hier een specifieke categorie pagina kiezen.

Klik op “save & close”.

Layout blogpagina maken

 Ga naar Templates – Thema bouwer

Klik op + Add new

Kies hier voor “Single post”

single post

De bibliotheek van Elementor opent met templates voor blogpagina’s. Kies er hier eentje uit waarvan je wilt vertrekken.

Daarna kan je net zoals we met het blogoverzicht gedaan had, allerlei dingen gaan wijzigen. Je kan rijen die je niet nodig hebt weg gooien, je kan rijen toevoegen. Je kan ook een tweede keer een template kiezen. Deze zal dan onder de eerste komen te staan. Zo kan je bepaalde dingen van van beide templates behouden die je zelf wilt hebben en al de rest gooi je weg.

Kijk zeker ook even dit stuk in de video.

Per stuk kan je ook de inhoud en layout gaan wijzigen.

Bij de elementen zie je ook de blokjes van elk onderdeel van een blogbericht: Titel, de tekst, uitgelichte afbeelding, reacties,…. Deze staan op een template die je geselecteerd hebt, maar je kan deze elementen ook slepen om het toe te voegen (als je iets verwijderd had bijvoorbeeld of je wil van een blanco pagina vertrekken).

elementen blogbericht

Ik heb gekozen voor een template met zijbalk. Je kan ook een template zonder zijbalk kiezen en een extra kolom toevoegen om een zijbalk te maken.

In deze zijbalk kan je affiliate producten voorzien. Je kan bijvoorbeeld een banner naar een webshop plaatsen of een stukje code om een product dat op bol te tonen.

Related post

Onderaan je blogbericht kan je gerelateerde blogberichten tonen. Hierdoor kunnen mensen langer op je website blijven omdat ze zo andere interessante artikels van je zien. Dit is zowel voor de bezoeker leuk omdat deze zo iets ontdekt, maar ook voor Google goed, want hoe langer iemand blijft hoe beter je website zal scoren.

Als je een template gekozen hebt waar de related posts op staan, dan tonen deze standaard de laatste blogberichten. Dat is al leuk, maar relevanter is dat ze blogberichten tonen die in dezelfde categorie staan als waar men het huidige blogbericht van gelezen had.

Klik op de inhoud van de gerelateerde blogberichten.

Klik Query open

Achter Source staat “Berichten”. Wijzig dit naar “Related”.

Bij “Include By”, kies je voor “Term”. Bij “Term” kies je voor “Categorieën”.

gerelateerde blogberichten

Doe ook eventuele andere wijzigingen aan de template en klik op “publiceren”.

Add condition

Include “Berichten”

Klik op “Save & Close”.

Homepage aanpassen

Ga naar Pagina’s – Alle pagina’s

Klik bij de pagina Home op “bewerken”.

Klik vervolgens bovenaan op “bewerk met Elementor”.

Homepage bewerken met Elementor

Je kan nu elementen op dit blanco blad gaan slepen. Maar het makkelijkst en snelst is om hier ook weer met een template te gaan werken. Klik op het map-icoontje. De bibliotheek van Elementor opent en toont deze keer allemaal pagina’s.

De vorige keren (header, blogoverzicht, blogpaigna) kon je enkel pro templates kiezen, omdat dat allemaal functies zijn voor de pro versie. Bij pagina’s heb je sommige pagina’s die je ook kan gebruiken bij de gratis versie/.

Kies er eentje en klik op “invoegen”.

Bovenaan zie je nog de titel “Home” staan. Deze moet niet getoond worden. Klik daarvoor onderaan links op het icoon van het tandwiel. 

Instellingen template

Bij Pagina layout kan je hier kiezen voor “Elementor volledige breedte”.

Elementor volledige breedte
  • Standaard: toont de titel van de pagina bovenaan.
  • Elementor canvas: geeft je een blanco pagina. Header en footer worden niet getoond. Dit kan je gebruiken bij salespages of optin pagina’s.
  • Elementor volledige breedte: Header en footer worden getoond maar voor de rest vertrek je van een blanco pagina.

Verwijder de rijen of elementen die je niet nodig hebt en voeg er eventueel nog nieuwe toe.

Pas de teksten en foto’s aan. Pas eventueel ook de marges boven- en onder de rijen aan. Dat doe je bij “geavanceerd”.

Marges en padding aanpassen

Affiliate links leggen

In de zijbalk van de website

Ga terug naar Templates – Thema bouwer

Klik op de template van de single post (de layout van je blogberichten).

Klik op Edit.

Template bewerken

In de zijbalk plaats je een banner van de webshop of product dat je wilt promoten.

Bij link staat “Geen”. Pas dit aan naar “Aangepaste url”. Vul hier nu je affiliate link in. Klik achter de link op het tandwiel icoon. Je kan hier aanvinken dat de link in een nieuw venster moet openen.

Affiliate link toevoegen aan een banner

Een andere manier is door een stukje code te plaatsen. Sommige affiliate netwerken geven banners naar de shop of naar specifieke producten in de vorm van code. In die code zit dan al jouw affiliate link. Het kunnen soms ook bewegende banners zijn.

In elk affiliate netwerk werkt dit op een andere manier.

Als voorbeeld neem ik hier tradetracker

De banners vind je bij Promotiemateriaal – Banners

Kies daar de campagne die je wilt promoten en waarvoor je je hebt aangemeld. Er zijn banners beschikbaar in meerdere groottes en vaak ook met een andere tekst of afbeelding.

Affiliate banner maken in Tradetracker

Als je gekozen hebt klik je op “Code genereren”.

Onder die campagne verschijnt dan een stuk html code. Deze code zal er voor zorgen dat de gekozen afbeelding verschijnt, dat er ook een link op de afbeelding zit en dat daarin jouw affiliate code verwerkt is. Je kan eventueel ook een referentie meegeven zodat je weet van waar jouw verkoop afkomstig is.

Affiliate code genereren voor de banner

Kopieer het hele stuk code.

Ga terug naar je website (waar je je bloglayout aan het bewerken bent).

Klik links bovenaan op de negen puntjes zodat je kan kiezen uit alle elementen.

Elementen toevoegen

Zoek het element “html”. Sleep dit naar de plek waar je de banner wilt hebben in je zijbalk.

Aan de linkerkant kan je nu de html-code die je daarnet gekopieerd had plakken.

html code paatsen

Klik op “Bijwerken” (onderaan links)

Kijk hier ook hoe je affiliate van bol.com wordt en daar blokjes met product, prijs, sterren kan aanmaken. Deze code die je dan krijgt kan je op dezelfde manier op je website plaatsen.

Affiliate links in je blogberichten

Banners plaatsen kan je doen, maar hoeft niet per se. Het belangrijkste is om affiliate links te plaatsen in je blogberichten. Je raadt producten aan, doet reviews met de positieve en negatieve eigenschappen van het producten. Daarbij plaats je een link of knop naar het desbetreffende product.

Zorg ervoor dat je een affiliate link hebt. Deze kan je kant-en-klaar worden aangeboden zoals bij Paypro, of je maakt de link naar het gekozen product in bijv. Tradetracker. 

Dan gaan we de link toevoegen in het blogbericht.

Ga naar Berichten – Alle berichten

Klik bij het blogbericht waarvoor je een affiliate link wilt toevegen op “bewerken”.

Selecteer een stukje tekst waarop je een link wilt plaatsen. Klik op het ketting icoon om de link te plakken. Plaats het schuivertje naar rechts zodat de link in een nieuwe tabblad opent. Klik op het pijltje dat achter de url staat. Dit is om de link te bevestigen.

Affiliate link leggen
Knop toevoegen

Ga met je muis tussen de alinea’s waar je de knop wilt toevoegen. Je ziet hier nu een + verschijnen. Klik hier op.

Blok toevoegen in WordPress

Zoek naar de blok “Knoppen” en klik er op.

Knop toevoegen in WordPress

De knop verschijnt nu in je blogbericht. Typ de tekst die je op je knop wilt hebben. Klik op het link icoon om je affiliate link toe te voegen. Zet de schuiver voor “in nieuw tabblad openen” op. Bevestig de link door op het pijltje achter de url te klikken.

Link toevoegen op een knop
Kleur van de knop en link aanpassen

Je kan op de knop in het blogbericht klikken en aan de rechterzijde bij kleurinstellingen de kleur gaan aanpassen. Dit moet je dan bij elke knop opnieuw doen.  Dat gaan we niet doen.

We gaan het algemeen instellen. Ga naar Templates – Thema bouwer

Klik je template van de single post aan. Klik op “bewerken”.

Klik helemaal links bovenaan op de drie streepjes.

Er opent een menu. Klik hier op “Site Settings”.

Bij Site Settings kan je kleuren en lettertypes instellen voor je thema. Zo kan je je titel in een bepaalde kleur zetten en dan is dat overal zo. Ook instellingen voor je afbeeldingen en formuliervelden, …. vind je hier terug.

Site settings elementor

Klik op “Typografie”.

Bij “Link” klik je op het pennetje dat achter “Typografie” staat. Bij Dite kies ik voor “bold”, zo zal de link duidelijker zichtbaar zijn. Bij kleur kies ik een andere kleur. Jij kan de kleur kiezen die je zelf wilt, je hoeft de link ook niet dik te maken. Kies wat bij je website past.

Layout van de ilnk aanpassen

Nu we de kleur van de link gewijzigd hebben, krijg je een probleem. De kleur van de link van de knop is ook gewijzigd en dat is niet de bedoeling. Maar dat gaan we zodadelijk in de code aanpassen.

Kleur link van de knop is fout

Je kan nu wel al je template opslaan door op “bijwerken” te klikken.

Ga in WordPress naar Weergave – Customizer

Klik op “Extra CSS”

Extra css

Plak deze code om de kleur van de knop te wijzigen en de tekst in het wit te tonen.

Wil je een andere knopkleur verander dan de code bij background-color naar de gewenste kleur.

.wp-block-button__link {
    color:#FFFFFF;
	background-color:#32DB3E;
	 font-weight: bold; 
	margin-bottom:15px;
}

.wp-block-button__link a:visited, .wp-block-button__link a{
    color:#FFFFFF;
}

a.wp-block-button__link{
   
	color:rgba(256,256,256,1) 

}
Call-to-action blokje

Je kan een blokje maken met een call-to-action naar een product dat je wilt promoten. Dit blokje kan je in meerdere relevante artikels plakken.

Ga naar Templates – Opgeslagen templates

Kies voor “Nieuwe template”. Selecteer “Section” en geef je template een naam.

Call to action maken

Je kan in de bibliotheek van elementor een blok kiezen waarvan je wilt vertrekken. Je kan in de filter kiezen voor Call to action. Je kan ook beginnen met een blanco blad.

Filter templates

Verander dit blokje zoals je zelf wilt. Je kan een afbeelding toevoegen, de knop van kleur veranderen, tekst toevoegen. Bekijk de video hoe ik onderstaande verandering gemaakt heb.

Layout sectie wijzigen

Als je template van de call-to action klaar is, vind je die terug bij Templates – opgeslagen templates. Bij stortcode zie je een stukje code tussen vierkante haken staan. Dat stuk kan je kopieëren en gaan plakken in je blogbericht op de plaatsen waar jij het blokje wilt zien verschijnen.

Shortcode

Op deze manier kan je meerdere blokjes met een uitgelicht product gaan maken die je dan in blogberichten kan plaatsen.

Nieuwe blogberichten toevoegen

Nu je website klaar staat is het belangrijk om regelmatig nieuwe blogberichten toe te voegen. Daarvoor ga je naar Berichten – Nieuw bericht.

Google analytics instellen

Nu je website klaar is om bezocht te worden, wil je uiteraard ook graag weten hoeveel bezoekers op je pagina’s komen. Daarvoor gaan we Google Analytics instellen.

Ga naar analytics.google.com

Heb je nog geen account, maak er dan eentje aan.

Bij Beheerder kan je je website(s) toevoegen.

Analytics beheerder

Je hebt hier 3 kolommen. De eerste is je account (verzameling van websites). Je kan meerdere accounts hebben. Property is je website of websites. Deze vallen onder een account. In de derde kolom kan je nog instellingen doen voor je property.

Google analytics aanmaken

Klik op “Maak nieuwe account”. Geef deze een naam. Volgende. Klik op “Web”. Volgende.

Dan ga je de property aanmaken. Vul daar de naam van je website in. Als je meerdere websites hebt, dan weet je over welke site het gaat.

Bij Website-URL vul je je url in. Zorg er voor dat het https:// geselecteerd hebt. Kies in welke branche je site actief zal zijn. Kies voor tijdzone voor België of Nederland. Klik op “Maken”. Ga akkoord met de algemene voorwaarden.

Property maken in Analytics

Nu zal je een tracking-id zien staan. Dat is de code waardoor Google weet om welke website het gaat. Deze code begint met UA-

Ga terug naar WordPress – Plugins – Nieuwe plugin

Installeer de plugin Google Analytics Dashboard Plug-in voor WordPress door Monsterinsights. Activeer de plugin.

Monsterinsights installeren

Volg de wizard. Klik daarvoor op “Launch the Wizard”. Kies welke categorie. Voor een affiliate site zal dat waarschijnlijk Publisher (blog) zijn, maar business website kan ook.

Monsterinsights categorie

Klik op Connect Monsterinsights.

Kies je Google account.

Klik op “Toestaan”.

Kies je website. Als de website die je net hebt aangemaakt is de enige url is die in Google Analytics staat, dan is het meteen de juiste. Heb je meerdere websites, dan kan het zijn dat je hier nog de juiste url moet kiezen.

Monsterinsights koppelen met analytics

Klik op “Complete Connection”.

Bewaar. Klik op “Save and continue”.

MonsterInsights recommence WPForms, deze stap mag je overslaan. Klik op “skip this step”.

Klik op Finisch Setup & Exit Wizard.

Nu gaan we checken of de koppeling gelukt is. Open je google analytics in een venster. Open nu een Incognito venster en ga naar je website. We kiezen hier voor een incognitovenster omdat als je ingelogd bent je bezoek aan de website niet geregistreerd wordt.

Als je nu in het venster waar je Google analytics geopend hebt een 1 ziet verschijnen bij “Realtime”, dan weet je dat alles goed werkt.

Google analytics testen

Als je ingelogd bent, zullen je bezoeken niet geregistreerd worden. Maar je wilt sowieso niet dat je eigen bezoeken geregistreerd worden, ook als je niet bent ingelogd op je website. Daarvoor ga je in Google analytics je eigen IP-adres uitsluiten.

Ga in Google Analytics naar beheerder. Klik in de rechtse kolom op “Filters”.

Filters analytics

Klik op “Filter toevoegen”.

Geef deze een naam, bijv. Eigen IP.

Bij Filtertype selecteren kies je voor “Uitsluiten”.

Bij Bron of bestemming selecteren kies je voor “Verkeer van de IP-adressen”.

Bij Expressie selecteren kies je voor “die gelijk zijn aan”.

Vul je IP-adres in en klik op “Opslaan”

Eigen ip-adres uitsluiten van je website

Weet je niet wat je IP-adres is? Ga dan naar de website https://www.watismijnip.be/ of https://www.watismijnipadres.nl/ Het IP adres dat je daar ziet staan is je eigen IP adres. Dat vul je in.

Cache plugin installeren

Dit zorgt voor een verbetering van de snelheid van je website.

Ga naar Plugins – Nieuwe plugin en type cache in het zoekvenster.

WP Rocket is een premium plugin die vaak gebruikt wordt en voor hele goede resultaten zorgt.

Verder zijn ook de gratis plugins W3 total cache, WP Fstests cache WP-optimize, Litespeed cache en WP Super cache veel gebruikt. Kies er hier een uit die je wilt installeren.

In dit voorbeeld installeer en activeer ik WP Super Cache. Klik op “Status bijwerken”.

Ga naar de Instellingen. Zet Caching aan.

Caching aanzetten

Google Search console

Met Google Analytics zie je alle bezoekers die op je website komen. Dat kunnen organische zoekresultaten zijn, maar ook via social media, via een doorverwijzing of via e-mail.

Met Google Search console zie je de organische zoekresultaten. Je kan ook zien hoe vaak jouw site verschenen is in de zoekresultaten.

Sta je op de tiende plek dan zal je merken dat je site wel vaak verschijnt in de zoekresultaten maar dat er nog niet zo vaak doorgeklikt wordt naar je site. Sta je op de eerste plek dan zal je veel meer doorklikt vanuit Google hebben.

Ga naar search.google.com

Klik op “Property toevoegen”.

Google search console

Vul bij URL-voorvoegsel de volledige url in, dus met https. Zonder www.

Klik op “Doorgaan”.

Omdat we deze domeinnaam al met Google Analytics gekoppeld hebben, wordt de domeinnaam in Search console automatisch geverifieerd.

Na een tijdje zal je hier kunnen zien hoe vaak jouw website weergegeven wordt in de zoekresultaten en op welke zoektermen.

Sitemaps instellen

Een sitemap is een overzicht van alle urls van je website. Hiermee kan Google je website beter begrijpen. 

In WordPress klik je in de menubalk links op “SEO”.

Klik op “Functies”. Achter “XML-sitemaps” staat een vraagteken. Klik daar op.

Klik vervolgens op “Bekijk de XML sitemap”.

Sitemaps website doorgeven

Dan zie je enkele sitemaps. Deze gaan we allemaal toevoegen in Search Console.

Sitemaps seo

Selecteer het eindstuk van de url (dus zonder je domeinnaam, alles wat achter de / staat) en kopieer dat.

Klik in Google Search Console op “Sitemaps”.

Bij “Een nieuwe sitemap toevoegen”, plak je dit stuk dat je net gekopieerd had. Klik op “Verzenden”. Klik op “OK”.

Sitemaps instellen in Search Console

Doe dit zo voor elke url die bij de xml-sitemaps staat.

Dus: post-sitemap.xml, page-sitemap.xml, category-sitemap.xml en author-sitemap.xml

Jouw website is klaar

Als je alle stappen gevolgd hebt dan staat jouw website online. Nu kan je verder met het plaatsen van nieuwe blogberichten.

Heeft mijn tutorial om je eigen affiliate website te maken jou geholpen, laat dan zeker een reactie achter. Dat vind ik fijn. Laat me zeker ook even weten van wat je nog graag een tutorial zou zien.

Affiliate website laten maken

Heb je geen zin of tijd om je affiliate website op te zetten, dan kan ik het ook voor je maken. Alles staat dan goed ingesteld en de layout is aangepast. Zo kan jij onmiddellijk starten met het plaatsen van blogberichten.

Share on facebook
Facebook
Share on google
Google+
Share on twitter
Twitter
Share on linkedin
LinkedIn
Share on pinterest
Pinterest
Blijf op de hoogte van nieuwe artikels

2 reacties

  1. Heel erg bedankt om deze uitgebreide maar toch simpele stappen op een rijtje te zetten. Ik ga binnenkort een nieuwe website in WordPress opzetten en kan zo mooi jouw blog ernaast houden! En Elementor ga ik zeker proberen. Ben niet echt van het coderen etc 😉

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *

De laptop lifestyle
In dit boek leer Jacko Meijaard je alles over hoe je je eigen affiliate website kan opzetten. Ook vertelt hij hoe hij ooit begonnen is en heeft opgeschaald naar +10K
De marketing tornado
In dit boek nemen Tonny Loorbach en Martijn Vantongeren je mee door alle stappen om van jouw online business een succes te maken
Ook lezen?
De laptop lifestyle - Jacko Meijaard - Boek review

De laptop lifestyle

Bestel nu het boek van Jacko Meijaard en betaal enkel de verzendkost.