Dit is een oude revisie van het document!
Welkom op mijn blog
Website Movement Key
1. Versiebeheer
| Datum | Versie | Wijziging | Auteur |
|---|---|---|---|
| 22-02-2025 | 0.1 | Initiële versie | Arjan de Wit |
| 04-04-2025 | 1.0 | Definitieve versie | Arjan de Wit |
2. Inleiding
2.1 Doel
Dit document voorziet in de functionele beschrijving van de componenten die gebruikt worden om de website van Movement Key te laten functioneren.
Het verdient de aanbeveling om enige kennis van WordPress te hebben voor het beheer van deze website. Voor een optimaal beheer is kennis van php en css een pré.
2.2 Scope
In dit document staat beschreven welke wensen worden ingevuld met de standaard functionaliteit en welke wensen worden ingevuld met maatwerk plugins.
2.2.1 Klantwens
Movement Key heeft aangegeven een tweetalige website te willen met een Homepagina, en pagina's voor Fysiotherapie, Home Training, Personal Online Training, Topsport en Contact.
3. Functionele beschrijving
3.1 Inleiding
De website van Movement Key draait op het open source platform WordPress. WordPress wordt door ongeveer 29% van de wereldwijde websites gebruikt en beschikt over een bibliotheek van meer dan 45.000 plugins ten behoeve van extra functionaliteit.
De technische vereisten voor het hosting platform zijn:
- PHP 7.4 of hoger
- MySQL 5.7 of hoger OF MariaDB 10.4 of hoger
- HTTPS ondersteuning
Apache of NGinx worden aanbevolen als robuste serverplatformen voor een WordPress omgeving.
Alle, in dit hoofdstuk genoemde plugins zijn terug te vinden in Appendix A met een link naar de officiële website.
3.2 Layout
Voor de website wordt gebruik gemaakt van het commerciële design Flatsome Theme. Flatsome biedt een responsive layout voor weergave op desktop, tablet en mobile. De krachtige UX-Builder zorgt ervoor dat de pagina's volledig naar eigen wens kunnen worden opgebouwd. Hiervoor is geen technische kennis benodigd.
3.2.1 Kleurstelling
De primaire kleuren die op de website gebruikt worden zijn:
Hex: #32c3d6
Hex: #63c459
3.2.2 Lettertype
Er is gekozen voor het lettertype Lato. Dit font zit standaard in het Flatsome theme.
3.3 Prestaties
De website van Movement Key scoort onderstaande prestaties bij de Google Lighthouse metingen.
Desktop:
Mobiel:
3.4 Statistieken
De meeste metingen en rapportages op het gebied van bezoekers gaan via de Burst Statistics plugin. Deze statistieken zijn anoniem en via het dashboard toegankelijk.
De relevante instellingen zijn:
3.5 Zoekmachine optimalisatie
Om de vindbaarheid op het internet te vergroten wordt gebruik gemaakt van plugins die hierbij ondersteunen.
3.5.1 Yoast SEO
De Yoast SEO plugin is een van de populairste plugins om jouw website te optimaliseren voor zoekmachines. De plugin is zo goed als “in basis” geconfigureerd, wat wil zeggen dat er weinig aanpassingen zijn gedaan.
De ingestelde sitefuncties zijn:
- SEO analyse
- Leesbaarheidsanalyse
- Inzichten
- Cornerstone content
- Tekstlinkteller
- Open Graph gegevens
- Twitter kaart gegevens
- Delen op Slack
- Toolbarmenu
- Rest API endpoint
- XML-sitemaps
3.6 Contact formulieren
Voor het maken van contact- en inschrijf formulieren wordt gebruik gemaakt van de plugin ContactForm 7. Een van de meest gebruikte plugins op dit gebied. Op de website is het volgende formulier gedefinieerd:
- Contactformulier
Ten behoeve van het opnemen van contact met Movement Key. Mail gaat naar info@movementkey.nl.
Dit formulier is geplaatst op de contact pagina
Voor het tegenhouden van spam berichten wordt gebruik gemaakt van de gratis plugin Honeypot.
4. Content Management
4.1 Inleiding
Het gaat te ver om een hele handleiding te schrijven. Er zijn via Google ook voldoende tutorials te vinden over hoe je met WordPress en de plugine moet omgaan. Een aantal basis zaken echter, worden wel beschreven in dit hoofdstuk.
4.2 Beheer
4.2.1 Inloggen
Inloggen op de beheersomgeving van de website gaat door naar de url https://www.movementkey.nl/wp-admin te gaan.
Medewerkers die inlog gegevens hebben, kunnen deze hier invullen.
Beheerders kunnen medewerkers toegang geven en van rollen voorzien.
Nieuwe medewerkers krijgen vanuit WordPress een email met het verzoek een wachtwoord in te stellen.
4.2.2 Pagina's
In de beheersomgeving vind je aan de linker zijde een menu. Hierin staan de functionaliteiten die de website bevat, alsmede toegang tot de instellingen van de website en het thema.
In het menu vind je “Pagina's” Onder dit kopje vind je alle pagina's die op de website staan. Het beste kan je de pagina's bewerken met de UX-Builder (onderdeel van het Flatsome theme). Deze editor geeft je heel veel mogelijkheden in het maken van de pagina's. Iedere pagina kan voorzien worden van zogenaamde Meta informatie ten behoeve van zoekmachines. Dit vind je terug onder Yoast SEO.
Via deze link vind je een instructie om een nieuwe pagina aan te maken: https://wordpress.com/support/pages/
Maak je gebruik van de UX-Builder, kijk dan ook hier: https://docs.uxthemes.com/article/186-how-to-use-the-ux-builder
4.2.3 Berichten
In het menu vind je ook “Berichten” Onder dit kopje vind je alle nieuws artikelen die op de website staan. Hiervoor kan gebruik gemaakt worden van de reguliere editor. Ieder bericht kan voorzien worden van zogenaamde Meta informatie ten behoeve van zoekmachines. Dit vind je terug onder Yoast SEO.
Via deze link vind je een instructie om een nieuws artikel toe te voegen: https://wordpress.com/support/posts/
4.2.4 Media
In het menu vind je ook “Media” Onder dit kopje vind je alle afbeeldingen, documenten en videos die door de beeheerder ge-upload zijn.
4.2.5 Flatsome Theme
Flatsome Theme is een commercieel thema dat ontzettend veelzijdig is. Het gaat in deze beschrijving dan ook te ver om alle mogelijkheden uit te leggen.
Het thema voorziet in een goed gedocumenteerde hulp. Deze vind je via deze link: https://docs.uxthemes.com/.
De UX-Builder is het hart van dit thema en biedt de gebruiker eindeloos veel mogelijkheden om de website vorm te geven. Binnen het thema zijn verschillende opties om handmatig code voor styling (zogenaamde css) toe te voegen.
Appendix A - Plugins & Integraties
A1. Plugins
De gebruikte plugins op de website worden hieronder kort beschreven maar verder niet toegelicht. Meer informatie vind je door op de links te klikken.
- Availability datepicker, om datum en tijd in Contact Form 7 te kunnen kiezen
- Burst Statistieken, om inzicht te krijgen in bezoekersaantallen en welke pagina's bezocht worden
- Yoast SEO, voor het optimaliseren van de pagina's en artikelen tbv. zoekmachines
- Complianz, GDRP Cookie consent
- Contact Form 7, voor het maken van formulieren
- HoneyPot, ter voorkoming van veel spm berichten via de formulieren
- Polylang, om het mogelijk te maken de site meertalig te maken
- Really Simple SSL, voor beveiliging van de website
Appendix B - Inloggegevens
LET OP: Deze pagina bevat gevoelige informatie zoals gebruikersnamen en wachtwoorden!
Email:
Server instellingen zijn:
Inkomende mailservser: mail.movementkey.nl
Uitgaande mailserver: mail.movementkey.nl poort 587
- info@movementkey.nl
QZ30Nop6rl
Artikelen met betrekking tot het instellen van de email vind u op:https://www.dmcompusoft.com/whmcs/knowledgebase/1/Email
Webhosting:
De website wordt gehost bij DM Compusoft.
Via deze link kan worden ingelogd op het beheer paneel. Hier vandaan heb je toegang tot het technische gedeelte maar ook tot je account gegevens.
Inlognaam: kirsten03@live.nl
Wachtwoord: Niet bij ons bekend
Voor het meeste beheer is deze omgeving voldoende. Hier kunnen wachtwoorden van email accounts gereset worden etc. Voor meer hulp heeft DM Compusoft een uitgebreide kennisbank.
Voor het technische gedeelte van de website maakt DM Compusoft gebruik van DirectAdmin. De DirectAdmin is te bereiken via deze link:
https://www.movementkey.nl:2222
Inlognaam: m0vmntk3
Wachtwoord: ds#dg8uvR*
Website
Toegang tot de website is beschreven in paragraaf 4.2.1 Inloggen.
Licentie Flatsome Theme:
De licentie van het Flatsome thema is in beheer bij DM Compusoft.
Licentiecode: 9d8dfc7d-9c55-48d8-b43c-1ee53cc05695
Website Stichting Veteranen Texel
1. Versiebeheer
| Datum | Versie | Wijziging | Auteur |
|---|---|---|---|
| 15-07-2024 | 1.0 | Definitieve versie | Arjan de Wit |
2. Inleiding
2.1 Doel
Dit document voorziet in de functionele beschrijving van de componenten die gebruikt worden om de website van de Stichting Veteranen Gemeente Texel, hierna te noemen SVT, te laten functioneren.
Het verdient de aanbeveling om enige kennis van WordPress te hebben voor het beheer van deze website. Voor een optimaal beheer is kennis van php en css een pré.
2.2 Scope
In dit document staat beschreven welke wensen worden ingevuld met de standaard functionaliteit en welke wensen worden ingevuld met maatwerk plugins.
2.2.1 Klantwens
SVT heeft aangegeven een website te willen met een Homepagina, een pagina omtrent het Bestuur en de ANBI, een pagina met artikelen In de media, een pagina voor het tonen van een Agenda en een Contact pagina. Hoewel in offerte 6 - Offerte bouw website Stichting Veteranen Texel van datum 16-02-2024 meer functionaliteiten zijn aangeboden, zijn die functionaliteiten niet geimplementeerd en derhalve in dit document ook niet beschreven.
3. Functionele beschrijving
3.1 Inleiding
De website van de SVT draait op het open source platform WordPress. WordPress wordt door ongeveer 29% van de wereldwijde websites gebruikt en beschikt over een bibliotheek van meer dan 45.000 plugins ten behoeve van extra functionaliteit.
De technische vereisten voor het hosting platform zijn:
- PHP 7.4 of hoger
- MySQL 5.7 of hoger OF MariaDB 10.4 of hoger
- HTTPS ondersteuning
Apache of NGinx worden aanbevolen als robuste serverplatformen voor een WordPress omgeving.
Alle, in dit hoofdstuk genoemde plugins zijn terug te vinden in Appendix A met een link naar de officiële website.
3.2 Layout
Voor de website van SVT wordt gebruik gemaakt van het commerciële design Flatsome Theme. Flatsome biedt een responsive layout voor weergave op desktop, tablet en mobile. De krachtige UX-Builder zorgt ervoor dat de pagina's volledig naar eigen wens kunnen worden opgebouwd. Hiervoor is geen technische kennis benodigd.
3.2.1 Kleurstelling
De primaire kleuren die op de website gebruikt worden zijn:
Hex: #005500
Hex: #56b57f
3.2.2 Lettertype
Er is gekozen voor het lettertype Roboto Slab. Dit font zit standaard in het Flatsome theme.
3.3 Prestaties
De website van SVT scoort onderstaande prestaties bij de Google Lighthouse metingen.
Desktop:
Mobiel:
3.4 Statistieken
De meeste metingen en rapportages op het gebied van bezoekers gaan via de Burst Statistics plugin. Deze statistieken zijn anoniem en via het dashboard toegankelijk.
De relevante instellingen zijn:
3.5 Zoekmachine optimalisatie
Om de vindbaarheid op het internet te vergroten wordt gebruik gemaakt van plugins die hierbij ondersteunen.
3.5.1 Yoast SEO
De Yoast SEO plugin is een van de populairste plugins om jouw website te optimaliseren voor zoekmachines. De plugin is zo goed als “in basis” geconfigureerd, wat wil zeggen dat er weinig aanpassingen zijn gedaan.
De ingestelde sitefuncties zijn:
- SEO analyse
- Leesbaarheidsanalyse
- Inzichten
- Cornerstone content
- Tekstlinkteller
- Open Graph gegevens
- Twitter kaart gegevens
- Delen op Slack
- Toolbarmenu
- Rest API endpoint
- XML-sitemaps
3.6 Contact formulieren
Voor het maken van contact- en inschrijf formulieren wordt gebruik gemaakt van de plugin ContactForm 7. Een van de meest gebruikte plugins op dit gebied. Op de website is het volgende formulier gedefinieerd:
- Contactformulier
Ten behoeve van het opnemen van contact met SVT. Mail gaat naar info@stichtingveteranentexel.nl.
Dit formulier is geplaatst op de contact pagina
Voor het tegenhouden van spam berichten wordt gebruik gemaakt van de gratis plugin Honeypot.
3.7 Events Manager
Deze plugin wordt gebruikt om evenementen te tonen op de website.
Via de diverse submenu's kunnen evenementen, terugkerende evenementen en locaties worden aangemaakt. Indien dit ingesteld wordt (per evenement) kunnen er ook reserveringen gedaan worden.
Het aanmaken van evenementen gechied op dezelfde wijze als het aanmaken van berichten.
4. Content Management
4.1 Inleiding
Het gaat te ver om een hele handleiding te schrijven. Er zijn via Google ook voldoende tutorials te vinden over hoe je met WordPress en de plugine moet omgaan. Een aantal basis zaken echter, worden wel beschreven in dit hoofdstuk.
4.2 Beheer
4.2.1 Inloggen
Inloggen op de beheersomgeving van de website gaat door naar de url https://www.stichtingveteranentexel.nl/wp-admin te gaan.
Medewerkers die inlog gegevens hebben, kunnen deze hier invullen.
Beheerders kunnen medewerkers toegang geven en van rollen voorzien.
Nieuwe medewerkers krijgen vanuit WordPress een email met het verzoek een wachtwoord in te stellen.
4.2.2 Pagina's
In de beheersomgeving vind je aan de linker zijde een menu. Hierin staan de functionaliteiten die de website bevat, alsmede toegang tot de instellingen van de website en het thema.
In het menu vind je “Pagina's” Onder dit kopje vind je alle pagina's die op de website staan. Het beste kan je de pagina's bewerken met de UX-Builder (onderdeel van het Flatsome theme). Deze editor geeft je heel veel mogelijkheden in het maken van de pagina's. Iedere pagina kan voorzien worden van zogenaamde Meta informatie ten behoeve van zoekmachines. Dit vind je terug onder Yoast SEO.
Via deze link vind je een instructie om een nieuwe pagina aan te maken: https://wordpress.com/support/pages/
Maak je gebruik van de UX-Builder, kijk dan ook hier: https://docs.uxthemes.com/article/186-how-to-use-the-ux-builder
4.2.3 Berichten
In het menu vind je ook “Berichten” Onder dit kopje vind je alle nieuws artikelen die op de website staan. Hiervoor kan gebruik gemaakt worden van de reguliere editor. Ieder bericht kan voorzien worden van zogenaamde Meta informatie ten behoeve van zoekmachines. Dit vind je terug onder Yoast SEO.
Via deze link vind je een instructie om een nieuws artikel toe te voegen: https://wordpress.com/support/posts/
4.2.4 Media
In het menu vind je ook “Media” Onder dit kopje vind je alle afbeeldingen, documenten en videos die door de beeheerder ge-upload zijn.
4.2.5 Flatsome Theme
Flatsome Theme is een commercieel thema dat ontzettend veelzijdig is. Het gaat in deze beschrijving dan ook te ver om alle mogelijkheden uit te leggen.
Het thema voorziet in een goed gedocumenteerde hulp. Deze vind je via deze link: https://docs.uxthemes.com/.
De UX-Builder is het hart van dit thema en biedt de gebruiker eindeloos veel mogelijkheden om de website vorm te geven. Binnen het thema zijn verschillende opties om handmatig code voor styling (zogenaamde css) toe te voegen.
4.2.6 In de media
De pagina “In de media” vraagt om wat extra uitleg om deze goed te beheren. De pagina is opgebouwd uit rijen met telkens 3 kolommen. Hoe dit te doen, wordt in de vorige paragraaf uitgelegd.
Iedere kolom heeft een Image box als content block.
In de Image box selecteer je de “korte” afbeelding. Deze dient als kopje om het volledige artikel te kunnen selecteren. Door iets naar onder te scrollen vind je het kopje Links. Hier moet de koppeling naar de pop-up gemaakt worden. De naamgeving die hiervoor gebruikt wordt is de datum van het artikel in YYMMDD.
NB: Vergeet niet deze vooraf van het # symbool te voorzien!
Nu is de afbeelding gemaakt welke op de pagina verschijnt en aanklikbaar is voor detailweergave.
Om de detailweergave in de pop-up te tonen, moet een volgende stap worden gemaakt. Namelijk het koppelen van een Text box waarin de lightbox code geplaatst wordt die de pop-up maakt. Voor de uniformiteit is voor de breedte van de lightbox gekozen voor een percentage van 85%. Dit kan op smartphones leiden tot een wat minder goed leesbare tekst.
Om de pop-up aan te roepen, moet deze van een id voorzien zijn. Dat id moet overeenkomen met het veld Link uit de vorige stap, anders werkt het niet.
NB: In dit geval mag het # symbool NIET gebruikt worden!
Verder moet eigenlijk alleen de link van de “detail” afbeelding geplakt woren in de code. De exacte positie is achter het woordje src= en dan tussen de dubbele accolades. Zie geel gearceerde tekst.
Om de link van een afbeelding te achterhalen, dien je eerst in de zijbalk naar Media > Bibliotheek te gaan. Kies hier de gewenste afbeelding en klik er op.
In het detailvenster aan de rechterkant zie je de link van de afbeelding met daarbij een knop “URL naar klembord kopiëren”. Door eenvvoudig op deze knop te klikken en vervolgens te plakken in de code, creëer je een pop-up naar de juiste afbeelding.
Maak slim gebruik van de kopieer functies van de UX-Builder om de Image box te kopiëren zodat je alleen maar de afbeeldingen hoeft te vervangen.
Appendix A - Plugins & Integraties
A1. Plugins
De gebruikte plugins op de website worden hieronder kort beschreven maar verder niet toegelicht. Meer informatie vind je door op de links te klikken.
- Burst Statistieken, om inzicht te krijgen in bezoekersaantallen en welke pagina's bezocht worden
- Yoast SEO, voor het optimaliseren van de pagina's en artikelen tbv. zoekmachines
- Browser caching by .htaccess, voor het optimaliseren van performance en veiligheid
- Contact Form 7, voor het maken van formulieren
- HoneyPot, ter voorkoming van veel spm berichten via de formulieren
- Events Manager, voor het aanmaken van evenementen
- Really Simple SSL, voor beveiliging van de website
Appendix B - Inloggegevens
LET OP: Deze pagina bevat gevoelige informatie zoals gebruikersnamen en wachtwoorden!
Email:
Server instellingen zijn:
Inkomende mailservser: mail.stichtingveteranentexel.nl
Uitgaande mailserver: mail.stichtingveteranentexel.nl poort 587
- info@stichtingveteranentexel.nl
kXJoK2Fo - voorzitter@stichtingveteranentexel.nl
9afwf5Ba9 - penningmeester@stichtingveteranentexel.nl
ZEmvDi0ozS
Artikelen met betrekking tot het instellen van de email vind u op:https://www.dmcompusoft.com/whmcs/knowledgebase/1/Email
Webhosting:
De website wordt gehost bij DM Compusoft.
Via deze link kan worden ingelogd op het beheer paneel. Hier vandaan heb je toegang tot het technische gedeelte maar ook tot je account gegevens.
De penningmeester heeft via het email adres: penningmeester@stichtingveteranentexel.nl toegang tot deze omgeving. Tevens heeft de secretaris toegang met het email adres: secretaris@stichtingveteranentexel.nl.
Voor het meeste beheer is deze omgeving voldoende. Hier kunnen wachtwoorden van email accounts gereset worden etc. Voor meer hulp heeft DM Compusoft een uitgebreide kennisbank.
Voor het technische gedeelte van de website maakt DM Compusoft gebruik van DirectAdmin. De DirectAdmin is te bereiken via deze link:
https://ww.stichtingveteranentexel.nl:2222
Inlognaam: vet3rntxl
Wachtwoord: spNuS7*j@n
Website
Toegang tot de website is beschreven in paragraaf 4.2.1 Inloggen.
Licentie Flatsome Theme:
De licentie van het Flatsome thema is in beheer bij DM Compusoft.
Licentiecode: d7a9774b-5e83-499f-a388-e722f8f52d17
Banketbakkersroom
Ingrediënten
Aantal personen: 450 gr.
Tijd:
- 65 gram suiker
- 16 gram vanillesuiker
- 3 eidooiers
- 35 gram bloem
- 350 ml melk
Bereiding
- Meng suiker, vanillesuiker en de eidooiers in een kom door elkaar. Voeg ook de bloem toe en roer door tot het helemaal is opgenomen.
- In een pannetje verhit je de melk, zodra het begint te koken draai je het vuur uit. Je ziet dat het begint te koken doordat er dan belletjes aan de rand van de pan ontstaan.
- Voeg een beetje melk toe aan het eimengsel en roer door tot de melk helemaal is opgenomen. Voeg de rest van de melk dan ook in delen toe en roer tot het een egaal mengsel is.
- Giet het mengsel terug in de pan en zet het vuur weer aan. Breng aan de kook terwijl je blijft roeren, neem ook de bodem van de pan goed mee. De room is goed als het de dikte van een dikke vla heeft.
- Giet de room in een schone schaal en dek deze af met folie. Druk de folie aan op de room, zo voorkom je dat er een velletje vormt op je banketbakkersroom.
- Laat even afkoelen en zet dan in de koelkast om helemaal af te koelen. De room dikt dan ook nog verder in.
Cacio e Pepe pasta
Ingrediënten
Aantal personen: 5
Tijd: 35 min.
- Olijfolie
- 120 gr. geraspte Parmezaanse kaas
- 150 gr. geraspte Pecorino Romano
- 320 gr. Spaghetti
- 2 theelepels Zwarte peper
- 50 gr. margarine
- cherry tomaatjes
Bereiding
- Breng een pan met water aan de kook en kook de pasta volgens de verpakking
Giet af en bewaar ongeveer 375 ml. pastawater - verhit de olijfolie en de boter in een hapjespan of wok.
- Voeg nu de peper toe en laat 1 minuut meebakken
- Voeg de pasta toe en ongeveer 180 ml pastawater
- Haal de pan van het vuur en laat ongeveer 5 minuten afkoelen
- Voeg nu de helft van de kaas geleidelijk toe.
Roer met een grote lepel om zeker te zijndat alle pasta wordt bedekt door kaas - Voeg nog 80 ml. pastawater en de rest van de kaas toe.
Blijf roeren tot de pasta overal bedekt is - Voeg nog een paar eetlepels pastawater toe als de pasta aan lekaar begint te plakken.
- Voeg eventueel extra peper en zout toe naar smaak.
- Voeg eventueel cherry tomaatjes toe
Serveertip: serveer op een bedje van rucola sla en olijfjes en komkommer als bijgerecht
Website Stichting Veteranen Gemeente Dronten
1. Versiebeheer
| Datum | Versie | Wijziging | Auteur |
|---|---|---|---|
| 06-02-2024 | 0.1 | initiële versie | Arjan de Wit |
| 08-02-2024 | 0.5 | ter review | Arjan de Wit |
2. Inleiding
2.1 Doel
Dit document voorziet in de functionele beschrijving van de componenten die gebruikt worden om de website van de Stichting Veteranen Gemeente Dronten, hierna te noemen SVGD, te laten functioneren.
Het verdient de aanbeveling om engie kennis van WordPress te hebben voor het beheer vcan deze website. Voor een optimaal beheer is kennis van php en css een pré.
2.2 Scope
In dit document staat beschreven welke wensen worden ingevuld met de standaard functionaliteit en welke wensen worden ingevuld met maatwerk plugins.
3. Functionele beschrijving
3.1 Inleiding
De website van de SVGD draait op het open source platform WordPress. WordPress wordt door ongeveer 29% van de wereldwijde websites gebruikt en beschikt over een bibliotheek van meer dan 45.000 pulgins ten behoeve van extra functionaliteit.
De technische vereisten voor het hosting platform zijn:
- PHP 7.4 of hoger
- MySQL 5.7 of hoger OF MariaDB 10.4 of hoger
- HTTPS ondersteuning
Apache of NGinx worden aanbevolen als robuste serverplatformen voor een WordPress omgeving.
Alle, in dit hoofdstuk genoemde plugins zijn terug te vinden in Appendix A met een link naar de officiële website.
3.2 Layout
Voor de website van SVGD wordt gebruik gemaakt van het commerciële design Flatsome Theme. Flatsome biedt een responsive layout voor weergave op desktop, tablet en mobile. De krachtige UX-Builder zorgt ervoor dat de pagina's volledig naar eigen wens kunnen worden opgebouwd. Hiervoor is geen technische kennis benodigd.
3.2.1 Kleurstelling
De primaire kleuren die op de website gebruikt worden zijn:
Hex: #0272a7
Hex: #74af26
3.2.2 Lettertype
Er is gekozen voor het lettertype Rijksoverheid. Dit is een True Type Font. Om dit lettertype te kunnen gebruiken is op de website de plugin Use Any Font geïnstalleerd.
De gebruikte api key is:
dbcc7c9686833495e70fc7d1d9e2451d
3.3 Optimalisatie
Om de website van de SVGD zo soepel mogelijk te laten functioneren en een zo snel mogelijke gebruikerservaring te creëren wordt gebruik gemaakt van diverse plugins.
3.3.1 Autoptimize
Autoptimize is een plugin die de stylesheet en javascript elementen van de website kan comprimeren. De geactiveerde instellingen zijn hieronder weergegeven:
3.3.2 KeyCDN Cache Enabler
KeyCDN Cache Enabler zorgt ervoor dat de pagina's vlotter geladen worden doordat ze in een cache opgeslagen worden. Inonderstaande afbeelding staan de geactiveerde opties weergegeven. Voor wat betreft de bericht ID's gaat het hier om enkele berichten die uitgezonderd zijn. Deze worden verder niet nader beschreven.
3.3.3 KeyCDN CDN Enabler
Naast het gebruik van de KeyCDN Cache Enabler voor het lokaal opslaan van de webpagina's maakt de website van de SVGD ook gebruik van de commerciële mogelijkheid van het Content Delivery Network van KeyCDN.
DM Compusoft heeft een account bij KeyCDN waarop de website van SVGD kan meeliften. Derhalve wordt de api key niet gedeeld in dit document.
3.3.4 GT Metrix prestaties
De eerder genoemde plugins leiden ertoe dat de website van SVDG onderstaande prestaties scoort bij GT Metrix.
3.4 Statistieken
De statstieken worden op 2 plaatsen gemeten
3.4.1 Google Analytics
De statistieken worden in een Google Analytcs dashboard bijgehouden. De entiteit hiervan is onderdeel van het account van De Wit Online. Om deze koppeling tot stand te brengen wordt gebruik gemaakt van de CAOS plugin. Onderstaand de relevante instellingen:
3.4.2 Burst Statistics
De meeste metingen en rapportages op het gebied van bezoekers gaan via de Burst Statistics plugin. Deze statistieken zijn anoniem en via het dashboard toegankelijk.
De relevante instellingen zijn:
3.5 Zoekmachine optimalisatie
Om de vindbaarheid op het internet te vergroten wordt gebruik gemaakt van plugins die hierbij ondersteunen.
3.5.1 Yoast SEO
De Yoast SEO plugin is een van de populairste plugins om jouw website te optimaliseren voor zoekmachines. De plugin is zo goed als “in basis” geconfigureerd, wat wil zeggen dat er weinig aanpassingen zijn gedaan.
De ingestelde sitefuncties zijn:
- SEO analyse
- Leesbaarheidsanalyse
- Inzichten
- Cornerstone content
- Tekstlinkteller
- Open Graph gegevens
- Twitter kaart gegevens
- Delen op Slack
- Toolbarmenu
- Rest APO endpoint
- XML-sitemaps
3.5.2 Browser caching
Om ervoor te zorgen dat afbeeldingen en teksten bij een volgend bezoek sneller geladen worden, is de plugin Browser caching with .htaccess geïnstalleerd. In verband met afgeschermde pagina's en eerdere caching mogelijkheden, is voor de specifieke expression ExpiresByType text/html de instelling “access plus 0 seconds” gedaan. De overige instellingen staan allemaal op 1 maand.
3.6 Contact formulieren
Voor het maken van contact- en inschrijf formulieren wordt gebruik gemaakt van de plugin ContacForm 7. Een van de meest gebruikte plugins op dit gebied. Op de website zijn de volgende formulieren gedefinieerd:
- Contactformulier
Ten behoeve van het opnemen van contact met SVGD. Mail gaat naar info@veteranengemeentedronten.nl, webmaster@veteranengemeentedronten.nl.
Dit formulier is geplaatst op de contact pagina - Lief en Leed
Ten behoeve van het melden van lief en leed berichten. Mail gaat naar liefleed@veteranengemeentedronten.nl, webmaster@veteranengemeentedronten.nl
Dit formulier is geplaatst op de pagina Lief en Leed - Diverse “solicitatie” formulieren
Deze formulieren staan allen op de vacature pagina en de mail gaat naar webmaster@veternengemeentedronten.nl- Kascontrole
- Educatie
- Horeca
- Penningmeester
- Open-Sollicitatie
- Veteranendag
Ten behoeve van inschrijvingen voor de lokale veteranendag. Mail gaat naar webmaster@veteranengemeentedronten.nl
Voor het tegenhouden van spam berichten wordt gebruik gemaakt van het reCAPTCHA 3 protocol. De spamcontrole vindt plaats via het Google reCAPTCHA account van DM Compusoft.
Tevens is de gratis plugin Honeypot geinstalleerd die ook al veel spam berichten moet afvangen. Om een backup van de verzonden berichten te hebben, gebruikt de website de Flamingo plugin. Deze slaat in de database de verzonden formulieren op. Spam berichten worden ook opgeslagen en automatisch na 30 dagen verwijderd.
3.7 Nieuwsbrieven
Om de leden te informeren wordt er gebruik gemaakt van de commerciële plugin thenewsletterplugin. Er is voor de pro versie gekozen omdat deze meer functionaliteiten biedt dan de gratis versie. Via de Addon Manager zijn de aanvullende plugins geïnstelleerd:
- WP Users integration
Voor koppeling met de WordPress gebruikers (ledenbestand) - Contact Form 7 Connect
Om velden uit de contact corm 7 plugin te koppelen aan velden van de nieuwsbrieven plugin - Form Designer
- Locked Content
Om delen van de publieke site af te schermen welke leesbaar worden na het inschrijven op de nieuwsbrief. (toegepast op het Berichten artikel over Marco Boerendonck) - Extended Composer Blocks
Voor een veelzijdiger opmaak van de nieuwsbrieven - Events Manager
Voor het toevoegen van evenementen aan de nieuwsbrief - Geolocation
Bepaalt de abonnees op basis van hun ocatie waar een re-target op kan plaatsvinden - Reports and retargeting
Geeft gedetaileerde inzichten in het lees- en klikgedrag van de abonnees - Brevo
Gratis koppeling met mail delivery service van Brevo.
De benodigde licentie moet jaarlijks vernieuwd worden.
3.8 Events Manager
Deze commerciële plugin wordt gebruikt om evenementen te tonen op de website.
Via de diverse submenu's kunnen evenementen, terugkerende evenementen en locaties worden aangemaakt. Indien dit ingesteld wordt (per evenement) kunnen er ook reserveringen gedaan worden.
In combinatie met WooCommerce kunnen betalingen afgehandeld worden voor evnementen en kunnen tickets worden gegenereerd. De pro versie voorziet in de genoemde features en de bijbehorende licentie moet jaarlijks vernieuwd worden.
3.9 WP-Members
De website is voorzien van een afgeschermd deel voor de leden. Dit wordt mogelijk gemaakt door deze plugin. Inschrijven gaat middels de registratie pagina. Hier vindt eerst een verificatie bij het NLVi plaats, waarna men zich kan inschrijven. Het inschrijfproces en authorisatieproces verloopt verder geautomatiseerd.
Deze plugin voorziet ook in de mogelijkheid om Lidmaatschappen aan te maken. Gebruikers een bepaald lidmaatschap hebben, krijgen zo extra rechten. Bijvoorbeeld de mogelijkheid om je eigen certificaat van de veteranencoin uit te printen.
3.10 Overige plugins
Er zijn nog een groot aantal aanvullende plugins. Deze zullen kort met naam en functionaliteit benoemd worden maar niet uitgebreid beschreven
- Yop Poll; om polls te plaatsen op de website
- E2Pdf; voor het genereren van certificaten
- Woocommerce; voor betaalde producten en evenementen
- Autoptimize cache settings; voor het automatisch legen van dit cache-file
- Login as user; om als beheerder onder het account van een lid in te loggen
- User Role Editor; Om diverse rollen aan te maken binnen de WorPress omgeving
- ShortPixel; voor het online comprimeren van afbeeldingen (via betaald accout van DM Compusoft)
- Really Simple SSL; voor het voorzien van veilige content in combinatie met het SSL certificaat van de hosting provider
- Complianz; om te voldoen aan de AVG
- Optimaliseer Database; voor het schoonhouden en optimaliseren van de WordPress database
- Loco Translate; om plugins te vertaen naar het Nederlands waar nodig
4. Content Management
4.1 Inleiding
Het gaat te ver om een hele handleiding te schrijven. Er zijn via Google ook voldoende tutorials te vinden over hoe je met WordPress en de plugine moet omgaan. Een aantal basis zaken echter, worden wel beschreven in dit hoofdstuk.
4.2 Beheer
4.2.1 Inloggen
Inloggen op de beheersomgeving van de website gaat door naar de url https://www.veteranengemeentedronten.nl/wp-admin te gaan.
Medewerkers die inlog gegevens hebben, kunnen deze hier invullen.
4.2.2 Pagina's
In de beheersomgeving vind je aan de linker zijde een menu. Hierin staan de functionaliteiten die de website bevat, alsmede toegang tot de instellingen van de website en het thema.
In het menu vind je “Pagina's” Onder dit kopje vind je alle pagina's die op de website staan. Het beste kan je de pagina's bewerken met de UX-Builder (onderdeel van het Flatsome theme). Deze editor geeft je heel veel mogelijkheden in het maken van de pagina's. Iedere pagina kan voorzien worden van zogenaamde Meta informatie ten behoeve van zoekmachines. Dit vind je terug onder Yoast SEO.
Via deze link vind je een instructie om een nieuwe pagina aan te maken: https://wordpress.com/support/pages/
Maak je gebruik van de UX-Builder, kijk dan ook hier: https://docs.uxthemes.com/article/186-how-to-use-the-ux-builder
4.2.3 Berichten
In het menu vind je ook “Berichten” Onder dit kopje vind je alle nieuws artikelen die op de website staan. Hiervoor kan gebruik gemaakt worden van de reguliere editor. Ieder bericht kan voorzien worden van zogenaamde Meta informatie ten behoeve van zoekmachines. Dit vind je terug onder Yoast SEO.
Via deze link vind je een instructie om een nieuws artikel toe te voegen: https://wordpress.com/support/posts/
4.2.4 Media
In het menu vind je ook “Media” Onder dit kopje vind je alle afbeeldingen, documenten en videos die door de beeheerder ge-upload zijn.
4.2.4 Flatsome Theme
Flatsome Theme is een commercieel thema dat ontzettend veelzijdig is. Het gaat in deze beschrijving dan ook te ver om alle mogelijkheden uit te leggen.
Het thema voorziet in een goed gedocumenteerde hulp. Deze vind je via deze link: https://docs.uxthemes.com/.
De UX-Builder is het hart van dit thema en biedt de gebruiker eindeloos veel mogelijkheden om de website vorm te geven. Binnen het thema zijn verschillende opties om handmatig code voor styling (zogenaamde css) toe te voegen.
Appendix A - Plugins & Integraties
A1. Plugins
A2. Integraties
Nederlands Veteraneninstituut
Moederbedrijf van DM Compusoft, De Wit Online, heeft bij het Nederlands Veteraneninstituut een gratis toegangscode voor de api met de veteranen database aangevraagd. Hierdoor is het mogelijk om te verifieren of iemand ook veteraan is. Deze verificatie vindt plaats op basis van registratienummer en postcode.
DM Compusoft is esgewenst bereid kosteloos te ondersteunen bij dit script. Het basis script kan hier worden gedownload en de code dient in de functions.php van het thema geplaatst te worden.
Appendix B - Inloggegevens
Belangrijke inlog gegevens
Brevo:
Account: webmaster@veteranengemeentedronten.nl
password: V8^#bQLg$a