WordPress voor starters

Eenvoudige handleiding

 

1.    Inloggen in WordPress

2.    WordPress thema’s (templates)
2.1  Per thema zijn er andere mogelijkheden
2.2  Start met een eenvoudig thema
2.3  Overstappen naar een ander thema
2.4  Plugins
2.5  Thema installeren

3.    Berichten en pagina’s
3.1  Een bericht maken
3.2  Een pagina maken
3.3  Berichten en pagina’s opmaken
3.4  Lettertypes en lettergrootte
3.5  De WordPress Customizer
3.6  Een link naar een andere pagina of website maken

4.    Reacties
4.1  Reacties uitschakelen
4.2  Algemene instellingen voor reacties
4.3  Reacties goedkeuren
5.1  Menu aanmaken
5.2  Een nieuwe pagina toevoegen aan het menu
5.3  Een menu item verwijderen

6.   Homepage en/of berichtenpagina instellen

7.   Afbeeldingen
7.1  Afbeelding toevoegen aan een bericht of pagina
7.2  De instellingen van een afbeelding wijzigen
7.3  PDF toevoegen
7.4  Een galerij met afbeeldingen maken
7.5  Afbeeldingen bewerken
7.6  De uitgelichte afbeelding

8.  Video toevoegen

9.  Widgets
9.1  Widgets toevoegen, verwijderen en verplaatsen
9.2  Teksten en afbeeldingen in een widget plaatsen

10.  De layout van het thema aanpassen
10.1  Je logo plaatsen
10.2  De footer widgets uitschakelen
10.3  Het lettertype aanpassen

11  Pagina’s indelen in rijen en kolommen

1. Inloggen in WordPress

Typ achter je domeinnaam /wp-admin: Voorbeeld: www.jouwdomeinnaam.nl/wp-admin.

Na het invullen van je gebruikersnaam en wachtwoord en klikken op de knop ‘Inloggen’ kom je terecht in het ‘WordPress Dashboard’. Hierin kan je je website beheren en aanpassen.

naar boven

2. WordPress thema’s (templates)

Een WordPress thema is het template of sjabloon van je website. Het WordPress thema dat je hebt gekozen bepaalt de vormgeving van je website.

2.1.Elk thema heeft andere mogelijkheden
Je kunt binnen WordPress kiezen uit zijn duizenden gratis WordPress templates of thema’s kopen op bijvoorbeeld http://themeforest.net/. Ook daar is het aanbod enorm. Op zich mooi, maar het heeft ook nadelen. Elke thema is gemaakt door een andere programmeur en elke programmeur heeft zelf bepaald welke instelmogelijkheden het thema heeft.

Het ene thema heeft veel opties, terwijl een ander thema weer veel minder flexibel kan zijn. Daarnaast is het ene thema makkelijk in het gebruik, en het andere onoverzichtelijk en complex. Helaas kun je het aan de buitenkant niet zien en kom je er het snelst achter als je met het thema gaat experimenteren.

Gelukkig bieden veel programmeurs / themabouwers goede documentatie op hun website waarop ook steeds vaker goede instructievideo’s te vinden zijn. De beste themabouwers hebben ook een actie supportforum waar je je vragen kunt stellen en binnen een paar dagen antwoord krijgt.

Tip: Zoek via google naar een demo van een thema wat je leuk lijkt. Dan heb je alvast een idee.

2.2. Installeer een thema

Als je net begint met WordPress is het slim om met een eenvoudig WordPress thema zoals Twenty Fifteen, Twenty Sixteen of GeneratePress. De thema’s zijn door WordPress zelf gemaakt, hebben weinig instelmogelijkheden en zijn makkelijk te begrijpen.

2.3. Later overstappen naar een ander thema is geen probleem

Handig om te weten: als je binnen WordPress van thema verandert, dan blijven je pagina’s met teksten en afbeeldingen behouden. Alleen de styling (lettertype, kaders, witruimten etc.) verandert. Je kunt dus lekker experimenteren met verschillende thema’s, terwijl je teksten en andere content bewaard blijft.

2.4. Plugins

Een plugin is een extra stukje software waarmee je WordPress kunt uitbreiden. Ook hier zijn er duizenden van verkrijgbaar, zowel gratis als betaald. Ga naar Plugins > Nieuwe plugin

2.5. Thema installeren

In het WordPress Dashboard klik je in de menubalk aan de linkerzijde op “Weergave”, vervolgens op “Thema’s” en dan op “Nieuwe toevoegen”. Klik dan op “Installeren” >  En daarna op “Activeren”
Het thema is nu actief en je kunt bekijken hoe je site er nu uitziet door te klikken op het huisje rechtsbovenin.
naar boven

3. Berichten en pagina’s

WordPress is van oorsprong een blog. Zo is WordPress standard ook ingesteld. Op de homepage zie je het eerste bericht staan met de titel ‘Hallo wereld’. De homepage is een soort tijdlijn van berichten onder elkaar in chronologische volgorde. Als je een nieuw bericht maakt, dan komt dat bovenaan te staan. Als je op de titel van het bericht klikt, dan open je als bezoeker het volledige bericht.

Later in deze handleiding leg ik uit hoe je de homepage wijzigt van berichtenpagina (‘blog’) naar een statische pagina.

3.1. Een bericht maken

  • Klik links in het Dashboard op ‘Berichten’
  • En vervolgens op ‘Nieuw bericht’:
  • Vul een titel in en als berichttekst bijvoorbeeld: “Dit is mijn eerste bericht”.
  • Klik op ‘Publiceren’:

Klik in de zwarte ‘admin-bar’ bovenin op ‘Bericht bekijken’ om het bericht op je website te bekijken zoals een bezoeker dit ziet. TIP: Open dit in een nieuwe tab, dan kan je die open laten staan en verversen bij een nieuwe actie. Dat scheelt een boel heen- en weer klikken!

Klik daarna in de zwarte ‘admin-bar’ bovenin op ‘Bericht bewerken’ om het bericht aan te passen…
…en daarna op de blauwe knop ‘Bijwerken’ in de rechter zijbalk om je wijzigingen op je site op te slaan.

3.2. Een pagina maken

Berichten zijn handig voor de sectie ‘Nieuws’ of ‘Projecten’ op je website. Pagina’s gebruik je voor de meer statische pagina’s, zoals ‘Over mij’, ‘Werkwijze’, ‘Diensten’ en ‘Portfolio’. De pagina’s vind je doorgaans ook terug in het menu van de site.

  • Klik in de linkerkolom in het Dashboard op ‘Pagina’s’
  • En vervolgens op ‘Nieuwe pagina’:
  • Vul een titel in.
  • Klik op ‘Publiceren’:

3.3. Berichten en pagina’s opmaken

  • Klik links in het menu op ‘Berichten’. Je ziet nu een overzicht van alle berichten.
  • Open je eerder gemaakte bericht door op de titel te klikken. Nu kun je het bericht aanpassen.
  • Klik op het icoontje ‘Toolbar tonen/verbergen’ om alle opmaakknoppen te tonen. Je kunt aan de slag met content.

3.4. Lettertypes en lettergrootte

Lettertypes en de lettergrootte stel je niet in op de pagina zelf. Het principe is dat je een stukje tekst , bijvoorbeeld een alineakoptekst, selecteert en opmaakt met een tekststijl (bijvoorbeeld ‘Koptekst 2’, zoals hieronder afgebeeld).

Welke lettertype en welke letterhoogte een tekststijl heeft, is bepaald in de ‘stylesheet’ van het thema dat je gebruikt. Bij de eenvoudigere thema’s kun je de stijlen niet vinden bij de thema- instellingen in WordPress en kun je ze alleen aanpassen met aanvullende CSS codes (via een child theme, of met een plugin zoals Simple Custom CSS). Als je de tekststijlen wilt instellen zonder gebruik te maken van programmeercodes, dan kun je een plugin gebruiken zoals Easy Google Fonts of kiezen voor een uitgebreider thema waarmee je binnen WordPress via de thema-instellingen de tekstijlen kunt instellen.

3.5. De WordPress Customizer

De WordPress Customizer, waarover later meer, bevat alle algemene layout-instellingen. Voordeel van de Customizer: je ziet direct in een preview van je pagina het effect van het aanpassen van een instelling. Niet alle thema’s gebruiken de WordPress Customizer. Veel thema’s voegen een eigen menu- item toe aan het WordPress Dashboard met daarin de thema-instellingen en zijn vaak minder overzichtelijk en minder gebruiksvriendelijk.

3.6. Een link naar een andere pagina of website maken

  • Selecteer het stukje tekst waarvan je een link wilt maken.
  • Klik op het knopje ‘link invoegen/bewerken’.
  • Als je wilt linken naar een pagina of bericht binnen je eigen site, klik dan op het pijltje achter ‘Of link naar bestaand bericht of pagina’.

Klik in het overzicht op de pagina waarnaar je wilt linken, dan wordt de URL automatisch ingevuld:

Kies een pagina

Als je wilt linken naar een pagina op een andere site, dan kun je de URL zelf invullen en een vinkje plaatsen bij ‘Open link in een nieuw tabblad’. Als de bezoeker uitgekeken is op de andere site, en het tabblad in zijn browser sluit, dan komt de bezoeker weer terecht op jouw pagina. Zo vergeten ze niet dat ze op jouw site hadden doorgeklikt naar een andere site en blijf je in beeld.

naar boven

4. Reacties

Standaard kunnen bezoekers reageren op berichten. Bij pagina’s is deze mogelijkheid standaard uitgeschakeld.

Reacties moet je eerst goedkeuren voordat ze openbaar gepubliceerd worden onder het betreffende bericht of pagina.

4.1. Reacties uitschakelen

Per bericht (of pagina) kun je de reactiemogelijkheid uitschakelen via de optie ‘Snel bewerken’:

Klik in de linkerzijbalk op Berichten, beweeg je muis over het berichttitel waarvan je de reactiemogelijkheid wilt uitschakelen, en klik dan op ‘Snel bewerken’. Daar kun je het vinkje uitschakelen bij ‘Reacties toestaan’:  Wil je ook de reacties uitschakelen voor toekomstige berichten, dan stel je dat als volgt in via Instellingen – Reacties

4.2. Algemene instellingen voor reacties

Als je eerst alle reacties wilt goedkeuren voordat ze zichtbaar worden op de website, dan stel je dat als volgt in via Instellingen – Reacties:

4.3. Reacties goedkeuren

Ingekomen reacties keur je via het hoofdmenu-item Reacties.

naar boven

5.1. Menu aanmaken

  • Klik op ‘Weergave’ en vervolgens op ‘Menu’s’
  • Vul een menunaam (bijv. Menu) in en klik op ‘Menu aanmaken’

Om het menu te activeren, zet je daarna het vinkje aan dat onder het menu staat bij ‘Menu instellingen’ en klik vervolgens weer op ‘Menu opslaan’:

5.2. Een nieuwe pagina toevoegen aan het menu

  • Maak eerste een nieuwe pagina aan zoals beschreven in paragraaf 2.2.
  • Klik vervolgens op ‘Weergave’ en dan op ‘Menu’s.
  • Vink aan de linkerkant de nieuwe pagina aan en klik op de knop ‘Aan menu toevoegen’

Sleep vervolgens de menu-items in de gewenste volgorde, klik op ‘Menu opslaan’ en daarna op het huisjes linksboven om je menu te bekijken en te testen op je website:

5.3. Een menu item verwijderen

Als je een pagina wilt verwijderen, klik je op het pijltje achter het menu item, en daarna op ‘verwijderen’. Verwijder op deze manier de Voorbeeldpagina (Sample page) en de pagina Homepage. LET OP: Laat het menu-item ‘Home’ (type ‘aangepaste link’) staan. Dit menu-item verwijst altijd naar je hoofd URL.

naar boven

6. Homepage en berichtenpagina instellen

Standaard heeft WordPress de blogpagina als homepage. Al je berichten komen (nieuwste eerst) onder elkaar te staan. Als je een statische pagina wilt hebben als homepage, dan kun je dat via de algemene instellingen. Eerder heb je de pagina ‘Homepage’ aangemaakt en ‘Nieuws’.

De ‘Homepage’ wordt ook daadwerkelijk de homepage en de berichten komen op de pagina ‘Nieuws’
Klik onderaan op de knop ‘Wijzigingen opslaan’.

naar boven

7. Afbeeldingen

7.1. Afbeelding toevoegen aan een bericht of pagina

Open een bericht of pagina en voeg via de volgende stappen een afbeelding toe:

  • Klik in de tekst op de plaats waar je het plaatje wilt invoegen. Klik uiterst links, ook als je het plaatje rechts wilt hebben. Rechts uitlijnen stel je zometeen in.
  • Klik (onder de pagina-titel) op de knop ‘Media toevoegen’
    Je komt dan in de Mediabibliotheek terecht. Nu staat er nog niets in, maar straks vind je hier elke afbeelding die je op je site hebt gezet.
  • Klik op het tabblad ‘Bestanden uploaden’ om een afbeelding aan je website toe te voegen.
  • Sleep een afbeeldingsbestand (een JPG, PNG of GIF) vanuit een mapje op je computer in dit venster of klik op ‘Bestand selecteren’ en kies een afbeeldingsbestand dat op je computer staat:
  • Direct na het uploaden van de afbeelding kun je de instellingen naar wens aanpassen.
  • Je kunt een link plaatsen onder de afbeelding: Selecteer de afbeelding en klik in het lint op het schakeltje. Als je kiest voor ‘Aangepaste URL’ kun je de afbeelding als ‘knop’ laten functioneren. Als een bezoeker klikt op de afbeelding, komt hij/zij terecht op pagina waarvan je hier de link hebt ingevuld.

Klik na het toevoegen van een afbeelding rechtsboven op ‘Bijwerken’ en klik helemaal bovenin de zwarte ‘admin-balk’ op ‘Pagina bekijken’.

7.2. De instellingen van een afbeelding wijzigen

Niet tevreden over de positie en afmeting van de afbeelding?

Klik dan op ‘Pagina bewerken’, klik op de afbeelding en vervolgens op het ‘potloodje’ om de instellingen van de afbeelding aan te passen.

Je kunt aan de hoekpunten de afbeeling kleiner slepen.
Na het verwijderen van een afbeelding, is deze nog steeds aanwezig in de mediabibliotheek.

7.3. PDF toevoegen

Je kunt via de knop ‘Media toevoegen’ ook een PDF-bestand toevoegen aan een pagina of bericht.

Na het invoegen van de PDF, zie je een tekstlink op je pagina. Als een bezoeker daar op klikt, wordt de PDF getoond. De PDF wordt niet als afbeelding geplaatst op je pagina. !

7.4. Een galerij met afbeeldingen maken

Maak een galerij:

  • Open het bericht of de pagina waar je de afbeeldingengalerij wilt plaatsen.
  • Klik op de knop ‘Media toevoegen’ en voeg via het tabblad ‘Bestanden uploaden’ een aantal afbeeldingen vanaf je computer toe aan de mediabibliotheek.
  • Klik aan de linkerzijde op ‘Galerij aanmaken’
  • Vink de gewenste afbeeldingen aan. Door op een afbeelding te klikken kun je het vinkje in- of uitschakelen. Onderin het scherm zie je in het klein de afbeeldingen die je hebt geselecteerd.
  • Klik rechtsonder op ‘Een nieuwe galerij aanmaken’.
  • Pas zonodig de galerij-instellingen aan en klik op ‘galerij invoegen’: Na het klikken op de knop ‘Galerij invoegen’ ben je weer terug in je pagina of bericht. • Klik op ‘Bijwerken’ en bekijk het resultaat op je website.
  • De galerij kun je wijzigen door eerst op de galerij-afbeelding te klikken, en daarna op het potloodje.

7.5. Afbeeldingen bewerken

Na het uploaden van je afbeelding kun je behalve het aanpassen van de instellingen ook klikken op ‘Afbeelding bewerken’:

Je hebt dan de volgende bewerkingsmogelijkheden:

Afbeeldingen aanpassen binnen WordPress kan dus wel, maar werkt niet heel intuïtief en consequent. Persoonlijk pas ik afbeelding liever eerst aan in een fotobewerkingsprogramma zoals Photoshop voordat ik ze upload in WordPress.

Heb je geen Photoshop? Dan is dit online fotobewerkingsprogramma een handig gratis alternatief:

https://pixlr.com/editor/

7.6. De uitgelichte afbeelding

De afbeeldingen die je zojuist hebt geplaatst staan in de tekst, zoals in het voorbeeld hieronder:

In WordPress kun je per bericht of pagina ook een uitgelichte afbeelding instellen. Meestal komt deze afbeelding in de header van de pagina te staan, het deel van de pagina boven de titel. Dit verschilt per thema. Ik gebruik het thema GeneratePress, en dan ziet de uitgelichte afbeelding er als volgt uit: !

De uitgelichte afbeelding moet in dit thema 1100 pixels breed zijn en plaats je hier:

Je kiest dan net als bij een reguliere afbeelding weer een afbeeldingsbestand uit de mediabibliotheek of je upload een afbeelding vanaf je computer.

naar boven

8. Video’s toevoegen

Youtube video’s en Vimeo video’s plaatsen op je website is heel eenvoudig. Ga naar Youtube.com, zoek de video op die je wilt plaatsen, en kopieer de URL van de video en plak deze in een bericht of pagina en WordPress plaatst de video automatisch in een videoplayer op je site.

9. De zijbalk en andere widget-gebieden indelen

9.1. Widgets toevoegen, verwijderen en verplaatsen

Via Weergave – Widgets kun je de zijbalk indelen.

Aan de linkerzijde zie je widgets (‘dingen’) die je in de zijbalk kunt plaatsen. Aan de rechterzijde zie je de widgetgebieden. Behalve in de zijbalk, kun je ook widgets plaatsen in de kop (‘header’) en onderaan de website (‘footer’).

Nieuw te plaatsen widgets kun je van links naar rechts in de widgetgebieden slepen.

Een widget verwijder je door een widget uit het widgetgebied rechts naar links te slepen en los te laten aan de linkerkant onder ‘Beschikbare widgets’.

Verwijder op die manier de widgets ‘Meta’, ‘Archief’ en ‘Recente reacties’. Sleep de widget ‘Zoeken’ uit de ‘Rechter Zijbalk’ naar het widgetgebied ‘Header’.

Klik vervolgens helemaal rechtsbovenin in de zwarte ‘admin-balk’ op het huisje om het resultaat op je site te bekijken.

Standaard kun je alleen door gebruik te maken van HTML-code afbeeldingen via een tekstwidget in de zijbalk (of andere widgetgebieden) plaatsen:

9.2. Teksten en afbeeldingen in een widgetgebied plaatsen

Gelukkig zijn er plugins beschikbaar die een widget toevoegen aan WordPress waarmee je op dezelfde wijze als in een bericht of pagina via de knop ‘Media toevoegen’ afbeeldingen kunt invoegen. Een plugin is een soort ‘app’ waarmee je een extra functie toevoegt aan WordPress.

De benodigde plugin installeer je als volgt:

  • Klik op ‘Plugins’ en vervolgens op ‘Nieuwe plugin’. De komt dan terecht in een soort ‘app- store’ met daarin meer dan 42.000 plugins.
  • Tik rechtsbovenin ‘Black Studio’ in de zoekbalk ‘Plugins zoeken’ en klik op de knop ‘Nu installeren’ achter de plugin ‘Black Studio TinyMCE widget’:

Klik op ‘Plugin activeren’:

Ga daarna weer terug naar de widgets via Weergave – Widgets.

Aan de linkerzijde heb je onder ‘Beschikbare widgets’ een nieuwe widget tot je beschikking: de Visuele Bewerker. Sleep deze in de zijbalk, en vervolgens kun je afbeeldingen plaatsen en opmaak toepassen zoals je dat gewend bent in Berichten en Pagina’s.
naar boven

10. De layout van het thema aanpassen

Het aanpassen van de layout verschilt sterk per thema. Het thema waarvan ik gebruik maak in deze handleiding is GeneratePress. Dit thema is instelbaar via de WordPress Customizer.

Als je in het Dashboard zit, Je start de Customizer via het menu-item Weergave en je klikt vervolgens op Customizer. Als je je site bekijkt, dan kun je in de admin-balk helemaal bovenin klikken op Customizer.

De instellingen doe je aan de linkerkant, het resultaat zie je na een paar seconden aan de rechterkant.

10.1. Je logo plaatsen

Klik in het Customizer hoofdmenu op Site Identy en plaats als volgt je logo:

Indien gewenst kun je het logo centreren, ga terug naar het hoofdmenu van de Customizer (pijltje linksboven) en stel via het menu Layout de uitlijning van de header in:

10.2. De footer widgetgebieden uitschakelen

Geen behoefte aan de drie footerkolommen aan de onderzijde van je website? Die schakel je uit via het menu ‘Layout’ van de Customizer: Wijzig het aantal footer widgets in ‘0’:

10.3. Het lettertype aanpassen

Dit is niet altijd mogelijk in de customizer van een gratis thema. ALs dit wel kan zie je staan ‘Fonts’ of ‘Typografie’ om het lettertype van de website te wijzigen. Je kunt kiezen uit het enorm aanbod van Google Fonts. Je kunt de lettertypes bekijken op: www.google.com/fonts en vervolgens selecteren in de Customizer. (Niet bij alle thema’s, wel bij bv GeneratePress)

naar boven

11. Pagina’s indelen in rijen en kolommen

Standaard kun je in WordPress je pagina niet indelen in kolommen. Met de Page Builder plugin van Site Origin lukt dat wel.

Met deze Plugin bouw je je pagina op als een raster van rijen en kolommen waarbij elk vakje daarin een widgetgebied wordt. Zo kan je op elke willekeurige plaats een widget plaatsen.

Je kunt alle pagina’s helemaal naar je eigen wensen indelen en je bent niet gebonden aan de thema-instellingen.

naar boven