1. Algemeen uitleg WordPress / CMS

Transcriptie

1 Inhoud WordPress 1. Algemeen uitleg WordPress / CMS 3 A. Wat is een CMS? 3 B. Wat is WordPress? 3 C. Inloggen 3 D. Uitloggen 4 2. Berichten 5 A. Bericht opstellen 5 B. Bericht met een plaatje 6 C. Bewerkmogelijkheden tekst 7 1. Functionaliteiten invoerscherm 7 2. Plakken vanuit word of website 7 D. Hoe maak ik een externe of interne link? 8 1. Externe link 8 2. Interne link 8 3. Het verschil tussen berichten en pagina s 9 4. Mediabibliotheek 10 A. Wat is de media bibliotheek? 10 B. Plaatje van internet en met goede titel opslaan 10 C. Plaatje aan de media bibliotheek toevoegen Plaatje op harde schijf zetten Toevoegen aan media bibliotheek Gegevens van een afbeelding bewerken 10 D. Voeg een uitgelichte afbeelding toe 11 Let op: Wel/niet gekoppeld 11 E. Galerij instellen 12 F. Pdf s invoegen PDF toevoegen aan mediabibliotheek Invoegen in pagina of bericht Hoe koppel ik naar een bericht of pdf? Nieuwsberichten. 14 A. Theorie 14 B. Maak Nieuwsbericht Categorieën 15 Korte samenvatting WordPress Functionaliteiten invoerscherm Links Plaatje of bestand toevoegen Nieuwsbericht en uitgelichte afbeelding Extra 18 A. Plaatsing in WordPress 18 B. Thema s 18 C. Sidebar en widgets 18 D. Contactformulier 19 E. Plugins 19

2 2

3 1. Algemeen uitleg WordPress / CMS A. Wat is een CMS? CMS staat voor Content Management Systeem. Dat is softwaretoepassing in een webpagina, die het mogelijk maakt dat mensen eenvoudig gegevens, plaatjes en documenten op internet/intranet kunnen publiceren. Met andere woorden: jullie voeren de tekst en plaatjes zonder al te veel lay-out in, terwijl deze wel met een lay-out op de pagina verschijnen. B. Wat is WordPress? WordPress is publicatie software dat zich richt op gebruiksgemak en snelheid om even iets op het Intranet te zetten. Het was vroeger vooral voor weblogs en wordt steeds meer ingezet als CMS. Met welke onderdelen gaan ik werken? De belangrijkste knoppen zijn C. Inloggen Bij elke WordPress site die je maakt kan je inloggen door achter het internetadres (URL) deze tekst te typen: wp-admin Indien nodig met één / ertussen: Dan kom je bij het inlogscherm. 3

4 D. Uitloggen Aan de bovenkant heb je een zwarte werkbalk. Rechts ervan staat je inlognaam. Klik daarop en klik op uitloggen. 4

5 2. Berichten A. Bericht opstellen Onder Berichten in het menu links, klik je op Nieuw Bericht. Stappen 1. Voer de titel in. 2. Voer de tekst van het bericht in. 3. Geef een categorie aan (voor een plaatje: ga verder met stap 2B.2). 4. Klik op Publiceren. Deze blauwe knop verandert in Bijwerken nadat het bericht voor de eerste keer is opgeslagen. 5

6 B. Bericht met een plaatje Zorg dat je plaatje op je netwerkschijf (of harde schijf van de pc) te bereiken is. De meeste plaatjes krijg je aangeleverd (of je leert hoe je ze op het juiste formaat maakt). Stappen 1. Maak een bericht aan (zie 2A t/m stap 3). 2. Na stap 3 ga je eerst op de plek staan in het bericht vak waar het plaatje ongeveer moet komen. Klik op de knop Media Toevoegen. Staat het plaatje er niet bij: klik dan bestanden kiezen en zoek het plaatje op de harde schijf op. 3. Klik in het midden van het scherm in het overzicht het plaatje aan dat je wilt toevoegen. Rechts in beeld verschijnen de gegevens van dat bestand. 4. Check of de titel (1) en alternatieve tekst (2) goed ingevuld staan. Geef ze anders aan. 5. Geef aan welke uitlijning en afmeting het plaatje moet krijgen. 6. Klik rechtsonder op Invoegen in bericht of In pagina invoegen (3). of 6

7 C. Bewerkmogelijkheden tekst 1. Functionaliteiten invoerscherm Als je een bericht of pagina maakt, dan heb je na de titel het grote tekst vak, waarboven twee balken staan. Hieronder zie je welke knopjes wat doen. Zorg ervoor dat je kopjes maakt in een langer stuk tekst. Dat maakt het geheel leesbaarder. Deze vind je onder het vak alinea als je op het pijltje drukt. Hou voor de meeste teksten kop 2 aan. 2. Plakken vanuit word of website Microsoft Word lijkt platte tekst weer te geven, maar dat is niet zo. MS Word voegt een hele hoop troep aan extra codes toe, wat je dan mee plakt in een WP bericht of pagina. Gebruik daarom eerst het daarvoor bestemde knopje, klik OK bij de uitleg, plak de tekst in het vak, en dan heb je de echte tekst te pakken Ook een website voegt een hele hoop troep toe, wat je dan mee plakt. Klik dus weer eerst op dat knopje voor je plakt. Heb je de tekst al staan? Daarvoor heb je ook een knopje om er platte (dus opmaak loze) tekst van te maken. Selecteer de tekst en klik (opmaak wissen). 7

8 D. Hoe maak ik een externe of interne link? In een stukje tekst van een pagina of (nieuws) bericht selecteer je de woorden die een link moeten vormen, bijv. tekst. Dan klik je op het knopje link. 1. Externe link Na het klikken op Link zie je: Als je nu in dat venster een URL (internet adres) ingeeft (zoals en een titel, dan heb je een externe koppeling gemaakt. Bij een link naar buiten het netwerk (of naar een extern bestand) zet je het vinkje aan. 2. Interne link Klik voor binnen de site op Of link naar bestaand bericht of pagina. Je ziet dan: Klik je een interne pagina aan in het onderste deel, dan maak je een link die in de site blijft. Je kan ervoor kiezen het vinkje wel of niet aan te zetten. Bij een bestand zet je het vinkje aan. 8

9 3. Het verschil tussen berichten en pagina s Er zijn in WordPress Berichten en Pagina s. Een pagina bevat elementen zoals tekst, afbeeldingen etc. maar kan ook berichten bevatten. Berichten kunnen echter alleen in een pagina getoond worden. Berichten met bijbehorende categorieën vormen de basis van een blog. Pagina s kunnen statische elementen bevatten, of een overzicht van (blog)berichten. Nieuwsberichten Een speciaal soort berichten vormen de nieuwsberichten, welke een eindigheid / actualiteit hebben (zie hoofdstuk 4). Deze krijgen altijd een aparte categorie mee (bijv. Nieuws) en kunnen apart van de rest van het blog getoond worden. Bijvoorbeeld als een evenement georganiseerd wordt, dan wil je dat mensen ervan weten door middel van een bericht, maar het is niet meer relevant als de datum geweest is. 9

10 4. Mediabibliotheek A. Wat is de media bibliotheek? De verzameling van alle plaatjes en bestanden (Word of pdf) van de hele site. Let op: alle gebruikers die kunnen inloggen op een site kunnen hier bij. B. Plaatje van internet en met goede titel opslaan Ga naar een site als en zoek een plaatje. Open het plaatje Sla het plaatje dan op (rechterknop) met een duidelijke naam. Bijvoorbeeld als ZomersGraanveld.jpg. Zo heb je meteen een goede titel. C. Plaatje aan de media bibliotheek toevoegen 1. Plaatje op harde schijf zetten Zorg dat je plaatje op je netwerkschijf (of harde schijf van de pc) te bereiken is. De meeste plaatjes krijg je aangeleverd of je leert hoe je ze op het juiste formaat maakt bijv. na het downloaden van Internet (zie 4B). 2. Toevoegen aan media bibliotheek Volg dan de deze stappen: 1. Klik onder Media op Nieuw bestand. Klik bestanden kiezen en zoek het plaatje op. 2. Klik achter het bestand bewerken aan (het bestand opent, zie onderstaand voorbeeld). 3. Geef in het overzicht de titel (1) en alternatieve tekst op (2) en eventueel een beschrijving. 4. Klik op Bijwerken (3) om op te slaan. 3. Gegevens van een afbeelding bewerken Ga naar Media. Klik op Bibliotheek. Zoek met het zoekveld het plaatje in de mediabibliotheek, klik op de titel. In het venster Media bewerken (dezelfde als hierboven) bewerk je de gegevens. Klik op de knop Bijwerken om op te slaan. 10

11 D. Voeg een uitgelichte afbeelding toe Eerst zorg je ervoor dat het plaatje dat als uitgelichte afbeelding gebruikt gaat worden in de mediabibliotheek staat. Zie hiervoor 4C. Stappen 1. Maak het bericht aan dat het plaatje nodig heeft of open het. Maak het bericht volledig af. Zie hoofdstuk 2 of 5 voor (nieuws)berichten. 2. In de rechtse kolom zie je het hokje uitgelichte afbeelding, eventueel moet je het uitklappen, klik op de link. 3. Je krijgt nu de mediabibliotheek te zien. Klik op het plaatje dat je wilt gebruiken of upload het met in de naam _uitgelicht op het eind (zie ook stukje Let op: wel/niet gekoppeld hieronder ). Aan de rechterkant kan je nu de gegevens controleren. Zorg voor een goede titel (eindigend op _uitgelicht ) en alternatieve tekst! 4. Klik op de blauwe knop Uitgelichte afbeelding instellen. 5. In de rechtse kolom van het bericht staat nu in het klein het plaatje. In stap 1 heb je het bericht al verder helemaal klaar gemaakt. Nu hoef je alleen nog maar het bericht te Publiceren. Als je het bericht al eerder had opgeslagen, klik je nu op de knop Bijwerken Je kan nu het bericht bekijken. De uitgelichte afbeelding zie je in principe pas als je de lijst met berichten bekijkt. Let op: Wel/niet gekoppeld Let op met uitgelichte afbeeldingen. In de mediabibliotheek staat bij plaatjes die gebruikt zijn in bericht aangegeven dat ze gekoppeld zijn. Echter uitgelichte afbeeldingen staan als niet-gekoppeld. Het kan daarom handig zijn om een uitgelichte afbeelding ergens in het bericht te gebruiken. Het beste is om een uitgelichte afbeelding meteen in de naam _uitgelicht mee te geven, dus meteen al bij het opslaan. Dit helpt om de mediabibliotheek overzichtelijk te houden en je voorkomt dat je per ongeluk uitgelichte (en dus niet gekoppelde) afbeeldingen verwijderd bij het opschonen van de mediabibliotheek. 11

12 E. Galerij instellen 1. Ga naar het bericht of de pagina waar de galerij (meerdere afbeeldingen na elkaar tonen) geplaatst moet worden. Zet de cursor op de juiste plek in het tekst vak. 2. Klik op 3. Klik aan de linkerkant van het scherm op 4. Klik de plaatjes aan die in de galerij getoond moeten worden. Rechtsboven in het plaatje komt nu een vinkje te staan. 5. Druk rechtsonder in beeld één keer met de linkermuisknop op de knop 6. Stel nu aan de rechterkant deze gegevens in Type op Slideshow en Link op Geen. 7. Klik op de knop en sla het bericht/de pagina op met publiceren / bijwerken. F. Pdf s invoegen 1. PDF toevoegen aan mediabibliotheek Je voegt het op dezelfde manier aan de bibliotheek toe als een plaatje: 1. Media > nieuw bestand > opzoeken 2. Gegevens invullen met een duidelijke naam (beschrijving bestand, geen Klik hier maar Jaarverslag2015.pdf) 3. Klik op Opslaan. Let op: maak geen link of pdf met de tekst klik hier. Dit is in DIE tekst misschien nog duidelijk, ook niet altijd, maar in je dashboard wordt het een onoverzichtelijke lijst van bestanden die klik hier heten. In plaats van wanneer je een plaatje invoegt, moet je hier bedenken dat de titel ook de weergegeven tekst wordt. 12

13 2. Invoegen in pagina of bericht 1. Zet de cursor in de tekst waar de pdf moet komen (bijv. na iets van: Hier vind je de ) en klik op uploaden/toevoegen. 2. In het tabblad Mediabibliotheek zoek je de pdf (bijv. Folder WebWerk.pdf ). Klik op Tonen. 3. Geef de titel die in de tekst moet staan. (Hier is dat Folder WebWerk ) en een korte omschrijving. Let erop: zet niet overal hier als titel neer (dan wordt de tekst klik hier ) vanwege de indeling in de mediabibliotheek. 4. Klik op de knop Bestands-URL. 5. Klik tot slot op invoegen in bericht. Je pdf is nu in de tekst gelinkt. Dan sla je het bericht op met de blauwe knop (Publiceren bij de eerste keer opslaan of Bijwerken als het al opgeslagen was). 3. Hoe koppel ik naar een bericht of pdf? Wat als mijn bericht te lang wordt? Of wat als ik wil linken naar informatie die elders op de site staat? In beide gevallen maak je een link aan in je bericht. Bij de tweede vraag ga je te werk zoals bij 3.B. staat uitgelegd. Let op: maak geen link of pdf met de tekst klik hier. Dit is in DIE tekst duidelijk, maar in je mediabibliotheek wordt het een onoverzichtelijke lijst van klik hier items. Als blijkt dat je bericht te lang of onduidelijk wordt, kan je de informatie in stukjes knippen. Van elk stukje kan je dan of een korte verwijzing of een paar regels neer zetten in de andere stukjes. 1. Eerst maak je een bericht of pagina aan waar je naartoe gaat verwijzen (let op dat je een categorie aan vinkt). Of je zet een bestand/pdf in de mediabibliotheek. 2. Op de eerste pagina / in het eerste bericht schrijf je een verwijzing naar de uitgebreidere informatie. Selecteer de tekst en klik op de knop Link. Bij zoeken geef je de naam van het bestand/pdf/bericht /pagina, selecteer en klik op Link toevoegen. Voorbeeld Eerst plaats je de Folder WebWerk.pdf. Dan maak je een bericht of pagina aan met daarin de verwijzing Meer informatie lees je in de Folder. Selecteer dan in je tekst het woordje folder en klik op de knop Link. Door in het veld Zoeken van het venster Link invoegen de naam in te geven (Folder WebWerk.pdf) vind je het juiste pdf je. Deze koppel je aan de geselecteerde tekst door het te selecteren en op de knop Link toevoegen te klikken. De tekst, in het voorbeeld Folder wordt dan een hyperlink zoals je kent van Internet. 13

14 5. Nieuwsberichten. A. Theorie Nieuwsberichten zijn om meerdere redenen anders dan gewone (blog)berichten: Ze zijn tijdelijk geldig, bijvoorbeeld de aankondiging voor een evenement Ze hebben altijd een uitgelichte afbeelding nodig Ze hebben altijd in ieder geval de categorie Nieuws en verder 1 andere categorie In de eerste alinea wordt een korte samenvatting gegeven met daarin de antwoorden op Wie, Wat, Waar, Waarom, Wanneer en Hoe zoveel mogelijk verwerkt. B. Maak Nieuwsbericht Stappen zijn dezelfde bij elk bericht 1. Voer de titel in. 2. Voer de tekst van het bericht in. 3. Geef een categorie aan. Geef hier ook altijd de categorie Nieuws een vinkje. 4. Geef altijd een uitgelichte afbeelding aan. Kies deze uit de mediabibliotheek of upload een nieuwe afbeelding (zie hiervoor hoofdstuk 5). 14

15 5. Klik op Publiceren. Deze blauwe knop verandert in Bijwerken nadat het bericht voor de eerste keer is opgeslagen. 6. Categorieën Categorieën zorgen ervoor dat een bericht onder een bepaalde noemer kan vallen. Het is op die manier mogelijk meer overzicht te houden. Bijv. nieuwsberichten kunnen gaan over actuele onderwerpen (die later niet meer van toepassing zijn) zoals een vakantiesluiting en dan geef je de categorieën Nieuws en HuishoudelijkeMededelingen mee. Niet alleen is dan in het dashboard overzicht van berichten te filteren op één of beide categorieën. Je kan ook een pagina toevoegen met alleen maar nieuwsberichten of op de homepage in een zijbalk de blogberichten in de Nieuws categorie tonen. Daarnaast is de lijst met berichten te bereiken via bijv. Geef daarom in elk (nieuws)bericht een categorie aan vóórdat je die de eerste keer opslaat. 15

16 Korte samenvatting WordPress 1. Functionaliteiten invoerscherm Als je een bericht of pagina maakt, dan heb je na de titel het grote tekst vak, waarboven twee balken staan. Hieronder zie je welke knopjes wat doen. 2. Links Externe link 1. Voer een externe URL in ( etc.). 2. Geef de linktekst op, bijv. de naam van de site. 3. Vinkje bij open in nieuw venster/tab. 4. Klik op Link toevoegen. Interne link oek het bericht / de pagina die je wil koppelen. Klik op de regel met dat bericht/die pagina. 2. Geef de link tekst op. 3. Géén vinkje bij open link in nieuw. 4. Klik op Link toevoegen. 1. Z 16

17 3. Plaatje of bestand toevoegen Aan de mediabibliotheek 1. Ga naar Mediabibliotheek. Klik op Nieuw Bestand. 2. Zoek het bestand op de computer, vul de gegevens in en sla het op. In een bericht/pagina 1. Zet de cursor op de plek waar je het plaatje wil toevoegen, klik op Media toevoegen. 2. Kies een plaatje uit, of voeg toe via Bestand uploaden, en controleer de gegevens 3. Klik op Invoegen in. Een bestand/pdf voeg je op dezelfde manier toe. Let hierbij op de naamgeving van de PDF en de linktekst! 4. Nieuwsbericht en uitgelichte afbeelding Nieuwsberichten zijn tijdelijk,, hebben als categorie in ieder geval Nieuws en bevatten een uitgelichte afbeelding. Ze zijn sterk gericht op de informatie regels: Wie Wat Waar Wanneer Waarom Welke manier (Hoe). Een uitgelichte afbeelding voeg je toe door in de kolom rechts op de link uitgelichte afbeelding te klikken, het plaatje uit te zoeken en op de knop invoegen te klikken, waarna je het bericht opslaat. 17

18 7. Extra A. Plaatsing in WordPress In het algemeen geldt dat er geen Word en Excel bestanden op de site gezet worden. Gebruik hoofdletters als begin van een bericht, plaatje of pdf voor je het op Intranet opslaat/upload. Voor nieuwsberichten gebruik je een uitgelichte afbeelding. Deze maak je niet te groot. Voor elke tekst geldt dat de vragen Wie, Wat, Waar, Wanneer, Waarom en Hoe (= 5 W s en H) beantwoord worden in de tekst zelf. Voor nieuwsberichten geldt: in de 1e alinea schrijf je heel kort waar het om gaat (= 5 W s en H). Dit stukje van 2 à 3 zinnen is namelijk meteen zichtbaar in het overzicht. Daarna kan de langere uitleg in de rest van het nieuwsbericht staan. Denk hierbij aan een krantenartikel: in het eerste, meestal vetgedrukte, stukje staat eigenlijk bijna alles al. B. Thema s WordPress werkt met thema s waarin wordt aangegeven hoe bepaalde onderdelen van de site worden weergegeven. Zo wordt vastgelegd hoeveel kolommen in de site zitten en hoeveel ruimte deze innemen. Of dat er één of twee menu s in staan. Je kan onder Weergave Thema s kijken naar de voor de site geïnstalleerde thema s. Met Live Voorbeeld kan je een thema tonen, zonder dat de site meteen er anders uitziet voor bezoekers. Bij het project WebWerk werken wij met het thema Divi, wat veel mogelijkheden biedt voor de lay-out en flexibele invulling van een site. C. Sidebar en widgets Eén van de veelgebruikte onderdelen van sites zijn de Sidebar / zijbalk en daaronder vallende widgets. Een zijbalk is een kolom van ¼ of 1/3 schermbreedte waarbinnen je widgets kan plaatsen. Widgets zijn blokjes met extra mogelijkheden, zoals een archief of zoekbalk. Je vindt het onder Weergave Widgets. Het linkerdeel van het scherm zijn alle mogelijke widgets, rechts zie je de balken in dat thema waarbinnen de widgets komen. 18

19 D. Contactformulier Het contactformulier is een belangrijk onderdeel op een site om feedback van je bezoekers te krijgen. Je kan het als onderdeel van een pagina maken met een widget of een aparte contact pagina aanmaken en daarop een contactformulier tonen. Stappen contactpagina 1. Maak onder Pagina s een nieuwe pagina aan 2. Geef de pagina een titel, zoals Contact. 3. Zet de cursor in het tekst vak. Klik op de knop 4. Zet eerst in het tabblad notificaties je adres en een eventuele vaststaande onderwerp regel (zodat je het snel herkent in je ), klik dan op het tabblad Formulier opbouwfunctie. 5. Er staan al 4 velden. Je kan hier eventueel velden aan toevoegen, zoals 6. Klik op en vervolgens op Publiceren dan wel Bijwerken. E. Plugins Plugins zijn hulpmiddelen die de functionaliteit van WordPress uitbreiden, Het is eigenlijk een cool stukje programmering dat iets extra s biedt. Hierdoor ontstaan nieuwe mogelijkheden of bestaande worden verbeterd, er zijn allerlei opties zoals een weerbericht, een waarderingssysteem of iets anders. Het aantal plugins die beschikbaar zijn is gigantisch waardoor deze niet standaard toegevoegd zijn aan WordPress zelf. Bij het Project WebWerk hebben we gekozen voor bepaalde standaard in te zetten plugins. 19