AJO Amersfoort Handleiding eenvoudig gebruik WordPress voor Editors

Transcriptie

1 AJO Amersfoort Handleiding eenvoudig gebruik WordPress voor Editors Versie : 1.0 Datum: 22 april 2017 Status : Concept Auteur : Fred Ras

2 VERSIEBEHEER Versie Datum Paragraaf Aanpassing Initiële versie Copyright 2017 AJO Amersfoort

3 Inhoudsopgave 1 INLEIDING 1 2 BERICHTEN VS PAGINA S Berichten (Blog Posts) Pagina s Verschillen op een rijtje 3 3 HOE MAAK JE EEN BERICHT Titel Permalink Inhoud bericht Media toevoegen Categorieën Uitgelichte afbeelding Reacties Lees meer optie Publiceren 7 4 HOE MAAK JE EEN PAGINA AAN Pagina attributen Uitgelichte afbeelding 8 5 KNOPPEN IN DE VISUELE EDITOR 9 6 AFBEELDINGEN TOEVOEGEN Media toevoegen optie FTP en HTML Afbeelding verwijderen uit bericht PDF bestand opnemen in een bericht (of pagina) 14 7 AFBEELDINGEN BEWERKEN Bewerken vanuit visuele editor Bewerken vanuit mediabibliotheek Bewerkmogelijkheden Bijsnijden Roteren Spiegelen 16

4 7 7 Schalen Ongedaan maken / opnieuw Terug naar origineel 17 8 HOE VOEG JE EEN VIDEO TOE Hoe embed je een video in een WordPress bericht Welke websites worden door WordPress ondersteund Waarom externe website gebruiken voor video s 20

5 1 Inleiding Deze handleiding is bedoeld om editors en in het algemeen iedereen die inhoud op de AJO website wil plaatsen in staat te stellen berichten en pagina s te maken. Het merendeel van deze handleiding is overgenomen van de website: Waar nodig is de tekst aangepast aan de specifieke AJO situatie. Het bewerken van berichten en pagina s vindt plaats in de zogenoemde edit mode van een bericht of pagina. Dit kun je oproepen door (als je bent ingelogd) en op de juiste pagina of bericht bent, onderaan op de link Bewerk te klikken. Je ziet dan de pagina in edit mode: Links het edit menu (zwarte achtergrond) en verder een aantal hulpmiddelen die in deze handleiding worden besproken. Pagina 1 van 24

6 2 Berichten vs Pagina s In WordPress heb je standaard twee opties om tekst op je website weer te geven: in een bericht of op een pagina. De vraag is alleen wanneer je welke van de twee het beste kunt gebruiken. Tijdens het aanmaken ervan bevatten ze namelijk zo goed als dezelfde velden en ook als ze gepubliceerd zijn op je website kan je er weinig verschillen tussen vinden. Wat zijn nou de precieze verschillen en heb je ze wel allebei nodig op je website? Op dat soort vragen krijg je in dit bericht antwoord. 2 1 Berichten (Blog Posts) Als je WordPress als blog gebruikt, dan zal je waarschijnlijk al wel bekend zijn met berichten (of posts). Deze teksten worden in omgekeerde chronologische tijd (dus nieuwste bovenaan) weergegeven op je website. Afhankelijk van je instellingen, kan je deze berichten op je homepagina weergeven of op een aparte blog-pagina. Doordat de berichten op datum gesorteerd staan, zijn ze bedoeld om tijdelijk informatie te bieden. Zo kan je ze bijvoorbeeld voor een nieuwsgedeelte op je website gebruiken. De tekst in een bericht blijft natuurlijk altijd toegankelijk voor wie ernaar zoekt, maar zal niet meer bovenaan blijven staan (tenzij je een bericht sticky maakt). Naarmate de tijd vordert, zal een bericht dus minder makkelijk toegankelijk worden. Bij berichten is het mogelijk, of eigenlijk verplicht in het geval van WordPress, om ze in categorieën op te delen of tags eraan toe te voegen. Door verschillende categorieën te gebruiken, blijven je berichten ook beter vindbaar. Er kunnen namelijk in verschillende categorieën verschillende berichten bovenaan staan. De berichten op je website worden ook meegenomen in je RSS feed. Zo kunnen bezoekers van je website zich inschrijven op de feed van je website en automatisch een melding krijgen als je een nieuw bericht hebt geplaatst. In plaats van RSS kan dit natuurlijk ook met social media. Zo is het mogelijk om je berichten automatisch op bijvoorbeeld Twitter of Facebook te plaatsen. Bij berichten in WordPress is het gebruikelijk dat je bezoekers erop kunnen reageren. Bij een blog is namelijk vaak het idee dat je een bericht schrijft en mensen hier hun eigen mening of waardering over kunnen achterlaten. Indien je liever geen reacties wilt op je berichten, zijn ze natuurlijk ook uit te schakelen via Instellingen > Reacties. 2 2 Pagina s Pagina s zijn bedoeld om statische tekst weer te geven. Hiermee wordt bedoeld dat je er teksten mee plaatst die niet, of nauwelijks, zullen wijzigen. Pagina s zijn daarnaast vaak direct in een menu terug te vinden. Een algemeen voorbeeld waarvoor je een pagina zal gebruiken, is de contact of over pagina op je website Deze pagina bevat Pagina 2 van 24

7 namelijk algemene informatie die weinig tot niet zal veranderen. Je zult bijvoorbeeld niet elke maand nieuwe onderdelen aan zo n pagina toevoegen. Natuurlijk is het wel mogelijk om een pagina aan te passen als er toch iets tussendoor veranderd is. Doordat de pagina s gebruik maken van een hiërarchie, is het mogelijk om ze te ordenen. Zo kan je een eigen menu aanmaken met daarin de pagina s op de posities die je zelf wilt. Je zit dus niet vast aan een chronologische volgorde zoals bij berichten het geval is. Ook is het mogelijk om berichten onder elkaar in te delen. In dat geval maak je gebruik van zogeheten subpagina s. Bij de AJO website is een andere oplossing gekozen. Daarnaast worden pagina s ook als tijdloos gezien. De informatie erop blijft (altijd) actueel en er wordt standaard ook geen publicatiedatum weergegeven, zoals bij bericht wel het geval is. Hierdoor worden je pagina s ook niet weergegeven in de RSS feed van je website en zullen veel publiceer-plugins, zoals Jetpack, ook niet je nieuwe pagina s publiceren op social media. Vaak wordt er ook voor gekozen om reacties op pagina s uit te schakelen. Zo heb je vaak geen behoefte aan reacties op je over pagina of op de disclaimer van je website; ze zijn er meer om bezoekers te informeren dan ze op iets te laten reageren. 2 3 Verschillen op een rijtje Hieronder vind je, in het kort, de voornaamste verschillen tussen berichten en pagina s. Berichten: onderverdelen in categorieën tijdelijk te vinden in RSS feed / social media bevat tijdstip actuele info (voor die tijd) Pagina s: subpagina s (hiërarchie) statisch / tijdloos niet in RSS feed / social media bevat geen tijdstip algemene info Welke van de twee moet ik gebruiken? Veel WordPress websites maken van zowel pagina s als berichten gebruik. Zo wordt er op deze website bij Nieuws gebruik gemaakt van berichten en zijn er elders juist pagina s gebruikt. Het is dus niet verplicht om maar één van de twee opties op je website te gebruiken. Wil je weten of voor een bepaalde tekst een bericht of pagina beter geschikt is, dan kan je de volgende punten in je achterhoofd houden: Een bericht kan gecategoriseerd worden en bevat tijdelijke informatie voor die categorie. Na een tijdje zullen er dus nieuwe berichten aan dezelfde categorie worden toegevoegd en zullen oudere berichten weggestopt worden. Een voorbeeld hiervan: nieuwsberichten. Pagina s daarentegen bevatten meer algemene / statische informatie. Een voorbeeld hiervan: over pagina. Pagina 3 van 24

8 Natuurlijk zijn dit enkel voorbeelden en zijn er geen harde regels voor het gebruik van berichten en pagina s. Je kunt dus altijd zelf uitmaken wat je uiteindelijk voor een bepaalde tekst wilt gebruiken. Pagina 4 van 24

9 3 Hoe maak je een bericht Over het algemeen is het niet lastig om een bericht te kunnen schrijven in WordPress. Het is echter wel fijn als je meteen begrijpt wat alle mogelijkheden zijn. Om aan een bericht te beginnen, ga je in edit mode naar het menu en van daar naar Berichten > nieuw bericht. Daar aangekomen zal je het volgende scherm zien: 3 1 Titel In het bovenste gedeelte heb je de ruimte om de titel van je bericht te schrijven. 3 2 Permalink Nadat je de titel opgegeven hebt, zal direct eronder een permalink tevoorschijn komen die naar je bericht zal gaan wijzen. Standaard wordt deze gegeneerd aan de hand van je ingestelde permalink structuur. Mocht het zo zijn dat je een erg lange titel hebt, en je URL hierdoor ook erg lang wordt, dan heb je de mogelijkheid om de permalink aan te passen door op Permalink aanpassen te klikken. Let er bij het aanpassen van de permalink wel op dat je alleen kleine letters, cijfers en koppelstreepjes gebruikt (-). Speciale tekens en spaties zijn namelijk niet toegestaan. Pagina 5 van 24

10 3 3 Inhoud bericht In het grote veld wat in het midden van de afbeelding te zien is, kan je je bericht schrijven (de visuele editor). Hiervoor heb je ook een aantal knoppen tot je beschikking in de balk die erboven te vinden is. Wanneer je met de muis over zo n knop heen gaat, zal er een uitleg verschijnen van wat de knop precies inhoudt. De knoppen bevatten de meeste onderdelen die je ook in Word tegen zou komen. Zo is het bijvoorbeeld mogelijk om de uitlijning aan de passen, teksten dikgedrukt te maken en onderdelen op te sommen. Verder werken een aantal sneltoetsen zoals Ctrl + B ook in deze editor. Als je wilt weten wat elk knopje precies inhoudt, dan kan je het hoofdstuk 5 raadplegen. Verder kan je in de visuele editor ook een verschillende opmaak geven aan bepaalde tekst, zoals een tussenkop. Om dat te doen, selecteer je eerst de gewenste tekst en klik je vervolgens op het veld waar Paragraaf te vinden is. Er zal dan een lijstje van verdere opties tevoorschijn komen, waaronder een aantal koptekst mogelijkheden. Let op! Als je een Enter geeft krijg je een nieuwe alinea en ga je niet naar de volgende regel. Er komt dan (meestal onbedoeld) een lege regel tussen te staan. Als je naar een volgende regel wilt zonder een lege regel er tussen in, gebruik dan de toetsten combinatie shift + Enter Voor de mensen die verstand hebben van HTML, is het ook mogelijk om naar een teksteditor over te gaan. Om dit te doen klik je rechts bovenin op de optie Tekst (naast Visueel ). Op deze manier kan je tussen de twee editors omschakelen. Over het algemeen zal je hier niet vaak mee werken, maar het is leuk om eens te proberen. 3 4 Media toevoegen Boven de balk van de editor, vind je een Media toevoegen knop. Hiermee is het mogelijk om bijvoorbeeld een afbeelding aan je bericht toe te voegen. Wanneer je op de knop hebt geklikt, verschijnt er een venster waarin je een afbeelding kunt selecteren om te uploaden naar je website. Mocht je de afbeelding al een keer eerder erop hebben gezet, dan kun je ook naar het tabje Mediabibliotheek gaan en daar de betreffende foto kiezen. Wanneer je de betreffende foto hebt gevonden en geselecteerd, kun je aan de rechterkant in het venster een aantal instellingen aanpassen voordat je hem invoegt in je bericht. Zo is het mogelijk om de uitlijning te kiezen, maar ook een onderschrift op te geven of zelfs de afmeting van de afbeelding aan te passen. Als je vervolgens op Invoegen in bericht klikt, zal de afbeelding in je bericht worden geplaatst. Voor meer informatie over het gebruik van media in je berichten, verwijs ik je naar het hoofdstuk 6 Afbeeldingen toevoegen aan je WordPress pagina s en berichten 3 5 Categorieën Nu je je bericht geschreven hebt, is het tijd om hem in te delen in een categorie. Een categorie is verplicht en als je er geen opgeeft, dan zal het bericht in de standaard uncategorized categorie worden geplaatst. Het indelen in een categorie is erg simpel te doen. Aan de rechterkant vind je een menu genaamd Categorie waarin je de beschikbare categorieën ziet staan. Vervolgens hoef je alleen de categorie(ën) waarin je het bericht wilt plaatsen te selecteren. Staat de goede categorie er op dit moment niet tussen, dan heb je ook de mogelijkheid om hem aan te maken door onderin op Nieuwe categorie toevoegen te Pagina 6 van 24

11 klikken. Er zal dan een veld verschijnen waarin je de naam van de categorie op kunt geven en (optioneel) aan kunt geven of deze onder een andere, bestaande, categorie moet vallen. 3 6 Uitgelichte afbeelding Tegenwoordig is het in de meeste thema s mogelijk om een zogeheten Uitgelichte afbeelding in te stellen die dan zal worden gebruikt in het overzicht van je berichten of zelfs in een galerij (afhankelijk van je thema). Mocht je thema het ondersteunen, dan zal je een menu genaamd Uitgelichte afbeelding helemaal rechts onderin kunnen vinden. Het instellen van een afbeelding is erg simpel: je klikt op Uitgelichte afbeelding instellen en er zal net zo n venster openen als wanneer je een mediabestand aan je bericht wilt toevoegen. Vervolgens selecteer (of upload) je de gewenste afbeelding, en klik je vervolgens rechts onderin op Uitgelichte afbeelding installeren. Er zal nu een kleine weergaven van de gekozen afbeelding te zien zijn in het menu. Mocht je een andere uitgelichte afbeelding willen hebben, dan zal je eerst de eerder gekozen afbeelding moeten verwijderen door eronder op Uitgelichte afbeelding verwijderen te klikken. 3 7 Reacties Het is per bericht mogelijk om aan te geven of je toestaat dat mensen erop kunnen reageren. Om dit te doen, kun je in het menu Reacties een vinkje zetten voor de onderdelen die je toestaat (reacties en/of trackbacks). Als je ingesteld hebt dat reacties zijn toegestaan op je website, zullen de twee opties standaard al aangevinkt zijn. Zo hoef je niet voor ieder bericht deze optie langs te lopen; alleen als je van de standaard wilt afwijken. 3 8 Lees meer optie Een veel gebruikte optie binnen WordPress is de Lees meer optie. De knop hiervoor kan je hier rechts vinden en zorgt ervoor dat je bericht op die plek wordt afgekapt en een Lees verder optie wordt toegevoegd. Dit zorgt ervoor dat je bezoekers in je berichtenoverzicht niet het hele bericht kunnen lezen, maar slechts het gedeelte wat voor deze tag staat. Daarmee maak je het overzichtelijker voor ze welke berichten je op je website hebben, en kunnen ze berichten die hen interessant lijken verder lezen. 3 9 Publiceren Nadat je je bericht hebt geschreven en alles naar wens hebt ingesteld, wordt het tijd om je bericht te publiceren. Je kunt in het Publiceren menu ook een aantal andere dingen doen, zoals je bericht eerst als concept opslaan of de zichtbaarheid ervan wijzigen. Ook is het mogelijk om op Voorbeeld te klikken om te kunnen kijken hoe je bericht er op de website uit zal komen te zien. Verder beschik je over de mogelijkheid om een bericht in te plannen voor een bepaalde datum. Pagina 7 van 24

12 4 Hoe maak je een pagina aan Het is in WordPress niet alleen mogelijk, om berichten aan te maken maar ook pagina s. Een pagina aanmaken lijkt erg op dat van een bericht, maar er zijn een paar kleine verschillen. In dit hoofdstuk zullen deze verschillen nader worden toegelicht. Om aan je pagina te beginnen, ga je naar Pagina s > Nieuwe pagina. Daar aangekomen kan je beginnen met het schrijven van je pagina. Voor informatie over de onderdelen zoals de titel, inhoud, media, reacties en het publiceren, kun je een kijkje nemen bij het hoofdstuk, 3 omdat deze hetzelfde zijn als bij een pagina. De overige opties worden hieronder besproken: 4 1 Pagina attributen In dit vak kun je een aantal instellingen wijzigen voor het uiterlijk van de pagina en hoe hij in WordPress wordt weergegeven. Bij Hoofd kan je een pagina aangeven waaronder deze pagina zal vallen. Op die manier is het mogelijk om een subpagina aan te maken. De optie Sjabloon geeft, afhankelijk van je thema, verschillende soorten sjablonen die je kunt gebruiken om je pagina anders op te maken. Zo kan je bijvoorbeeld een sjabloon hebben speciaal voor foto pagina s of met extra functionaliteiten zoals je laatste paar berichten onderaan de pagina. Bij Volgorde kan je een nummer opgeven. Bij het AJO template wordt deze optie niet gebruikt, omdat je ook eigen menu s kunt samenstellen. 4 2 Uitgelichte afbeelding Helemaal rechts onderin vind je de optie om een uitgelichte afbeelding in te stellen. Meestal heeft een uitgelicht afbeelding bij een pagina maar weinig nut, maar er zijn thema s die er rekening mee houden. Het AJO thema houdt hier geen rekening mee. Wanneer alles naar wens is ingevuld, kan je je pagina publiceren. Je beschikt hierbij over dezelfde opties als bij een bericht, dus je kunt een pagina ook inplannen of afschermen met een wachtwoord. Pagina 8 van 24

13 5 Knoppen in de visuele editor De visuele editor in WordPress beschikt over een aantal knoppen die je kunt gebruiken tijdens het schrijven van je berichten of pagina s. Van de meeste knoppen is wel duidelijk wat ze inhouden, maar sommige zijn niet zo voor de hand liggend. Daarom lopen we ze in dit hoofdstuk nog eens allemaal langs. Per knop zie je een uitleg en, indien aanwezig, een sneltoets om de betreffende optie te gebruiken zonder knop. Knop Uitleg Sneltoets Bold, oftewel dikgedrukt Ctrl + B Italic, oftewel schuingedrukt Ctrl + I Doorgehaald Alt + Shift + D Ongeordende lijst Alt + Shift + U 1. Geordende lijst Alt + Shift + O Blockquote Alt + Shift + Q Horizontale lijn invoegen Tekst links uitlijnen Alt + Shift + L Tekst centreren Alt + Shift + C Tekst rechts uitlijnen Alt + Shift + R Hyperlink invoegen (Je moet eerst de tekst selecteren waarvan je een hyperlink wilt maken) Alt + Shift + A Hyperlink verwijderen Lees-meer-tag. De tekst boven de tag zal zichtbaar zijn in het berichten overzicht op je website, gevolgd door een Lees verder link om de rest van het bericht te kunnen lezen. Alt + Shift + S Alt + Shift + P Gootsteen. Hiermee wordt een tweede rij aan knoppen zichtbaar Pagina 9 van 24

14 Afleidingsvrije-modus Alt + Shift + W Nadat je op de gootsteen knop hebt geklikt, zullen de volgende knoppen beschikbaar komen: De mogelijke stijlen die je thema bevat. Standaard staat deze op alinea en heb je opties zoals verschillende kopteksten. Underline, oftewel onderstreept Tekst uitvullen over de breedte van je bericht Ctrl + 1,2,3,4,5,6 Ctrl + U Alt + Shift + J Tekstkleur Plakken als tekst Hiermee verwijder je alle opmaak die aanwezig is in de geselecteerde tekst. Speciale tekens Inspringing verkleinen Inspringing vergroten Ongedaan maken Ctrl + Z Opnieuw Toetscombinaties Ctrl + Y Alt + Shift + H Pagina 10 van 24

15 6 Afbeeldingen toevoegen Het is in WordPress natuurlijk ook mogelijk om afbeeldingen te gebruiken in je pagina s en berichten. De vraag is alleen hoe je dit precies kunt doen: daarvoor is dit artikel. Hierin zullen de verschillende mogelijkheden stap voor stap worden behandeld. 6 1 Media toevoegen optie De snelste manier om een afbeelding toe te voegen, is om in de (visual) editor van WordPress de optie Media toevoegen te gebruiken. Deze is links bovenin het scherm te vinden (onder het titel veld). Als je op deze knop klikt, opent er een venster waarin je kunt kiezen welke afbeelding je wilt gebruiken. Je hebt hierbij twee mogelijkheden om de afbeelding te kiezen: vanuit je mediabibliotheek of door een nieuwe afbeelding te uploaden. In beiden gevallen komt het gebruik op hetzelfde neer, behalve dat je bij het uploaden eerst de afbeelding op je computer moet selecteren en uploaden. Nadat dit gedaan is, zal de afbeelding in je mediabibliotheek worden weergegeven en standaard geselecteerd zijn. Let op dat als je meer afbeeldingen tegelijk uploadt, dat deze allemaal geselecteerd zullen staan. Als je dus maar één hiervan op een bepaalde plek wilt invoegen, moet je eerst de rest de-selecteren of alle afbeeldingen zullen in je bericht worden ingevoegd. Als je geen afbeelding geüpload had, omdat hij al in je mediabibliotheek stond, dan hoef je hem nu alleen te selecteren. Nadat de juiste afbeelding geselecteerd is, zal je aan de rechterkant een aantal gegevens over de afbeelding vinden, waaronder een aantal opties die je kunt instellen: Pagina 11 van 24

16 URL: Op dit veld na, is alles naar eigen wensen aan te passen. Hier staat namelijk het pad naar de afbeelding ingesteld. Titel: Hier kun je de titel van je afbeelding invullen. Standaard zal hier de bestandsnaam ingevuld staan. Deze titel wordt in de mediabibliotheek gebruikt om aan te geven om welk bestand het gaat. Het is dus verstandig om afbeeldingen een unieke naam te geven zodat ze later, als het nodig is, goed terug te vinden zijn in je mediabibliotheek. Onderschrift: Indien nodig kan je hier een korte uitleg bij de afbeelding opgeven. Deze zal vervolgens onder de afbeelding worden geplaatst. Alt-tekst: Dit is de tekst die wordt weergegeven als de afbeelding om een of andere reden niet geladen kan worden. Vaak is het handig om een beschrijvende tekst van de afbeelding in te vullen, zodat je bezoekers toch weten wat er in de afbeelding te zien zou moeten zijn. Beschrijving: Een lange(re) beschrijving bij je afbeelding. Deze wordt vaak weergegeven als je een thumbnail gebruikt die vervolgens naar een grotere afbeelding linkt. Uitlijning: Hier kun je aangeven of je de afbeelding links, rechts of in het midden uitgelijnd wilt hebben. Het is afhankelijk van je thema hoe dit er precies uit ziet, dus probeer het eens uit. Je kunt er ook voor kiezen om geen uitlijning te hebben. In dat geval wordt de afbeelding in de regel geplaatst. Dit gebruik je meestal alleen voor kleine afbeeldingen die niet veel groter zijn dan een letter. Link naar: Hier kan je aangeven wat er gebeurt als er op de afbeelding geklikt wordt. Standaard zal dit op Mediabestand ingesteld zijn en dit betekent dat de bezoeker de afbeelding te zien zal krijgen in het formaat zoals hij geüpload is. De andere opties die je hebt, zijn Bijlagepagina, wat inhoudt dat de gebruiker doorgestuurd zal worden naar een pagina waarop de afbeelding te zien zal zijn, Aangepaste URL, wat inhoudt dat je een eigen link kunt opgeven waar de bezoeker heen gestuurd zal worden (bijvoorbeeld een andere website of pagina), en tenslotte is er ook nog Geen, wat inhoudt dat er niet op de afbeelding geklikt kan worden. Afmetingen: Afhankelijk van de grootte van je afbeelding, kun je hier uit drie (of dus minder) standaard opties kiezen: Thumbnail: Je afbeelding zal in het formaat van pixels worden ingevoegd. Let er wel op dat de afbeelding wordt bijgesneden als deze niet van zichzelf vierkant is. Gemiddeld: Hierbij wordt je afbeelding in het formaat van pixels ingevoegd. Let er wederom op dat hij zal worden bijgesneden als de afbeelding niet vierkant is. Volledige grootte: Hierbij wordt de afbeelding op volledige grootte ingevoegd. De afmetingen hiervan hangen af van de afmeting van de gebruikte afbeelding. Als alles naar wens is ingesteld, klik je rechts onderin op Invoegen in bericht en de afbeelding zal aan je bericht worden toegevoegd. Vervolgens kun je de afbeelding verslepen om hem op een betere plek te krijgen. Let er hierbij wel op dat de editor vaak niet de exacte plek van de afbeelding laat zien zoals hij op de website zal zijn. Het is dus verstandig om afbeeldingen eerst te controleren door een conceptversie van je bericht of pagina te maken en deze te bekijken. Wanneer alles goed uitgelijnd is, kun je het daarna natuurlijk publiceren. Tip: Het is ook mogelijk om je afbeelding in je bericht in te voegen en achteraf de instellingen te bewerken. Je kunt dit doen door op de afbeelding te klikken en op het potlood icoon te klikken. Het is daarbij alleen niet mogelijk om de titel en beschrijving aan te passen. Ook kun je achteraf de grootte van de afbeelding bijstellen door erop te klikken en de vierkantjes rondom te verslepen. Zo kan je de afbeelding net iets beter laten passen dan wanneer je gebruik maakt van de standaard beschikbare formaten. Pagina 12 van 24

17 6 2 FTP en HTML Het wordt aangeraden om de afbeeldingen via WordPress te uploaden en niet via FTP. Dit omdat er dan door WordPress bijgehouden zal worden waar de afbeelding zich bevindt en, stel dat je van domeinnaam verhuist of je permalinks aanpast, zal de afbeelding blijven werken. Terwijl dit waarschijnlijk niet het geval zal zijn met de hard-coded HTML paden; deze zullen naar een locatie wijzen waar de afbeelding niet langer te vinden is. Het is ook mogelijk om afbeeldingen te gebruiken zonder dat je ze aan de mediabibliotheek hoeft toe te voegen in WordPress. Dit wordt voor de AJO website afgeraden. Hiervoor heb je een PTP programma nodig en wat verstand van HTML. Allereerst start je je FTP programma en kies je een map waarin je de afbeelding wilt uploaden (bijvoorbeeld /wp-content/uploads). Upload vervolgens de afbeelding en onthoud en onthoud hiervan de plek als je afwijkt van /wp-content/uploads. Vervolgens log je in op je website en maak je een bericht of pagina aan. Hierna ga je in de tekst-modus van de editor en voeg je de volgende HTML code toe: <img src= pad_naar_afbeelding class= klasse alt= alt_tekst width= breedte height= hoogte /> Hierin moet je zelf een aantal dingen aanpassen: pad naar afbeelding: Hier moet je het volledige pad naar de afbeelding invullen, bijvoorbeeld klasse: Het is afhankelijk van je thema wat je hier precies in moet vullen. De klasse heeft te maken met de uitlijning van je afbeelding, dus het is verstandig om een afbeelding in te voegen via de Media toevoegen optie en vervolgens in de HTML te kijken welke klasse er gebruikt wordt. alt_tekst: Hier kan je de alternatieve tekst invoegen die wordt weergegeven als de afbeelding niet geladen kan worden. width: De breedte van de afbeelding in pixels. height: De hoogte van de afbeelding in pixels. Tip: je kunt er ook voor kiezen om alleen height of width in te vullen. De afbeelding zal in dat geval automatisch geschaald worden zodat er aan de hoogte of breedte voldaan wordt. Op die manier zorg je ervoor dat je afbeelding zijn originele verhoudingen behoudt. Als je wilt dat er geklikt kan worden op de afbeelding, kan je de volgende code om de afbeelding plaatsen: <a href= link > </a> Hierbij kun je als link meerdere opties opgeven zoals het pad naar de afbeelding of de link naar een andere pagina of website. De code zal er uiteindelijk als volgt uit zien: <a href= link ><img src= pad_naar_afbeelding class= klasse alt= alt_tekst width= breedte height= hoogte /></a> Pagina 13 van 24

18 Als je nu terug gaat naar de visuele editor, en je alles goed hebt gedaan, zal je de afbeelding in je bericht moeten zien staan. 6 3 Afbeelding verwijderen uit bericht Het is natuurlijk om mogelijk om een afbeelding weer te verwijderen. Om dit te doen, klik je op de afbeelding en klik je op het kruisje dat dan verschijnt. De afbeelding zal dan direct worden verwijderd. Het is ook mogelijk om je afbeelding, als is het wel beperkt, te bewerken in WordPress zelf. Lees hier meer over in hoofdstuk PDF bestand opnemen in een bericht (of pagina) Een PDF bestaand kan niet zoals een afbeelding in een bericht op pagina getoond worden. Een PDF bestand kan alleen in de mediabibliotheek worden opgenomen. De link die WordPress toekent aan het PDF bestand kan dan gebruikt worden om een linkadres meet te vullen. Als deze pagina/bericht getoond wordt ziet men de linktekst en als men klikt op de link dan wordt het PDF bestand gedownload. Als men toch de inhoud van een PDF bestand direct op de AJO website wil tonen dan moet men: 1. van het PDF bestand een afbeelding maken (bijvoorbeeld met de website ; 2. De verkregen afbeelding in de mediabibliotheek opnemen; 3. Deze afbeelding op de AJO website zetten zie paragraaf 6 1 Pagina 14 van 24

19 7 Afbeeldingen bewerken Als je wat simpele aanpassingen aan een afbeelding wilt maken zoals bijsnijden of roteren, dan is dit ook mogelijk in de WordPress mediabibliotheek. Dit is erg handig voor de keren dat je erachter komt dat een afbeelding net niet goed past in je tekst. Je hoeft dan niet de afbeelding in een programma te bewerken en opnieuw te uploaden; je kunt het gewoon meteen aanpassen op je website zelf! Hoe je dit kunt doen en wat er allemaal mogelijk is, zal worden besproken in dit hoofdstuk. 7 1 Bewerken vanuit visuele editor Als je je bericht of pagina aan het typen bent en je hebt een afbeelding ingevoegd, dan kun je op deze afbeelding klikken en vervolgens op het potlood icoon klikken. Er zal dan een venster openen waarin je een aantal eigenschappen van de afbeelding kunt aanpassen. Aan de rechterkant in dit venster, zie je de afbeelding zelf met daaronder de optie Origineel bewerken. Klik hierop en je komt in het Afbeelding bewerken scherm terecht. Meer informatie over de verschillende opties vindt je onder het kopje Bewerkmogelijkheden in dit bericht. 7 2 Bewerken vanuit mediabibliotheek Je kunt afbeeldingen ook vanuit de mediabibliotheek aanpassen. Om dit te doen ga je naar Media > Bibliotheek en zoek je in de lijst de afbeelding die je wilt bewerken. Vervolgens klik je op de naam van de afbeelding of op Bewerken, deze optie wordt zichtbaar als je er met de muis overheen gaat. Je krijgt nu de afbeelding te zien met een aantal instellingen die je aan kunt passen. Klik hier op Afbeelding bewerken en je komt in het bewerkvenster terecht. 7 3 Bewerkmogelijkheden Hieronder worden de bewerkmogelijkheden stuk voor stuk uitgelegd. Let er op dat je na je bewerkingen op Opslaan moet klikken voordat ze daadwerkelijk op de afbeelding worden toegepast en worden opgeslagen. 7 4 Bijsnijden Je kunt (ongewenste) onderdelen van een afbeelding verwijderen door deze bij te snijden. Om dit te doen, klik je op de afbeelding en versleep je de muis. Je hebt nu een gedeelte geselecteerd wat je overhoudt als je de afbeelding bijsnijdt. Je kunt deze selectie achteraf nog aanpassen door opnieuw een gedeelte te selecteren of de huidige selectie te vergroten / verkleinen door de vierkantjes rondom de selectie te verslepen. Aan de rechterkant heb je ook een vak genaamd Afbeelding bijsnijden. Deze kun je ook gebruiken om je selectie te ondersteunen. Zo is het mogelijk om een Aspect ratio Pagina 15 van 24

20 (verhouding) in te stellen, zodat je selectie aan een bepaalde verhouding voldoet. Je kunt er ook voor kiezen om je selectie op een pixel nauwkeurig aan te passen door de formaten naar Selectie te wijzigen. Wanneer je het goede stuk van je foto geselecteerd hebt, klik je bovenin op het bijsnijden icoon. De afbeelding zal worden bijgesneden en je kunt meteen het resultaat zien. Als je blij bent met het resultaat, dan kan je hem opslaan door op Opslaan te klikken. Zo niet, dan kan je op Annuleren klikken of bovenin op het pijltje terug klikken (ongedaan maken). 7 5 Roteren Je kunt je afbeelding ook met de klok mee of tegen de klik in roteren. De rotatie hiervan is steeds 90 graden. Om de afbeelding te roteren, kun je de volgende twee knoppen gebruiken: Nadat je de afbeelding geroteerd hebt, kan je de wijzigingen opslaan door op Opslaan te klikken. 7 6 Spiegelen Het is ook mogelijk om je afbeelding te spiegelen. Dit kan zowel horizontaal als verticaal gedaan worden. Om de afbeelding te spiegelen, kun je de volgende twee knoppen gebruiken: Nadat je de afbeelding gespiegeld hebt, kan je de wijzigingen opslaan door op Opslaan te klikken. 7 7 Schalen Je beschikt ook over de mogelijkheid om de afbeelding te schalen. Voor het beste resultaat moet je de afbeelding schalen voordat je andere dingen doet (zoals bijsnijden, roteren, etc.). Ook is het met schalen alleen mogelijk om de afbeelding kleiner te maken en niet groter. Je kunt de afbeelding schalen door rechts in het vak Afbeelding schalen een formaat op te geven in de velden. Het eerste veld is de breedte, het tweede veld de hoogte. Het zal je vast opvallen dat als je een veld invult, het andere veld automatisch wordt bijgewerkt. Dit komt doordat het schalen alleen in een bepaalde verhouding kan gebeuren. Wanneer je dus een hoogte invult, wordt er automatisch een bijbehorende breedte berekend. Pagina 16 van 24

21 Nadat je de afmetingen hebt opgegeven, klik je op Schaal om het toe te passen. 7 8 Ongedaan maken / opnieuw Nadat je de afbeelding hebt gewijzigd, maar nog niet hebt opgeslagen, is het mogelijk om onderdelen ongedaan te maken of opnieuw te doen. Dit kan met behulp van de volgende twee knoppen: 7 9 Terug naar origineel Nadat een afbeelding is bewerkt en opgeslagen, is het altijd nog mogelijk om weer terug te gaan naar het origineel. Je zult hiervoor de optie Originele afbeelding herstellen kunnen gebruiken. Deze is alleen zichtbaar als er wijzigingen zijn opgeslagen en is te vinden onder het Afbeelding schalen vak. Als je de afbeelding herstelt, worden daarmee alle wijzigingen ongedaan gemaakt. Het is dus niet mogelijk om alleen de laatste wijziging ongedaan te maken als de afbeelding al is opgeslagen. Pagina 17 van 24

22 8 Hoe voeg je een video toe In oudere versies van WordPress, die van voor 2.9, moest je of een embed code gebruiken of een plugin om video s mooi in je bericht te krijgen. Vanaf WordPress 2.9 wordt gelukkig Embed ondersteund en dit maakt alles een stuk makkelijker. Tegenwoordig zijn we al aangekomen bij WordPress 4.1 en worden er een hoop populaire video-websites ondersteund. In dit bericht zullen we het over de ondersteunde websites hebben en hoe je gemakkelijk een video kunt plaatsen. 8 1 Hoe embed je een video in een WordPress bericht Als de website door WordPress wordt ondersteund, hoef je alleen de link naar de video in je bericht te plaatsen en zal hij automatisch worden omgezet. Je moet er hierbij wel voor zorgen dat de link op een eigen regel staat en dat deze niet omgezet is naar een hyperlink (dus mag niet klikbaar zijn). Hieronder een voorbeeld hoe je een YouTube video zou kunnen toevoegen: Tekst die voor de video wordt weergegeven. Bedoeld ter opvulling. http: // Tekst na het filmpje, zodat je ziet dat de video op een eigen regel staat. Meer dan dit hoef je niet te doen. De link zal in de visuele editor automatisch omgezet worden naar het filmpje, dus je kunt meteen zien of het goed gegaan is. 8 2 Welke websites worden door WordPress ondersteund Met de laatste versie van WordPress (op het moment van schrijven 4.1), worden de volgende websites ondersteund en zal je alleen de URL van de video nodig hebben: Website Ondersteund sinds Animoto WordPress 4.0 Blip WordPress 2.9 CollegeHumor WordPress 4.0 DailyMotion WordPress 2.9 Flickr WordPress 2.9 FunnyOrDie.com WordPress 3.0 Pagina 18 van 24

23 Hulu WordPress 2.9 Imgur WordPress 3.9 Instagram WordPress 3.5 isnare WordPress 2.9 Issuu WordPress 4.0 Meetup.com WordPress 3.9 EmbedArticles WordPress 3.9 Mixcloud WordPress 4.0 Photobucket WordPress 2.9 PollDaddy WordPress 3.0 Rdio WordPress 3.6 Revision3 WordPress 2.9 Scribd WordPress 2.9 SlideShare WordPress 3.5 SmugMug WordPress 3.0 SoundCloud WordPress 3.5 Spotify WordPress 3.6 TED WordPress 4.0 Twitter WordPress 3.4 Vimeo WordPress 2.9 Pagina 19 van 24

24 Vine WordPress 4.1 WordPress.tv WordPress 2.9 YouTube WordPress 2.9 Deze lijst zal bijgehouden worden wanneer er een nieuwe versie van WordPress uitkomt. Voor de meest actuele informatie hierover kan je ook terecht bij de WordPress Codex zelf. In het geval van YouTube en Twitter zijn er een paar punten waar rekening mee moet worden gehouden. YouTube: Het is hierbij niet mogelijk om privé video s en playlists in je bericht te gebruiken. Twitter: Bij oudere versies van WordPress kan het voorkomen dat het niet goed gaat als je https gebruikt. In dat geval kan je gewoon de s weghalen en zou de video wel moeten werken. 8 3 Waarom externe website gebruiken voor video s Het is natuurlijk ook mogelijk om video s naar je eigen website te uploaden en die te gebruiken, het wordt alleen niet aangeraden om dit te doen. Video s verbruiken namelijk veel dataverkeer en zijn zwaar voor de webserver. Mocht het zo zijn dat je video erg populair is en veel bezoekers trekt, dan kan dit betekenen dat je server het niet aankan en je website (tijdelijk) ontoegankelijk wordt. De externe websites zoals YouTube, en de rest in de lijst, zijn hier op berekend en dus is het handiger om hen ervoor te gebruiken. Verder is het natuurlijk fijn als je video extra bezoekers krijgt doordat mensen er per toeval op terecht komen. Zo heb je bij YouTube de gerelateerde video s waar je tussen zou kunnen staan. Pagina 20 van 24