CMS - JensBerckmans/IT-Landscape GitHub Wiki

1) Wat is WordPress?

WordPress is veruit het populairste ‘Content Management Systeem’ (CMS). Zo'n CMS zorgt ervoor dat je makkelijk je eigen website bouwt. Het is een hulpmiddel dat je helpt om inhoud op je website te beheren en te maken.

WordPress werkt met een handig controlepaneel, van waaruit je alles controleert. Je kan dus alles in je browser regelen, en hoeft geen extra software te downloaden.

1.1) Waarom heb ik WordPress als mijn CMS gekozen?

Ik heb dit gekozen omdat dit de populairste is dat je vind op het internet en dus waarschijnlijk ook 1 van de beste en doordat dit 1 van de bekendste is kan je hier ook veel van op het internet vinden moest er iets niet goed lukken of als je iets niet vind.

2) Editors, achterliggende programmeertalen en populaire websites die gebruik maken van WordPress.

2.1) Editors

Gutenberg Editor (Blok Editor): De Block Editor is een modern paradigma voor het bouwen en publiceren van WordPress-sites. Het maakt gebruik van een modulair systeem van blokken om content samen te stellen en op te maken en is ontworpen om rijke en flexibele lay-outs te creëren voor websites en digitale producten.

2.2) Achterliggende programmeertalen.

PHP: Het contentmanagementsysteem WordPress maakt gebruik van deze programmeertaal als Back-end.
My-SQL database: Alle content wordt opgeslagen in deze programmeertaal als database.
HTML, CSS, JS: Voor de structuur van de frontend wordt HTML gebruikt, CSS voor de stijl en JavaScript voor de interactieve functies.

2.3) Populaire websites die gebruik maken van WordPress.

NASA
Spotify
META Newsroom

3) Opstart-instructies van jouw CMS (WordPress)

3.1) Stapsgewijze instructies om jouw CMS op te starten

3.1.1) Als eerst moet je Docker Desktop hebben gedownload normaal is dit al gebeurd als je het hele stappenplan hebt gevolgd elders kun je dit makkelijk doen in het hoofdstuk: "Docker" daar word dit als eerste uitgelegd hoe dit moet.

Stel je hebt Docker Desktop toch nog niet gedownload je kunt dit doen als je deze link verder volgt: https://www.docker.com/products/docker-desktop/

3.1.2) Als volgende gaan we een "docker-compose.yml" file aanmaken in 'VS code', het is belangrijk dat die ook exact zo noemt. We zullen daar gebruik maken van WordPress en een MySQL-database. Als de file is aangemaakt dan ga je volgende code erin zetten:

version: "3"

services:
  wordpress:
    image: wordpress:latest
    ports:
      - "8080:80"
    environment:
      WORDPRESS_DB_HOST: db:3306
      WORDPRESS_DB_NAME: testdb
      WORDPRESS_DB_USER: testuser
      WORDPRESS_DB_PASSWORD: testpassword
    networks:
      - wordpressnet
    volumes:
      - wordpress_data:/var/www/html

  #Database
  db:
    image: mysql:5.7
    environment:
      MYSQL_ROOT_PASSWORD: password
      MYSQL_DATABASE: testdb
      MYSQL_USER: testuser
      MYSQL_PASSWORD: testpassword
    networks:
      - wordpressnet
    volumes:
      - db_data:/var/lib/mysql

networks:
  wordpressnet:
    driver: bridge

volumes:
  wordpress_data:
  db_data:

3.1.3) Als de code in je "docker-compose.yml" file staat dan open je terug je 'CMD' terminal en typ je: `docker-compose up -d`, als het in je terminal eruit ziet als op de foto zou je WordPress moeten draaien.

3.1.4) Moest het zijn dat je een foutmelding krijgt in je terminal, dan kan dit liggen omdat je niet de juiste versie in je code hebt gebruikt van je docker-compse.yml file, Helemaal vanboven kun je die terugvinden. Om te zien welke versie van Docker Desktop je hebt open je terug een gewone 'CMD' terminal op je computer. Dit doe je door: "Windows knop + r" in te drukken en in het kleine venstertje 'CMD' te typen daarna druk je op enter en krijg je je terminal te zien als volgt typ je daarin `docker-compose --version`.

3.1.5) Om te controleren of hij echt draaiende is kun je in je Docker Desktop gaan kijken of er een container actief is. Je kunt ook kijken of hij actief is door gewoon op Google je localhost:8080 op te zoeken.

3.1.6) Als je je localhost op Google opzoekt dan krijg je dit scherm te zien zoals op de foto hieronder. Daar selecteer je de taal die wenst te gebruiken/zien in je interface en druk je daarna op doorgaan.

3.1.7) Bij het volgende scherm moet je jouw gegevens invullen zoals: de titel van jouw WordPress, jouw gebruikersnaam, een wachtwoord, je e-mailadres en dan kun je ook nog het vakje aanvinken als je niet wilt dat de website jouw WordPress gaat indexeren, daarna kun je drukken op de knop WordPress installeren.

3.1.8)Daarna krijg je een scherm te zien dat het is gelukt en kun je op aanmelden drukken.

3.1.9) Dan meldt je jezelf aan met de inloggegevens van daarjuist en druk je op aanmelden.

3.1.10) En dan kom je op de front pagina van WordPress.

3.2) Verwijzing naar bronnen waar je hulp kan vinden als er problemen zijn bij het opstartproces.

Je kunt altijd naar deze site: https://stackoverflow.com/questions/tagged/wordpress gaan, dit is een site voor developers als ze problemen hebben kunnen ze hier vragen stellen en kunnen er anderen op antwoorden misschien is hier wel iemand met het soortgelijk probleem als dat u ondervindt.

4) Hoe werkt WordPress? Hoe maak je er een cv op?

4.1) Je start een nieuwe pagina door links boven over het +'je te bewegen met je muis en dan in de dropdown op pagina drukken.

Schermafbeelding 2025-05-28 212138

4.2) Om een thema te kiezen op jouw WordPress pagina kun je dit doen door links in het menu op "Weergave" te drukken en dan thema's.

4.3) Als je pagina hebt aangemaakt dan krijg je vanboven te zien: "voeg titel toe" en daar zet je dan de titel van jouw pagina.

4.4) Om een stukje tekst toe te voegen wil je natuurlijk eerst een soort tussentitel hebben daarvoor selecteer je links in je scherm "koptekst" en dan typ je de naam van je tussentitel. Moest je zoals bij mij soorten "blokken" niet ziet staan dan moet je links boven eerst op het +'je duwen.

4.5) De soort koptekst dus de grootte van je tussentitel druk je op je geschreven tussentitel druk je zoals bij mij op de moment op "H2" en in de dropdown kun je kiezen welke soort je wilt hebben.

4.6) Om een lijstje toe te voegen druk je zoals verwacht op de knop "Lijst" deze staat ook links in het scherm. Als je een volgend puntje wilt creëren druk je gewoon op 'enter'. wil je een lijstje maken onder een bestaand lijstpuntje druk je gewoon op 'spatie' en dan word er een nieuw puntje als lijstje aangemaakt.

4.7) Wil je nu iets vet -of cursiefgedrukt hebben staan druk je op de paragraaf waar je je woord of zin vet of cursief wilt hebben staan dan selcteer je wat er aangepast moet worden en druk je op de dikke 'B' of op het 'schuine lijntje'.

4.8) Wil je nu een foto toevoegen scrol je links bij de "blokken" naar beneden tot dat je afbeelding ziet staan, vervolgens zoek je in je bestanden van je computer naar de foto die je wilt plaatsen.

4.9) Om de foto uit te lijnen naar waar je wilt zoals dat die bij mij links staat druk je op de foto en dan op het icoontje met 2 dunne lijntjes en 1 dikke. Als de dropdown naar beneden gaat kun je kiezen waar je je foto uitgelijnd wilt hebben.

4.10) Voor de onderscheiding lijn toe te voegen ga terug links op zoek naar het juiste icoontje en dat is "scheidingsteken". dan druk je daarop, maar dan heb je nog altijd maar een klein lijntje staan deze kun je nog veranderen zoals bij mij naar een 'brede lijn' of een 'stippellijn'.

4.11) En dan om je tekst of info toe te voegen druk je links op "Paragraaf" en dan kun je je tekst typen.

4.12) Als je pagina dan af is druk je op "opslaan" rechts boven.

4.13) Om je resultaat eens te bekijken druk je rechts boven op het vierkantje met de pijl in.

4.14) Om terug te gaan naar het algemene scherm van WordPress druk je linksboven in de hoek op het "WordPress" logo.

4.15) Ten slotte als je op de algemene home pagina van WordPress bent en je wilt naar je pagina's gaan druk je links in het menu op "pagina's" en daarna op "alle pagina's". Om je pagina terug te openen druk je op de titel van jouw pagina die je wil openen.