header-ol

Workshop WordPress Basics

logo_ghio_M  Screen Shot 2015-02-26 at 09.56.44

Samenvatting –  Open Lounge Februari 2015

Hieronder volgt een korte herhaling van wat we gister behandeld hebben plus een paar extra gratis tips waar we niet aan toegekomen zijn.

Deze workshop werd gegeven door Maarten van de Voorde (mr10.nl) en Ghio Coste (ghio.nl), de web-mannen van Open Ondernemen. Je kunt ons natuurlijk voor hele projecten inhuren, maar ook voor een paar uurtjes om je op weg te helpen, of een basis setup van WordPress voor je te verzorgen.

WordPress is het meest gebruikte, en meest gebruiksvriendelijke, gratis open-source programma om websites mee op te zetten en te beheren.

Een WordPress installatie bestaat uit: WordPress zelf, een Thema, en een aantal Plugins om door jou gewenste functionaliteit toe te voegen. WordPress scheidt werking van de site, van structuur en inhoud van je site en van de vormgeving; je kunt dus WordPress updaten of je vormgeving omgooien, zonder je inhoud en structuur kwijt te raken.

Voordat je grote veranderingen aan je site gaat maken, of als je onzeker bent over wat je gaat proberen: maak een backup van je site voor je aan de slag gaat. Dit kan vaak bij je hosting provider in de administratie sectie van je domein, of met behulp van een WP plugin.

Om jezelf te beschermen tegen hackers, is het verstandig je WP en Plugins up-to–date te houden. Dit kun je bij een oncompliceerde WP site goed zelf doen, maar maak altijd eerst een backup.

Als er aanpassingen aan je Thema gedaan zijn door een webdesigner, is het verstandig je Thema niet te updaten, omdat deze wijzigingen dan verloren zullen gaan.

De WordPress Dashboard

Screen Shot 2015-02-26 at 08.38.58

Het menu links gebruik je voor de meest voorkomende handelingen: een bericht plaatsten, een pagina maken of aanpassen, een plugin installeren.

TIP: Rechtsboven klik je op Scherminstellingen om de dashboard een stukje overzichtelijker te maken, door een aantal blokjes uit te zetten:
Screen Shot 2015-02-26 at 08.39.50

Berichten

Screen Shot 2015-02-26 at 08.40.16 Een bericht komt op je voorpagina, of op je ‘Blog’ pagina (zie instellingen ‘Lezen’). Berichten en Pagina’s zijn qua invoer identiek, maar hebben verschillende functies: een bericht is een artikel dat gecategoriseerd kan worden, en na verloop van tijd automatisch in een archief terecht komt. Een pagina gebruik je voor statische inhoud, zoals ‘Over Ons’ of ‘Contact’, en laat je in je site terugkomen door middel van een Menu (Weergave > Menu’s).

 

 

De belangrijkste elementen op een Bericht (of Pagina) scherm zijn:
Screen Shot 2015-02-26 at 08.47.59

  1. Titel
  2. Bodytekst
  3. Publiceren

Uitgelichte Afbeelding
Als je Worpdress Thema het faciliteert, wordt de uitgelichte afbeelding gebruikt als header boven een bericht, en als thumbnail bij een lijst berichten.

Categorieën
De Categorieën gebruik je om je Berichten onder te verdelen: zorg dat je een aantal vrij vaste, duidelijke categorieën bedenkt, en wees spaarzaam met aanvullen ervan. Mocht je reviews schrijven, denk dan aan categorieën als ‘boeken’, ‘films’, ‘restaurants’. Je kunt een categorie weer onderverdelen, dus ‘boeken’, zou de onderverdeling ‘reizen’, ‘sci-fi’, ‘thriller’ kunnen hebben.

Je gebruikt het vakje rechts onderin bij dagelijks beheer. In het menu Berichten > Categorieën kun je ze managen.

Tags
Tags lijken op Categorieën, maar in een losser verband; denk aan hastags (zonder de #). Je voert ze komma gescheiden in, of kiest uit de meest gebruikte. Je kunt een aantal kernwoorden uit je bericht hiervoor gebruiken. Tags linken berichten onderling, en hoe meer je linkt, hoe langer een lezer blijft hangen op je site. Daarnaast is Google van veel onderling relevant!(!) linken, en dat is altijd mooi.

Berichttype
Er is nog een sectie voor berichttypes: als je Thema dit ondersteund, kun je kiezen om per soort bericht (Video, Gallery, Quote, etc) een vormgeving geoptimaliseerd voor dat type te gebruiken. Experimenteer er eens mee.

TIP: Ook hier kun je Scherminstellingen gebruiken om meer of minder vakjes (zoals ‘Samenvatting’ ) te tonen.

Editor

Screen Shot 2015-02-26 at 09.14.08

Klik eerst even op het knopje voor je ‘kitchen sink’, als je dat niet al gedaan hebt:

Screen Shot 2015-02-26 at 09.14.20

Je hebt nu volledige Word-achtige opmaak mogelijkheden om je bericht vorm te geven. Van de standaard Bold/Italic, bullet lists en uitlijning knoppen, tot het gebruik van Kopteksten en kleurtjes.

Kopteksten
Gebruik Kopteksten om je bericht onder te verdelen, en Google te vertellen wat belangrijke verwijzingen naar je inhoud zijn. Koptekst 1 is gereserveerd voor de titel van je site, of de titel van je pagina, dus die sla je over.

Enter vs. Shift-Enter
Enter geeft je een nieuwe alinea, of een nieuw item als je een Bulleted List maakt. Meestal krijg je dan een witruimte tussen vorige en nieuwe alinea: als je alleen naar de volgende regel wilt, zonder een witruimte ertussen, gebruik dan Shift-Enter.

Linkjes
Screen Shot 2015-02-26 at 09.19.46Een Linkje maak je door een stukje tekst te selecteren en op het schakelicoontje te klikken. Het icoontje ernaast is om een linkje van een geselecteerd stukje tekst te verwijderen.

Linkjes helpen je bezoeker naar meer relevante informatie, en relevante informatie maakt dat je hoger komt in Google, dus een aantal goeie links in je bericht helpen is voor iedereen een plus. Daarvoor moet je wel even de moeite nemen de linkje die je maakt netjes te beschrijven in het ‘Link invoegen/bewerken’ scherm.

Screen Shot 2015-02-26 at 09.23.15De URL vind je door (in een ander browser scherm) naar de pagina van je keuze te browsen, en de link uit de URL balk volledig te kopiëren. Dit maakt de kans op typefouten, of gebroken links (minpunten in Google) het kleinst.

De link plak je in het URL vak. Dan vul je een beschrijvende, voor mensen leesbare, titel voor je link in.

Als je linkt naar een pagina op je site, kun je het onderste deel van dit scherm gebruiken.

Afbeeldingen
Met de knop Media toevoegen, voeg je plaatjes in lopende tekst in.

Screen Shot 2015-02-26 at 10.09.42

Deze knop opent je Media bibliotheek (ook te vinden in Menu > Media).
Screen Shot 2015-02-26 at 10.11.13

Je kunt hier kiezen uit al eerder geüploade afbeeldingen, of je kunt er bestande uploaden. Uploaden kan door het tabje ‘Bestanden Uploaden’ te klikken, of door gewoon een plaatje op dit scherm te slepen (het scherm zou blauw moeten worden).

Wordress schaalt je plaatjes naar een aantal standaard formaten (voor een thumbnail, medium) en je Thema werkt mee door ook formaten die van belang zijn voor het thema alvast voor je te verkleinen naar de juiste hoogte/breedte. Dit is goed omdat als je de juiste formaten voor een plaatje kiest je pagina snel laadt, wat voor de bezoeker een goeie deal is, en dus voor Google ook. Let er dus op dat je niet Volledige Grootte kiest voor een plaatje dat als Thumbnail getoond gaat worden.

Omdat foto’s die van een camera komen tegenwoordig 7MB zijn, en de beschikbare ruimte bij je hosting provider meestal vrij beperkt is, zul je foto’s een slag kleiner moeten maken voor je ze upload. Dit kan met professionele programma’s als Photoshop of Lightroom, maar kan ook met iPhoto op de Mac (kies File > Export > Large) of met een tooltje als Light Image Resizer (rechtsklik op een plaatje, kies Verkleinen met Light Image Resizer).

Screen Shot 2015-02-26 at 10.12.14Bijlagedetails
Bijlage details is een onderschat, maar vrij belangrijk deel van het uploaden van foto’s. Hier voer je de beschrijvende titel, een optioneel onderschrift en een alternatieve tekst (voor mensen bij wie het plaatje niet laadt, of nog niet geladen is) in.

De titel en alt-tekst zul je niet terugzien in je bericht, maar Google gebruikt deze informatie voor Google Afbeeldingen. Google is sowieso fan van relevante media (ook video!) in je bericht, dus als je dit goed aanpakt, kom je weer en stapje hoger.

NB: Als je achteraf deze gegevens aanvult in de Media bibliotheek, zul je de foto opnieuw moeten plaatsen om gebruik te kunnen maken van de nieuwe informatie – het is dus makkelijker dit direct bij het uploaden te doen!

Na de Details, moet je nog even bedenken hoe het plaatje in je bericht getoond wordt (no worries – dit kun je later nog aanpassen) waar het naar linkt (liefst niet, of naar een externe URL of pagina op je site).

De afmeting is aan jou: in een bericht kom je met medium een eind, als je een afbeelding op Volledige Grootte niet breder is dan de ruimte voor je bericht, kun je die ook gebruiken – speel er een beetje mee 🙂

Een plaatje verwijderen doe je door er op te klikken en het kruisje te klikken. Door op het plaatje te klikken kun je ook de uitlijning aanpassen.

Berichten Overzicht scherm

TIP: Stel je hebt Yoast SEO, dan worden je kolommen met Titel, Auteur, Datum etc. nogal in elkaar gedrukt. Niet overzichtelijk. Klik op Scherminstellingen om alle SEO kolommen uit te vinken en wat meer lucht te maken voor je titels.

Screen Shot 2015-02-26 at 08.40.24

Plugins

We hebben behandeld hoe je een plugin installeerd. Ik zal een aantal plugins die wij veel gebruiken, of die tijdens de Workshop ter sprake kwamen hier linken.

Bedenk dat iets nooit gratis is: een gratis plugin zal meestal een addertje onder het gras hebben (reclame), of er zal een Pro versie met uitgebreidere functionaliteit beschikbaar zijn. Een goede plugin uitzoeken is researchen, als je een paar tientjes betaald voor een plugin, is de kans op goede kwaliteit een stuk groter.

De WordPress Plugin Directory
https://wordpress.org/plugins/

Codecanyon (betaalde) plugins
http://codecanyon.net/category/wordpress

Genoemde Plugins
Sharaholic
https://wordpress.org/plugins/shareaholic/

Social Networks Auto Poster
https://wordpress.org/plugins/social-networks-auto-poster-facebook-twitter-g/

Yoast
https://wordpress.org/plugins/wordpress-seo/
https://yoast.nl/artikelen/wordpress-seo/

Yoast Analytics
https://wordpress.org/plugins/google-analytics-for-wordpress/

WPML (Multi Language)
http://wpml.org/

Backup Buddy
https://ithemes.com/purchase/backupbuddy/

Of een gratis alternatief:
https://wordpress.org/plugins/backupwordpress/

Thema’s

Voor thema’s geldt hetzelfde als Plugins: gratis bestaat bijna niet, dus kijk goed naar addertjes.

Dit zijn een aantal Thema makers van goede kwaliteit:
http://graphpaperpress.com/
http://www.woothemes.com/
http://www.elegantthemes.com/
http://themefurnace.com/
http://www.wpzoom.com/
http://www.organicthemes.com/

Grote verzameling Thema’s
http://themeforest.net/category/wordpress

Reken erop dat bij een thema dat ‘alles’ kan, dus met heel veel verschillende layout opties, page builders, slider plugins, etc. je ook veel tijd zult besteden aan het leren instellen van het thema. Het meestverkochte thema is Avada, wat zeer uitgbereid is, maar waarbij layout van een pagina plaatsvind in de teksteditor, waardoor veel code in de editor terechtkomt. Niet perse de beste keuze als je net met WP begint.

WordPress Links

Check eerst even bij je hosting provider of WordPress voor je geïnstalleerd kan worden. Een provider als MijnDomein heeft in de admin sectie van je domein, tools om WP automatisch voor je in te stellen. (NB: ik ben niet perse voorstander van MijnDomein)

Gratis gehoste WordPress site (gratis, dus pas op voor addertjes 🙂
https://nl.wordpress.com/

NL WordPress Downloaden
https://nl.wordpress.org/

Een beschijving handmatig installeren WordPress:
http://www.wplounge.nl/beginners/wordpress-installeren/wordpress-handmatig-installeren/

We hebben een leuke, interessante, zinvolle avond gehad, maar hebben maar de helft van ons lijstje behandeld. Waar we niet aan toe zijn gekomen zijn onder andere het managen en gebruiken van Menu’s, Widgets, Gebruikers, Contactformulieren, Berichttypen en een Foto Galerij aanmaken.

Mooie cliffhanger voor een volgende WP avond, of een uitgebreidere WP workshop. Als je op de hoogte gehouden wenst te worden – abonneer je dan op de Open Ondernemen nieuwsbrief, of neem direct contact op met Maarten (maarten@mr10.nl) of Ghio (info@ghio.nl).

Je kunt een, aan deze workshop gerelateerde vraag, ook als reactie plaatsen – we horen graag van jullie.

Groeten!

Maarten & Ghio

Published on: 26 februari 2015
Posted by: mr10

Pin It on Pinterest

Share This