WordPress Handleiding Inhoud Inleiding Wat is WordPress ? Hoe werkt het?
3 3
De voordelen van WordPress Eenvoudig in gebruik Flexibel Snel Wordt constant verbeterd
3 3 3 4
Front-end / back-end Front-end Back-end Inloggen Dashboard De WYSISWYG-editor Algemene instellingen Profiel Weergeven alle iconen Groter tekstvenster Berichten Wijziging ongedaan maken HTML code bewerken
4 4 4 5 6 7 8 8 8 8 9 9
Pagina's, Categoriën en Tags Pagina's Nieuwe pagina maken Pagina opmaken Tekst onderstrepen Maken van tekstkop Tekst plakken vanuit Word Tips voor het opmaken van je pagina of bericht Extra schermopties Een pagina bewerken Een pagina in de prullenbak plaatsen Een pagina permanent verwijderen / herstellen Categorieën Tags
9 9 11 11 11 11 12 13 14 14 15 16 17
© istiecool.nl
pag. 1
Zelf menu's maken Navigatie
18
Media en contentbeheer Nieuwe media uploaden naar de website Het gebruik van media Media verwijderen Toevoegen PDF of Microsoft Office bestand Twitter bericht plaatsen Video's van Youtube op je pagina tonen Een hyperlink of koppeling invoegen / wijzigen / verwijderen
20 20 20 20 20 21 21
Afbeeldingen Een afbeelding invoegen / bewerken / verwijderen Een afbeelding invoegen: Van je computer Een afbeelding invoegen: Via de mediabibliotheek Een afbeelding bewerken Afbeeldingen online schalen Een afbeelding verwijderen
23 24 24 25 25 25
Fotogallery ( NextGEN Gallery )
26
Shortcodes
29
Vindbaarheid in zoekmachine’s
28
Tips voor website promotie
30
Contact
33
Begrippenlijst:
34
© istiecool.nl
pag. 2
Inleiding Wat is WordPress? WordPress is een van de meest gebruikte Content Management Systemen (CMS) ter wereld. Concreet kan je met zo'n systeem zelf de website up-to-date houden: je kan inhoud toevoegen, wijzigen en verwijderen. Hoe werkt het? Om de inhoud van je CMS te beheren hoef je enkel in te loggen in een speciaal gedeelte van je website. Daar kom je terecht in een omgeving waar je een overzicht hebt van alle mogelijkheden.
De voordelen van WordPress Wordpress is opensource-software. Dat wil zeggen dat er niet betaald hoeft te worden voor een licentie en dat iedereen ter wereld het programma kan aanpassen en verbeteren. Eenvoudig in gebruik Wordpress is eenvoudig in gebruik. Niet alleen is het gemakkelijk te installeren en te configureren, ook voor het aanmaken en up-to-date houden van de inhoud heb je géén technische kennis nodig. Flexibel Doordat Wordpress een flexibel platform is, is het gemakkelijk aan je wensen aan te passen. De basisinstallatie bevat de essentie, maar daarnaast kan Wordpress uitgebreid worden met allerlei nuttige en handige uitbreidingen. Istiecool voorziet het standaard basispakket reeds van een aantal extra’s die het gebruikscomfort van je website verhogen. Daarnaast kan je zelf nog kiezen met welke modules of plugins je de website uitbreidt. Dit kan reeds vanaf het begin, maar dat kan ook na verloop van tijd. Snel Een groot voordeel van Wordpress is dat het vrij “licht” is waardoor je website snel wordt geladen. Het is van groot belang om deze tijd zo kort mogelijk te houden. Hoe langer het duurt voordat je website wordt geladen, hoe groter de kans dat je bezoekers zullen wegklikken. Wordt constant verbeterd Wereldwijd werkt een groot team van ontwikkelaars samen om Wordpress steeds opnieuw te verbeteren en uit te breiden. Tip:
Indien gewenst kan Istiecool 1x per jaar de website updaten naar de nieuwste versie, ook alle gebruikte of aangepaste plugins krijgen dan een update. Verder maak ik een backup van de website en de database. Ook een exportbestand van al je berichten en pagina's. Deze wordt naar je toegemaild als zip bestand. Interesse? Neem contact met me op via:
[email protected] © istiecool.nl
pag. 3
Front-end / back-end In deze handleiding probeer ik zoveel mogelijk moeilijke begrippen uit de weg te gaan. Toch zijn deze 2 begrippen van groot belang! Front-end De front-end is de voorkant. Dit is eigenlijk je website zoals je bezoekers deze te zien krijgen. Back-end De back-end is de achter- of binnenkant. Het gedeelte waar je inlogt en je de website kunt beheren. Dit is het CMS-gedeelte, hier kun je media, pagina’s en nieuwsberichten toevoegen, bewerken en verwijderen. Inloggen Je hoeft enkel in te loggen om toegang te krijgen tot de back-end. Inloggen doe je via www.mijnwebsite.nl/wp-admin. Je komt terecht in het volgend scherm:
Hier geef je je gebruikersnaam en wachtwoord in en klik je op 'Inloggen'. Nadat je bent ingelogd kom je terecht in de back-end van je website. Tip:
Vaak is het makkelijk om met 2 tabbladen in de browser te werken, in het eerste tabblad toon je dan de back-end en in het tweede tabblad de front-end. Zo kun je makkelijk wisselen tussen het beheergedeelte en de voorkant van de website.
© istiecool.nl
pag. 4
Dashboard Standaard kom je op het “dashboard” terecht. Zie dit maar als het brein, hart en ingewanden van je website. Dit is dus de binnenkant oftewel de back-end. Als iemand de site bezoekt zien ze de front-end (de buitenkant). Door op een onderdeel in de linkerbalk te klikken, past de inhoud rechts daarvan zichzelf aan. Als je bijv. Berichten kiest zal het dashboard je de actuele en oude berichten laten zien. De meeste menu's hebben een submenu dat tevoorschijn komt als je met de muis over de knop beweegt of erop klikt. Buiten het instellen en de weergave van je site, de content en mogelijkheden biedt het dashboard je een beeld van wat er allemaal gaande is op je website. Je krijgt een samenvatting van de laatste reacties, nieuws, links naar je site en recente concepten.
© istiecool.nl
pag. 5
De WYSISWYG-editor De WYSISWYG (What You See Is What You Get) editor komt op meerdere plaatsen terug. De inhoud van je website (zowel pagina’s als nieuwsberichten) zal je altijd invoeren via deze editor. Om het eenvoudig te houden is de editor gebaseerd op Microsoft Word.
© istiecool.nl
pag. 6
Algemene instellingen Zorg dat de basis instellingen voor je site goed staan ingesteld. Er zijn niet veel complexe zaken te vinden bij de instellingen, maar het is wel van belang om deze op orde te hebben. ( Meestal is dit al juist ingesteld door Istiecool )
© istiecool.nl
pag. 7
Profiel Bij je profiel kun je zelf je persoonlijke informatie aanpassen. Bijvoorbeeld hoe je naam (auteur) wordt weergegeven op de site of welk emailadres aan de naam is gekoppeld. Vul een eigen emailadres en website in. Verander eventueel het wachtwoord wat je hebt gekregen. Weergeven alle iconen Standaard worden niet altijd alle iconen van de werkbalk getoond zien. Door te klikken op het volgende icoon verschijnt er een tweede of derde rij met iconen.
Groter tekstvenster Soms is het fijn om het veld waarin de tekst van de webpagina staat iets groter te hebben. Dit kan op 2 manieren. In de rechter benedenhoek van het tekstvenster zijn in de hoek een aantal schuine strepen. Wanneer je hierop klikt en sleept kun je het venster groter of kleiner maken. Een andere optie is op het venstericoon te klikken. Dit icoon is in de bovenste iconenbalk aan de rechterkant te vinden. Wanneer je hier op klikt wordt het tekstvenster vergroot. Klik je nogmaals op dezelfde knop dan wordt het venster weer verkleind. Berichten Door op berichten te klikken kom je op het overzicht van al je eigen nieuwsberichten. De eerste keer zullen er nog geen berichten staan maar op het moment dat je al eerder berichten hebt gepubliceerd kun je deze daar eventueel aanpassen of verwijderen. De berichten worden op datum gesorteerd en de laatste nieuwe berichten zullen dus bovenaan staan. Toelichting 1. Door je bericht op te slaan als concept wordt het niet meteen gepubliceerd maar bewaard tussen al je berichten. Je kunt het dan later nog bewerken of publiceren. Je kunt zelfs een datum in de toekomst instellen. Het bericht wordt dan automatisch gepubliceerd op de door jou gekozen datum. 2. Wil je de dat bezoekers van de website kunnen reageren op jouw nieuwsberichten zet dan een vinkje bij “Reactie's toestaan”. 3. Kies de juiste categorie door deze aan te vinken of maak een nieuwe categorie aan. Zie ook de uitleg over categorieën verderop in deze handleiding. 4. Het bericht zelf schrijf je met behulp van de WYSISWYG-editor. Zie ook andere uitleg hierover. 5. Als je klaar bent klik je op publiceren (of bijwerken / opslaan als concept) en je bericht staat online of wordt bewaard.
© istiecool.nl
pag. 8
Wijziging ongedaan maken Wanneer je nog niet op bijwerken of publiceren hebt geklikt kun je door middel van het indrukken van de Ctrl + Z toets een wijziging ongedaan maken. HTML code bewerken Eventueel is het mogelijk om de HTML te wijzigen. Dit kan handig zijn als je bijvoorbeeld een banner wilt invoegen. Let op: het verkeerd wijzigen van de HTML kan vreemde foutcodes op de betreffende pagina opleveren en is daarom bedoeld voor de meer ervaren internetter.
Pagina's, Categorieën en Tags Pagina's Om het overzicht van je pagina’s te openen zijn er verschillende manieren: • Klik in het linkermenu eerst op “Dashboard” en klik daarna op de link “Beheer je pagina’s” in het centrale venster. • Klik in het linkermenu op het item “Pagina’s”. Nieuwe pagina maken • Open het overzicht van je pagina’s en klik op “Nieuwe pagina” in het linkermenu of “Nieuwe toevoegen” bovenaan:
© istiecool.nl
pag. 9
Je komt nu in volgend venster terecht:
Helemaal bovenaan geef je de titel in. Deze titel zal voor je bezoekers zichtbaar zijn als titel van de pagina en deze zal ook in de url gebruikt worden. In de WYSIWYG-editor voer je de eigenlijke inhoud van je pagina in (de content). Daaronder, bij Pagina-auteur kan je de auteur selecteren. Dit staat normaal gezien goed en heeft eigenlijk niet zo’n belang. Het gedeelte “Wordpress SEO door Yoast” wordt gebruikt om de pagina te optimaliseren voor Google. Hier vul je i.i.g. de Title en Description in: • •
Title: Vul hier nog eens de titel in van je pagina, eventueel iets uitgebreider dan bovenaan de pagina. Description: Vul hier een korte omschrijving in van de pagina. Tip1: de velden 'Title' en 'Description' worden gebruikt door Google als omschrijving in de zoekresultaten. Bekijk het google voorbeeld boven de invulvelden van het SEO gedeelte voor een live preview. Het is dus belangrijk om hier een korte maar relevante titel / beschrijving in te voeren. Met andere woorden, deze 2 velden zouden wel eens de eerste kennismaking kunnen zijn van je bezoekers met je website! Tip2: Lees ook de beginnershandleiding over SEO van Google: http://www.istiecool.nl/SEO_Google.pdf © istiecool.nl
pag. 10
Bovenaan de rechterkolom is er net zoals bij berichten de mogelijkheid om je pagina op te slaan als concept of om de pagina te publiceren. Ook in de rechterkolom, onder attributen, kun je kiezen of de pagina een hoofdpagina is of een moederpagina heeft. Dit is belangrijk voor de menustructuur. Als de pagina een hoofdpagina is, dan komt deze in het hoofdmenu terecht. Selecteer je een moederpagina voor deze pagina, dan zal deze in een submenu onder de andere pagina verschijnen. Zie ook de extra uitleg over menu's verderop in deze handleiding. Pagina opmaken De volgende opties zijn alleen mogelijk wanneer alle iconen zijn weergegeven. Zie je maar één rij met iconen? In het begin van deze handleiding staat uitgelegd hoe je meerdere iconen kunt weergeven. Tekst onderstrepen Selecteer de tekst die onderstreept moet worden. Klik vervolgens op het icoon met een U die onderstreept is. Dit icoon is op de tweede iconenbalk te vinden. De tekst die geselecteerd is, wordt dan onderstreept. Tip: Gebruik deze optie met mate. Onderstreepte tekst kan een websitebezoeker ook verwarren met een link. Maken van tekstkop De tekst op een webpagina begint vaak met een titel, ook wel een Koptekst genoemd. Door tekst te selecteren en vervolgens deze de opmaakstijl Koptekst 1 mee te geven, wijzigt de standaardopmaak in de opmaak van een titel. De opmaakstijl is te vinden op de tweede iconenbalk. Standaard staat de tekst op Paragraaf. Door te klikken op de knop die naar beneden wijst kun je een opmaakstijl wijzigen. Tip: Gebruik een opmaakstijl alleen functioneel. Koptekst 1 staat bijvoorbeeld bovenaan en deze opmaakstijl is niet bedoeld om een willekeurig stuk tekst extra te laten opvallen. Wanneer dit wel gebeurt, wordt een webpagina vaak onoverzichtelijk. Tekst plakken vanuit Word (of ander tekstprogramma) Wanneer je tekst vanuit Word in de website wilt plakken zijn er 2 mogelijkheden: Plakken met opmaakstijl en plakken zonder opmaakstijl. De tweede optie heeft de voorkeur. Je moet de tekst die je hebt geplakt dan nog wel opmaken / stijlen maar je kopieërt geen onnodige codes en opmaakstijlen mee. Tekst plakken vanuit Word is relatief eenvoudig. Je klikt op het icoon met een mapje en een T. Er verschijnt een pop-up venster getiteld: Plakken als platte tekst. Vervolgens kopieer je de tekst vanuit Word hierin. Klik vervolgens op Invoegen. De tekst staat nu in het tekstvenster en is klaar voor verdere wijzigingen.
© istiecool.nl
pag. 11
Tips voor het opmaken van je pagina of bericht
© istiecool.nl
pag. 12
Extra schermopties
© istiecool.nl
pag. 13
Een pagina bewerken Open het overzicht van de pagina’s. Je krijgt nu een overzicht van alle pagina’s te zien. Zweef met je cursor over een paginatitel en onder de titel van de pagina komen een aantal opties te voorschijn:
Kies voor Bewerken. Je komt nu terecht in een venster waar je de gewenste pagina kan bewerken: • Je kunt de inhoud van de pagina wijzigen. • Je kunt de menustructuur wijzigen (hoofdpagina of een moederpagina). Zie ook de uitleg over menu's. • Je kunt de opties bij “SEO” wijzigen. Een pagina in de prullenbak plaatsen Open het overzicht van de pagina’s. Zweef met je cursor over een paginatitel en onder de titel van de pagina komen een aantal opties te voorschijn:
• •
Kies voor “Prullenbak”. De pagina is nu verplaatst naar de prullenbak.
© istiecool.nl
pag. 14
Een pagina permanent verwijderen / herstellen Om een pagina te verwijderen, moet je deze pagina eerst in de prullenbak plaatsen. Nadien kan je de pagina permanent verwijderen of terugplaatsen naar de originele locatie. • Open het overzicht van de pagina’s. • Bovenaan de pagina klik je op prullenbak (dit is enkel zichtbaar als er pagina’s in de prullenbak zitten):
Je komt nu in het venster van de prullenbak terecht:
• • •
Klik op de knop “Prullenbak leegmaken” om alle items te verwijderen. Je kunt ook item per item verwijderen, zweef hiervoor met je cursor boven een item, tot de tekst “Herstellen - Permanent verwijderen” verschijnt en klik op “Permanent verwijderen”. Je kunt items ook terugplaatsen naar hun originele locatie, zweef hiervoor met je cursor boven een item, tot de tekst “Herstellen Permanent verwijderen” verschijnt en klik op “Herstellen”. © istiecool.nl
pag. 15
Categorieën Categorieën helpen je om de berichten op te delen in heldere secties waardoor jij en je bezoeker snel en eenvoudig elk bericht van een bepaald type kan terugvinden. Je kunt zelf je eigen categorieën aanmaken of later nieuwe toevoegen.
© istiecool.nl
pag. 16
Tags In tegenstelling tot de categorieën, welke een strakke en bibliotheekachtig organisatiesysteem vormen, gaat het bij tags meer om abstracte associaties. Wat is een tag? Simpel gezegd een woord dat de inhoud van een bericht beschrijft. Dezelfde tags kunnen dus bij meerdere berichten voorkomen. Als een bezoeker van de site een tag aanklikt dan zullen alle berichten worden getoond met diezelfde tag. Uiteraard kun je ook weer zelf tags aanmaken en beheren.
© istiecool.nl
pag. 17
Zelf menu's maken Navigatie Goede navigatie is enorm belangrijk. Je kunt zelf je eigen menustructuur opzetten. In de menu-editor kun je zelf bepalen wat in het menu moet verschijnen en welke specifieke items onder andere elementen moeten vallen. Hierdoor ontstaat er meestal een uitklapmenu onder het hoofditem. Zo kun je de hoofdnavigatie strak en helder houden terwijl je de minder gebruikte elementen in een submenu onderbrengt.
© istiecool.nl
pag. 18
Media en contentbeheer Via je mediabibliotheek beheer je alle media op de website. Alles wat je upload komt in de mediabibliotheek te staan. Daar kun je alle media bewerken of verwijderen. Onder media verstaan we afbeeldingen, video's of documenten (zoals word, excel, pdf, enz.). Als je een van deze laatste media-bestanden in de website wilt plaatsen dan is de werkwijze dezelfde als bij afbeeldingen. Het enige verschil is dat er een link naar een document wordt geplaatst. Dit is interessant indien je bijvoorbeeld een prijslijst in pdf op de website wil plaatsen. Klik op “Media” in het linkermenu, je krijgt hier meteen een overzicht te zien van alle media die reeds naar de website is geupload.
© istiecool.nl
pag. 19
Nieuwe media uploaden naar de website • Open je mediabibliotheek. • Klik bovenaan op de knop “Nieuw bestand”. • Klik op de knop “Bestand kiezen” of sleep de gewenste bestanden naar het venster. • Als je klikt op “Bestanden kiezen” selecteer dan een bestand op je computer en klik op de knop “Selecteren”. • Wacht rustig totdat alles is geupload en de thumbnails zijn gegenereerd. • Klik nadien op de knop “Alle wijzigingen opslaan”. Ook alle andere media en afbeeldingen die je rechtstreeks hebt ingevoegd via de knoppen “Afbeelding toevoegen” en “Media toevoegen” boven de WYSIWYG-editor tijdens het bewerken van een bericht of pagina, komen hier terecht. Het gebruik van media Als je media hebt ge-upload, kan je die delen met andere beheerders van de website, of je kunt ze gebruiken om in te voegen in je pagina’s en berichten. Media verwijderen Als je met je muiscursor over de titel van een bestand zweeft, verschijnen onder de titel enkele mogelijkheden. Klik op de link “Permanent verwijderen” om het bestand van de website te verwijderen. Let wel op, indien je ergens in de website naar dat bestand linkt, dan zal die link niet meer werken. Toevoegen PDF of Microsoft Office bestand Selecteer de tekst waar het bestand naar toe moet verwijzen. Boven de iconenbalk staat de tekst Uploaden/toevoegen en 1 icoontje. Klik op het icoon. Er verschijnt dan een pop-up venster. Klik vervolgens op Bestanden kiezen. Selecteer het bestand waar je naartoe wilt verwijzen en klik op Openen. Het bestand wordt vervolgens getoond in het pop-up venster. Kies voor de optie Invoegen in bericht. Het pop-up venster verdwijnt en de geselecteerde tekst is een link geworden naar het bestand. Twitterbericht plaatsen Ga naar het twitterbericht dat je op de site wilt invoegen en kopieër de url. Plak deze vervolgens in de editor en je twitterbericht wordt op onderstaande manier op je site getoond:
© istiecool.nl
pag. 20
Video's van Youtube op je pagina tonen Ga naar youtube (en zoek de film die je op je pagina wilt tonen en kopieër de link (url) naar de video. Plak deze vervolgens in de editor, zorg ervoor dat deze op een eigen regel staat en het geen link is.
De video wordt dan op bovenstaande manier op je site getoond. Als je zelf de afmeting van de video wilt bepalen dan kun je de volgende shortcode gebruiken. Verander zelf de width en height naar het gewenste formaat. Naast Youtube video's kun je ook andere video's op je pagina embeddeb zoals o.a. Vimeo en Flickr. [embed width=“480” height=“320”]video-url[/embed] Is je website door Istiecool opgeleverd dan heeft deze meestal ook een aparte plugin geïnstalleerd genaamd JW-Player. Hiermee kun je eigen video's die je hebt geupload naar je mediabibliotheek ook invoegen in een pagina. Het is via de jw-player ook mogelijk om youtube video's te tonen. Op de instellingenpagina van de jw-player kun je zelf de standaardweergave (skin) en formaat van de player aanpassen. Een hyperlink of koppeling invoegen / wijzigen / verwijderen Wil je doorverwijzen naar een interne of externe webpagina? Selecteer dan het woord of de woorden die een koppeling moeten worden. Maak vervolgens een koppeling door op het icoon van een ketting te klikken.
Stap voor stap uitgelegd wordt het dan zoiets als: © istiecool.nl
pag. 21
Een hyperlink of koppeling invoegen • Selecteer de tekst (of het plaatje) waarvan je een hyperlink wil maken. • Klik in het menu op de knop met de ketting-schakels (een koppeling invoegen of bewerken)
• • •
•
•
Er opent een popup met meerdere opties. Je hoeft hier enkel maar volgende zaken in te voeren: Link URL: geef hier de volledige url in ( inclusief “http://”). Doel: Deze optie staat standaard niet ingesteld. Door hierop te klikken verschijnen 2 andere opties namelijk link openen in hetzelfde venster (te gebruiken als je naar een andere pagina binnen je website linkt) en koppeling openen in een nieuw venster (te gebruiken als je naar een externe website linkt). Titel: Vul hier een beschrijving in van de pagina waar je naartoe verwijst. Handig voor Google en handig voor bezoekers die je webpagina bezoeken. Gaan zij namelijk met de muis over de betreffende link dan zien zij de titel. Klik op de knop “Invoegen”.
Een hyperlink wijzigen • Selecteer de tekst waarvan je reeds een link hebt gemaakt (je hoeft niet heel de tekst te selecteren, het volstaat om 1x te klikken op de tekst waarvan je eerder een link had gemaakt). • Klik in het menu op de knop met de ketting (een koppeling invoegen of bewerken). • Maak de gewenste wijzigingen. • Klik op de knop “Bijwerken”. Een hyperlink verwijderen • Selecteer de tekst waarvan je reeds een link hebt gemaakt (je hoeft niet heel de tekst te selecteren, het volstaat om 1x te klikken op de tekst waarvan je eerder een link had gemaakt). • Druk op delete of klik op het icoon met de gebroken ketting (Koppeling verwijderen).
© istiecool.nl
pag. 22
Afbeeldingen Een afbeelding invoegen / bewerken / verwijderen Klik op het icoontje bij de tekst Uploaden/toevoegen. Als je hierop klikt, dan opent het volgende venster:
Er zijn 4 of 5 mogelijkheden om een afbeelding in te voegen: • Van computer: een afbeelding op je computer selecteren. • Van URL: een afbeelding gebruiken die op internet staat. • Media - Bibliotheek: een afbeelding gebruiken die zich in je mediabibliotheek bevindt. • Van Gallery: een afbeelding gebruiken die in je fotogallery staat (mits deze is geïnstalleerd). • Van NextGEN Gallery: een afbeelding gebruiken uit de NextGEN Gallery Plugin (mits deze is geïnstalleerd). Tip1: Afbeelding al vaker gebruikt? Kies dan voor het tabblad Media bibliotheek in het pop-up venster. Hier zijn alle bestanden welke eerder zijn geupload te vinden. Ook als je eenmaal een afbeelding hebt ingevoegd in een pagina of bericht komt deze automatisch in de mediabibliotheek terecht. Tip2: Je vermijdt beter de optie “Van URL”. Hierbij gebruik je een afbeelding die ergens op een andere webpagina staat. Stel dat deze op een bepaald moment wordt verwijderd van die website, dan zal deze afbeelding ook niet meer zichtbaar zijn op je eigen website. Als je dan toch een afbeelding van een andere website wenst te gebruiken, sla deze dan eerst op op je computer. Nadien kan je deze dan gebruiken. Vergewis je er wel van dat je deze afbeelding mag gebruiken op je eigen website!
© istiecool.nl
pag. 23
Een afbeelding invoegen: Van computer • Klik op de knop “Bestand kiezen”. • Selecteer een afbeelding die zich op je computer bevindt. • Nadat de afbeelding is geupload kan je de afbeelding eventueel nog bewerken. Klik hiervoor op de knop “Afbeelding bewerken”. Dit is zeker niet verplicht en is eerder bedoeld voor ervaren gebruikers! • Wijzig eventueel de 'Titel' van je afbeelding en geef een korte omschrijving in bij 'Alternatieve tekst' (dit is een voordeel om beter gevonden te worden via Google). • Bij 'Uitlijning' kun je kiezen hoe de afbeelding wordt uitgelijnd: selecteer 'Links' om de afbeelding links uit te lijnen zodat er rechts van je afbeelding tekst komt te staan. • Bij 'Afmeting' kan je de de grootte van de afbeelding kiezen. Door te kiezen voor thumbnail wordt de foto als een klein plaatje in het bericht weergegeven. Als bezoekers de foto aanklikken wordt de originele foto getoond in de lightbox. • Klik op de knop “Invoegen in bericht” om de afbeelding in te voegen in je bericht. Tip:
Om het genoemde lightbox-effect te krijgen zorg je dat bij 'Link URL' het juiste pad staat naar de afbeelding (klik op bestands-url). Als je klikt op de knop genaamd 'Attachtment URL' wordt de bezoeker doorverwezen naar een nieuwe pagina waarin de afbeelding vergroot wordt weergegeven.
Een afbeelding invoegen: Van Media - Bibliotheek • Klik op de knop “Bestand kiezen”. • Klik op het tabblad “Media - Bibliotheek”. • Klik op de link “Tonen” naast de afbeelding die je wenst in te voegen, de eigenschappen van de afbeelding komen nu te voorschijn. • Klik op de knop “Afbeelding bewerken” om de afbeelding eerst nog te bewerken. Dit is zeker niet verplicht en is eerder bedoeld voor ervaren gebruikers! • Wijzig eventueel de “Titel” van je afbeelding, en geef een korte omschrijving in bij “Alternatieve tekst” (dit is een voordeel om beter gevonden te worden via Google). • Bij “Uitlijning” kun je kiezen hoe de afbeelding wordt uitgelijnd: selecteer “Links” om de afbeelding links uit te lijnen zodat er rechts van je afbeelding tekst komt te staan. • Bij “Afmeting” kun je de grootte van de afbeelding kiezen. • Klik op de knop “Invoegen in bericht” om de afbeelding in te voegen in je bericht.
© istiecool.nl
pag. 24
Een afbeelding bewerken • Klik op de afbeelding die je wil bewerken, er verschijnen nu 2 knoppen op de afbeelding. Klik op de knop “Afbeelding bewerken”. • In het venster dat opent kun je de afbeeldingsgrootte en de uitlijning bepalen. Klik op het tabblad “Geavanceerde instellingen” om nog meer wijzigingen te doen.
Afbeeldingen online schalen (of spiegelen, croppen, draaien) Het is zelfs mogelijk om je afbeeldingen of de thumbnails online te schalen naar een ander formaat. Lees hiervoor de specifieke handleiding op: http://www.istiecool.nl/WP_AfbeeldingSchalen.pdf Een afbeelding verwijderen • Klik op de afbeelding die je wil verwijderen, er verschijnen nu 2 knoppen op de afbeelding. Klik op de knop “Afbeelding verwijderen”. • De afbeelding wordt meteen verwijderd.
© istiecool.nl
pag. 25
Fotogallery ( NextGEN Gallery ) Naast het plaatsen van nieuwsberichten kun je ook foto's in je eigen galerij plaatsen m.b.v. de NextGEN Gallery Plugin (mits deze is geïnstalleerd uiteraard). Door te klikken op galerij / afbeeldingen toevoegen kun je een nieuwe galerij maken of foto's toevoegen aan een bestaande galerij. Kies afbeeldingen van je computer en selecteer de juiste galerij om de afbeeldingen te uploaden.
N.B. De afbeeldingen worden tijdens het uploaden automatisch geschaald. Als de originele afbeeldingen te groot zijn (te hoge resolutie) kan het zijn dat het schalen van afbeeldingen en maken van de thumbnails niet goed gaat. Ook wordt de website erg traag als er erg grote foto's getoond moeten worden aan de bezoekers van de site. Houd hier rekening mee tijdens het uploaden van afbeeldingen. Dit geldt overigens ook voor het uploaden van foto's in je mediabibliohteek.
© istiecool.nl
pag. 26
Klik op galerij beheren om een overzicht te zien van de bestaande fotogalerijen, klik op de galerij die je wilt bewerken.
Bewerk de thumbnails, geef foto's een naam en beschijving, tag je foto's of sluit een foto uit door een vinkje bij die foto te zetten. De foto's welke zijn aangevinkt worden dan niet getoond op de site maar ze blijven wel bewaard.
© istiecool.nl
pag. 27
Filmpjes Bekijk voor meer info en uitleg onderstaande filmpjes •
Algemene uitleg over de NextGen Gallery http://www.istiecool.nl/nextgen_gallery_overview.mp4
•
NextGen Gallery en gebruik van widgets (engels) http://www.istiecool.nl/nextgen_gallery_widgets.mp4
© istiecool.nl
pag. 28
Shortcodes Vaak kun je ook gebruikmaken van bepaalde shortcodes welke je in je nieuwsberichten of pagina kunt plaatsen. Hieronder een opsomming van deze codes en wat ze betekenen. Neem de codes exact zoals hieronder aangegeven over (incl. accolades [ ] ) om deze in je nieuwsberichten te integreren. (Voor de meeste shortcodes is installatie van een bepaalde plugin of extra modificatie aan het standaard systeem noodzakelijk.) [gallery] (afh. van plugin) Plaatst alle foto's uit je mediabibliotheek welke zijn gekoppeld aan het betreffende bericht. In de mediabibliotheek kun je bepaalde foto's dus toewijzen aan een bepaald bericht. [contact-form 1 "Contact form 1"] (afh. van plugin) Plaatst een standaard contactformulier in je bericht die bezoekers van de website kunnen invullen zoals te zien op de contactpagina van de Istiecool.nl. Verstuurde formulieren komen terecht bij het mailadres welke is ingevuld bij contact-instellingen. [email_link] (afh. van plugin) Plaatst een link in het bericht waarmee de bezoeker de betreffende pagina kan mailen aan een vriend(in). [nggallery id=xx] (afh. van plugin) Plaatst alle foto's uit de geselecteerde nextgen galerij als allemaal kleine thumbnails naast elkaar in de pagina of nieuwsbericht. Waar id=xx het nummer van je galerij is. Het nummer van je galerij kun je terugvinden bij Galerij beheren. [slideshow id=xx] Plaatst alle foto's uit de nextgen galerij als een slideshow in je pagina. [imagebrowser id=xx] (afh. van plugin) Plaatst alle foto's uit de geselecteerde nextgen galerij eerst als 1 grote foto in de pagina. Onderaan de foto staat de beschrijving van de foto en een vorige en volgende knop om te navigeren naar de andere foto's. [recent posts posts="5"] (afh. van plugin) Laat de laatste 5 berichten zien waarin 5 uiteraard het aantal berichten is.
© istiecool.nl
pag. 29
Vindbaarheid in zoekmachines Als laatste wil ik je nog enkele tips meegeven om ervoor te zorgen dat de website hoger in de zoekresultaten terecht komt van zoekmachines zoals Google. De positie in de zoekresultaten is nl. ook erg afhankelijk van de inhoud van de website. Je ranking in een zoekmachine De ranking is eigenlijk je positie in de zoekresultaten van een zoekmachine. Zoekmachines hanteren een heel ingewikkelde formule, die constant wordt aangepast, om je positie in de zoekresultaten te bepalen. Een hoge ranking halen is geen exacte wetenschap maar er bestaan wel een heleboel hulpmiddelen. Een goede ranking wordt niet opgebouwd in enkele weken. Hier gaan verschillende weken of zelfs maanden overheen. Het is ook zo dat je hieraan moet blijven werken. Eénmaal je website opzetten en er daarna nooit meer naar kijken is geen goed idee. Tip: Lees ook de beginnershandleiding over SEO van Google: http://www.istiecool.nl/SEO_Google.pdf Weet hoe je doelgroep zoekt Je wilt gevonden worden in de zoekmachines. Om dit voor elkaar te krijgen is het belangrijk te weten wat de zoekwoorden zijn waar je doelgroep op zoekt. Hou eens een brainstormsessie om met een lijst te komen van zoekwoorden die men mogelijk zou kunnen gebruiken als men op zoek is naar je dienst of product. Gebruik de juiste zoekwoorden Als je weet welke zoektermen je klanten gebruiken, kun je je website efficiënt voor de zoekmachines inrichten. Gebruik de woorden waarop veel gezocht wordt om een goede beschrijving te geven van je product. Zorg dat deze woorden regelmatig terugkomen in met name titels en kopteksten. Omdat titel-teksten een grotere kans hebben om van beschrijvende aard te zijn, is het waarschijnlijker dat het om een relevante pagina gaat als de zoekwoorden hierin terugkomen. Dit zal door zoekmachines hoger gewaardeerd worden. Maak je site leesbaar voor zoekmachines Om de zoekwoorden gevonden te laten worden is het wel van belang dat de zoekmachine ze kan vinden op je pagina. Zoekmachines bekijken je pagina met programmaatjes en zien niet alles wat het menselijke oog ziet. Mooie animaties of prachtige afbeeldingen zijn onzichtbaar voor de geautomatiseerde bezoekers van de site. Zorg er voor dat als de site informatieve afbeeldingen e.d. bevat er een alternatieve tekst is opgegeven voor bezoekers van de site die deze media niet kunnen zien. Laat weten dat de website bestaat Nu de site opgebouwd is met informatie die de site goed beschrijft kun je zorgen dat de site bekend is bij relevante andere sites in jouw branche. Als je veel vermeldingen naar je site hebt, zien zoekmachines je als een belangrijke speler. Net als mond-op-mond reclame helpt het met het optimaliseren van de vindbaarheid van je site ook als veel mensen van je gehoord hebben en naar je verwijzen. De betrouwbaarheid van de links is ook belangrijk, een verwijzing op de site van bijvoorbeeld een overkoepelende brancheorganisatie geeft de site meer waarde. © istiecool.nl
pag. 30
Schrijf voor je bezoekers, niet voor zoekmachines Dit is misschien wel één van de belangrijkste tips. Zorg ervoor dat je teksten op vlak van zinsbouw duidelijk en goed leesbaar zijn voor je bezoekers. Als ze goed leesbaar zijn voor je bezoekers dan zullen ze ook goed leesbaar zijn voor zoekmachines. Zorg voor unieke inhoud Ook dit is een heel belangrijke tip: zorg voor unieke inhoud! Google ziet namelijk of je inhoud gekopiëerd hebt van een andere website. Indien je vaak inhoud kopiëert van andere websites zal dit negatieve gevolgen hebben voor je ranking in de zoekresultaten. Besteed voldoende zorg aan je kernwoorden Voor je een tekst schrijft, denk eerst na over wat de belangrijkste woorden / begrippen in die tekst zullen zijn. Dit noemen we kernwoorden. Daarnaast maak je een lijst aan met synoniemen. Doorheen de tekst gebruik je zowel de kernwoorden als de synoniemen ervan. Zet je kernwoorden in het vet. Op die manier herkent Google deze woorden als “belangrijk”. Kies een duidelijke, unieke titel voor je pagina’s en je nieuwsberichten De titel moet op een korte en krachtige manier vertellen waarover je tekst gaat. Dit is belangrijk voor je bezoekers, want onder andere aan de hand van deze titel beslissen je bezoekers of ze je tekst zullen lezen of niet. Voor Google is de titel ook van groot belang. De zoekmachine gaat er namelijk van uit dat de titel de belangrijkste zaken bevat. Plaats daarom zoveel mogelijk kernwoorden in de titel van de pagina. Zorg zoveel mogelijk voor unieke titels. Als elke titel binnen je website hetzelfde is, dan is het moeilijk voor Google te bepalen over welk onderwerp elke pagina handelt. Vul op elke pagina de opties onder “Wordpress SEO” aan Kies ook hier telkens voor een unieke titel en voor een (korte) unieke omschrijving. Zorg ervoor dat andere websites naar je website linken Het is belangrijk dat andere websites naar je website linken. Hoe meer dat andere websites naar je website linken, hoe belangrijker dat je website is voor Google. Zoek bijvoorbeeld eens onderwerpen in forums die over je vakgebied handelen. Als het onderwerp relevant is, kan je de website voorstellen aan de bezoekers. Dit is een intensieve taak die in het begin tot een beperkt aantal bezoekers zal leiden. Op termijn zal dit echter voor meer naamsbekendheid zorgen.
© istiecool.nl
pag. 31
Tips voor website promotie Allereerst: Meten is weten Voor je begint, maak gebruik van een goed statistiek programma zoals het gratis “Google Analytics”. Met Google Analytics kun je precies bijhouden waar je bezoekers vandaan komen en hoeveel procent van deze bron ook daadwerkelijk iets koopt (converteert). Zo kun je precies bijhouden hoeveel iedere advertentieplek je precies oplevert. Daarnaast wordt (als de hosting van je website wordt geregeld via Istiecool) ook veel gebruik gemaakt van piwik. Een alternatief voor Google Analytics dat door Istiecool in je website wordt geïntegreerd. Een klein en overzichtelijk analytisch programma wat je bezoekersstatistieken vormgeeft. Online adverteren Een veelgebruike online advertentiemethode is Google Adwords. Dit zijn de gesponsorde links naast en boven de zoekresultaten. Ook worden deze advertenties vaak weergegeven op websites die te maken hebben met het onderwerp van de advertentie. Het grote voordeel is dat de resultaten van Adwords campagnes heel goed meetbaar zijn met Google Analytics. http://adwords.google.com/ Social network marketing Je merk promoten op sociale netwerken zoals Twitter, Facebook, MySpace, Hyves, etc. Deze methode vergt wel een actieve benadering. Viral De naam viral komt van virus. Het idee hierachter is dat je een grappig filmpje, spelletje of gadget maakt dat zo leuk is dat het zich vanzelf over internet verspreid. In het filmpje zit vaak een reclameboodschap voor je product. Voorbeeld: http://www.benjijalbijkennis.nl E-mail marketing Houd je bestaande klanten op de hoogte van aanbiedingen en acties via een e-mail nieuwsbrief.
© istiecool.nl
pag. 32
Nog vragen, problemen of suggesties? Kijk voor meer informatie, andere handleidingen en tips op: www.istiecool.nl of neem contact op met de Istiecool via email:
[email protected]
© istiecool.nl
pag. 33
Begrippenlijst: CMS
Content Management Systeem, een systeem wat mogelijk maakt dat mensen eenvoudig, zonder veel technische kennis, documenten en gegevens op internet kunnen publiceren (contentmanagement).
Plugin
Extra uitbreiding voor meer functionaliteit van de basisinstallatie.
WYSISWYG
What You See Is What You Get, een visuele tekstbewerker gebaseerd op Word.
SEO
Search Engine Optimization, oftewel zoekmachineoptimalisatie is het geheel van activiteiten bedoeld om een website hoog te laten scoren in de resultaten van een zoekmachine.
Shortcode
Een specifieke code die je toelaat om zonder moeite schitterende dingen te laten zien. Shortcodes kunnen bestanden embedden of objecten creëren in 1 regeltje waar normaal gesproken veel gecompliceerde code voor is vereist.
Thumbnail
Engels voor miniatuur, een thumbnail is een verkleinde afbeelding of foto.
Lightbox effect
Speciaal script wat ervoor zorgt dat na het klikken op een afbeelding deze groter kan worden weergegeven zonder dat er een nieuw venster wordt geopend.
Embedden
Het integreren van een (deel van een) externe webpagina in een eigen webpagina. Bijv. een filmpje van Youtube toevoegen aan de eigen website. Het filmpje is dan “embedded” in je site
URL
Uniform Resource Locator is de officiële benaming van een link naar een andere pagina, website, foto, etc.
Croppen
Een overtollig gedeelte van een foto afknippen of een foto bijsnijden.
Widgets
Kleine functionele blokken welke je (door ze te slepen) in een sidebar of footergebied kunt plaatsen om deze zo vorm te geven.
© istiecool.nl
pag. 34