Crashcourse websites maken in WordPress voor Sabbattini opleidingen.

1. 21/05/2020 – Sabbattini opleidingen
Crashcourse WordPress

2. evelien@ilikemedia.be
www.linkedin.com/in/
Evelienstandaert
slideshare.net/
ilikemedia
HALLO, IK BEN EVELIEN!

3. WOLFRAM
KRISTOF
ELIEN
PIETER
EVELIEN
CHRISTOPHE
JOB
I LIKE MEDIA: COLLECTIEF VAN FREELANCE
TRAINERS MET PASSIE VOOR DIGITALE MEDIA
BRECHT

4. WIE BEN JIJ?

5. Websites

6. Do you even need a website?!
• Facebook is van Mark Zuckerberg
• Mensen zoeken in Google
• Online visitekaartje - betrouwbaarheid
• Je bepaalt zelf wat er op je website terecht komt
• Je kan bijhouden wie er op je site komt en waarom

7. VROEGER WAS ALLES HTML

8. TEGENWOORDIG WERK JE MET EEN ‘CMS’

9. Wat heb je nodig voor een website?
• Software – CMS-programma of coderen  WordPress,
sitebuilder van je hosting, Squarespace, Wix, …
= bouwmateriaal van je website
• Hosting: gratis op wordpress.com (maar aantal nadelen!) of
zelf huren (Combell, Serve10, One.com, …)
= stuk bouwgrond
• Domeinnaam: gratis mijnwebsite.wordpress.com
OF laten doorverwijzen naar aangekochte domeinnaam via
hostingdashboard
= adres van je website

10. Wat heb je nodig voor een website?

11. WordPress

12. WordPress
● Platform
● Oorspronkelijk: meest populaire manier om blogs te maken
Nu: volledige websites via WordPress
● Eenvoudig in gebruik en veel mogelijkheden
● Info groeperen in thema, pagina’s, berichten, media,…
 jouw bezoekers krijgen die te zien wanneer ze naar je
website surfen
● Eigenlijk een website die al af is en je naar hartelust kan
invullen en aanpassen

13. Voordelen van WordPress
● Je kan gratis starten
● Gemakkelijk in gebruik
● Zelf controle over je website - de structuur is er en hoef je zelf
niet te maken, je kan je volledig focussen op de inhoud
● SEO
● WordPress Helpdesk & community

14. WordPress.com vs. WordPress.org
Wordpress.com Wordpress.org
Kosten - Software is gratis
- Hosting is gratis op WP
- Eventuele extra’s
betalen
- Software is gratis
- Hosting betalend (niet WP)
- Domeinnaam betalend
Kennis Minimaal - Enige technische kennis
nodig maar veel tutorials
Installatie Meteen aanmelden en
starten
- Domein registreren
- Hosting registreren
- Wordpress installeren

15. WordPress.com vs. WordPress.org
Wordpress.com Wordpress.org
Domeinnaam - Basis:
mijnsite.wordpress.com
- Betalend: www.mijnsite.be
- Altijd betalend:
www.mijnsite.be
Thema Beperkt aantal om uit te
kiezen (gratis of betalend)
Onbeperkt aanbod aan
thema’s
Plugin Niet mogelijk Onbeperkt
Beveiliging,
updates, back-ups
automatisch Zelf te regelen (o.a. met
plugins)

16. WordPress.com vs. WordPress.org
Wordpress.com Wordpress.org
Advertenties
op je site
Wordpress plaatst
automatisch advertenties op je
site (kan weg tegen betaling)
Jij bepaalt wat er op je website
terecht komt
Webshop - Heel beperkt
- Duur
- Jij beslist hoe het eruit ziet
- Veel (gratis) plugins voor
Eigendom NIET VAN JOU!! Site is van jou

17. Hoe werkt WordPress?
● Installatie
● Structuur: Pagina’s – Berichten - Menu
● Thema’s en builders
● Widgets en Plugins

18. Waar installeren?
• Lokaal  op je computer vanaf Wordpress.org
+ Je hebt een extra programma nodig: Mamp
Zie filmpje:
https://www.youtube.com/watch?v=HlTiSui0DAY

19. Waar installeren?
Op je hosting  meestal: one-click installation
Indien niet: contact opnemen met de host

20. Aanmelden in back-office dashboard
https://mijnwebsite.be/wp-admin

21. Gebruikers
● Wie kan wat doen?
○ VOLGER - Iemand die jouw website volgt, updates in de
mailbox krijgt en geen gegevens moet ingeven (naam, e-
mail,...) wanneer hij een reactie op je berichten plaatst
○ SCHRIJVER - Kan berichten zonder media schrijven (maar
niet publiceren) en zijn eigen profiel bewerken
○ AUTEUR - Kan enkel zijn eigen berichten en media
toevoegen en aanpassen en zijn eigen profiel bewerken
○ REDACTEUR - Kan berichten, media, pagina’s, categorieën
en tags aanmaken, bewerken en verwijderen. Hij kan
reacties (in het tabje reacties) goedkeuren, afkeuren,
verwijderen. Hij kan zijn eigen profiel aanpassen, maar
niets veranderen aan de weergave en andere gebruikers
○ BEHEERDER - Kan alles doen (er is minstens 1 en standaard
de persoon die de website heeft aangemaakt)

22. Hoe werkt WordPress?
● Installatie
● Structuur: Pagina’s – Berichten - Menu
● Thema’s en builders
● Widgets en Plugins

23. Pagina’s
● Pagina’s zijn bedoeld voor inhoud die niet vaak verandert
(bijvoorbeeld ‘Over Ons’, ‘Contact’, …)
● Pagina’s bevatten tijdloze informatie
● Deze pagina’s kan je aan het menu van je website toevoegen
of net niet

24. Pagina’s
● Geef je pagina een titel (= H1)
● Permalink (URL zoals hij in de zoekbalk zal verschijnen)
● Typ je tekst - Via de knoppen kan je jouw tekst opmaken (WYSIWYG)
● Publiceren (Verschillende opties)
● Pagina-attributen (Hoofd en subpagina’s - Volgorde indien je je
pagina’s niet alfabetisch wil laten weergeven)
● Uitgelichte afbeelding (niet bij elk thema zichtbaar)

25. Berichten/Posts
● Blogstijl
● Vergelijkbaar met nieuwsberichten voor een krant of
columns voor een tijdschrift
● Korte of langere artikels die je website levendig en up to
date houden
● Worden in maandelijkse archieven bewaard en krijgen
doorgaans 1 categorie en verschillende tags

26. Nieuw bericht
● Geef je bericht een titel
● Permalink (URL zoals hij in de zoekbalk zal verschijnen)
● Media toevoegen in bericht
● Typ je tekst - Via de knoppen tekst opmaken
● Publiceren (Verschillende opties - concept I datum I publicatie)
● Categorieën - Tags
● Uitgelichte afbeelding (afbeelding boven titel en tekst)
● Delen (mensen de mogelijkheid geven artikel te delen I liken)
● Postformaat (standaard = alle mogelijkheden)
● Meer opties (locatie, reacties toelaten,...)

27. Media
Voor al je afbeeldingen, video, geluidsfragmenten, PDF’s, …
● Titel en URL
● Onderschrift: wordt getoond door sommige thema’s
● Alt Tekst: wordt getoond voor zoekmachines en wanneer
afbeelding niet beschikbaar is
● Beschrijving: wordt getoond door sommige thema’s
● Uitlijning: links - gecentreerd - rechts
● Wijzig naar waar je media doorlinkt (bestand, pagina, URL)
● Afmeting
● Invoegen in bericht - Je afbeelding staat dan in je bericht
○ Door erop te klikken, kan je de afbeelding verkleinen of
vergroten door de vierkantjes rond de foto te verslepen
○ Ook kan je de uitlijning wijzigen en de afbeelding bewerken
of verwijderen

28. Berichten: categorieën
● WordPress-berichten kunnen tot een categorie behoren
● Categorie = hoofdonderwerp
● Zo kunnen jouw bezoekers gemakkelijk alle artikels binnen een
bepaalde categorie bekijken = overzichtelijk
● Verplicht 1 te hebben in WordPress
● Standaard staat ‘geen categorie’ aangeduid

29. Berichten: tags
● Tags kan je zelf naar hartelust aanmaken
● Onderwerpen, plaatsnamen, namen van belangrijke personen,
keywords…
● Door tags aan je berichten te geven, worden je blogberichten
gemakkelijker gevonden in zoekmachines als Google
● Door tags worden je blogberichten ook gemakkelijker gevonden
wanneer iemand gebruikmaakt van de zoekfunctie op je
website

30. Menu’s
● Om ervoor te zorgen dat je menu zichtbaar is, moet je elk menu
aan een locatie toewijzen (de beschikbare locaties zijn
afhankelijk van het thema dat je gebruikt)
● Het primaire menu is altijd datgene wat bovenaan staat
● Wil je automatisch elke pagina die je vanaf nu aanmaakt, in je
menu zien staan? Klik dan op ‘automatisch hoofdniveau-
pagina’s aan dit menu toevoegen’. Subpagina’s zullen dus niet
automatisch toegevoegd worden
● Volgorde  slepen
● Om een submenu-item te maken, sleep je dat onderdeel in de
rechterkolom iets meer naar rechts.

31. Hoe werkt WordPress?
● Installatie
● Structuur: Pagina’s – Berichten - Menu
● Thema’s en builders
● Widgets en plugins

32. Thema’s
● Je thema bepaalt het volledige uitzicht van je website

33. Thema’s
● Gratis versus betalend (naar eigen keuze en wensen)
● Waar moet je op letten?
○ Responsive
○ Rating (actieve installaties, positieve beoordelingen)
○ Opties
○ Opgelet! Bij ‘Weergave’ - ‘Mobiel’ altijd mobiel thema
aanzetten
● Je kan van elk thema een voorvertoning krijgen om een beter
zicht te hebben op het uiterlijk van dat thema
● Klik je op ‘uitproberen en aanpassen’, dan zie je de Customizer

34. Customizer
● Via ‘Thema’s’ - ‘Customizer’ of per thema ‘Uitproberen en aanpassen’
● Ook hier kan je nog ontzettend veel aanpassingen maken aan je
website + soms thema-specifieke opties!

35. Customizer

36. Wordpress Builders
Laten je toe om je eigen thema samen te stellen aan de hand van
elementen.
Enkele voorbeelden:
Divi Builder by Elegant Themes

37. Wordpress Builders
Beaver Builder

38. Wordpress Builders
Elementor

39. Hoe werkt WordPress?
● Installatie
● Structuur: Pagina’s – Berichten - Menu
● Thema’s en builders
● Widgets en Plugins

40. Widgets
● Toegankelijk via Appearance > Widgets
● Extra mogelijkheid die je aan je website kan toevoegen in
zijbalken of footers
vb. een zoekbalk in de sidebar, een overzicht van de laatste
blogposts, de Twitter-tijdslijn van jouw organisatie/merk, een
afbeelding,...
● Sommige thema’s hebben enkel een sidebar om widgets in te
plaatsen, bij andere thema’s kan je ook widgets plaatsen in een
extra linker, rechter, boven, onder-zijbalk of een (of meerdere)
footer(s)
● je sleept je gewenste widget telkens in een widgetlocatie naar
keuze

41. Widgets

42. Plugins
Mini-programma’tjes die extra functionaliteiten aan je website
toevoegen
Nodig voor bvb veiligheid, updates, google analytics, SEO, …
Toevoegen vanuit Plugins > Add new

43. Aanraders
• ManageWP: beheer van meerdere sites: o.a. back-ups & updates
UpdraftPlus, Back-Up Buddy: updates
• Loginizer: tegen bruteforce attacks
Wordfence Security: Antivirus, e-mailmeldingen bij aanmelden
Google Authenticator: 2-step authentication
• Yoast SEO
• MonsterInsights of Yoast Google Analytics: Google Analytics
• W3 Total Cache: snelheid om je website te laden
• Cookie Notice: geeft een pop-up waarmee je je bezoekers laat
weten dat je cookies gebruikt

44. Onderhoud van je website
• Updates: verbeteringen, security issues, snelheid verbetert
 Zowel van Wordpress, thema als plugins en widgets

45. http://test.evelienstandaert.be/wp-admin
Username: Sabbattini
Wachtwoord: SabbattiniTest1

46. Een goede website

47. ● Structuur van je website is het allerbelangrijkst
● Wat moet op je website staan?
● Maak eerst een sitemap = diagram van die structuur
● Alle pagina’s + onderlinge links
Structuur

48. WIE IS JE LEZER?

49. Zender Boodschap Ontvanger
HET COMMUNICATIESCHEMA

50. Menustructuur uitwerken
• Home
• Over ons
• Wat we doen:
Overzicht? Lijstje? Portfolio?
• Contact
• Blog?
• Andere?
 Voeg alle pagina’s toe, pas daarna kan je
beslissen welke pagina’s in je menu komen

51. Wat moet er op je HOMEpagina staan?
Homepage is vooral uitnodigend
• Foto van product/team & zachte “salespitch”
• Links naar belangrijkste pagina’s of info,
eventueel met foto’s
• Contactgegevens
• Wat wil je dat ze doen op je site? CTA!
• Referenties

52. Belangrijk bij websites
● Gebruiksvriendelijkheid
● Snelheid
● Responsiveness
● In elke browser
hetzelfde resultaat

53. GDPR?!
Voor je website:
 Privacy Statement
 Cookiemelding (plugin)
 Bij alle formulieren waar mensen gegevens
invullen verwijzen naar privacy statement

54. Practice makes perfect

55. SUCCES!
Stuur je vragen naar
evelien@ilikemedia.be
Deze presentatie vind je ook op
www.slideshare.net/ilikemedia
Abonneer je op onze nieuwsbrief
www.ilikemedia.be/nieuwsbrief
Volg ons op Facebook
www.facebook.com/ilikemedia.be