Transcript Werken met Wordpress 1

Werken met Wordpress 1
Het webadres van onze ‘voorbeeldsite’ is edu.lokaal230.be
Er is een recente versie geïnstalleerd van WordPress in het Nederlands. Zo ziet de startpagina eruit
na installatie:
Wordpress installeert standaard dit thema genaamd Twenty Fourteen.
Klik je linksonder op inloggen (in de META rubriek) dan verschijnt het inlogscherm(pje) van
WordPress:
Voer je gebruikersnaam in
(dat is je emailadres bij
lokaal230 – formaat
<voornaam>.<achternaam-inéén-woord>@lokaal230.be).
Voer je wachtwoord in (je
hebt er een gekregen dat je
ondertussen hebt verandert
in een persoonlijk
wachtwoord)
Druk op de knop [Inloggen]
(je kan gegevens onthouden vooraf aanvinken indien je thuis op je eigen computer werkt…)
Je website opent in bewerkingsmode (In WordPress heet dat ‘Dashboard’). Dat ziet er zo uit:
Pagina 1
Zolang je ingelogd bent kan je terugkeren naar dit Dashboard via de WordPress-knop linksboven.
Rechtsboven kan je je profiel wijzigen indien nodig:
Zaken die je hier o.a. kan aanpassen zijn:
 Het kleurenschema van het Dashboard (standaard is dit zwart-blauw) . Dit heeft geen
invloed op de kleuren van je website zelf.
Pagina 2
 Je kan je schermnaam aanpassen (verschijnt rechts bovenaan)
 Bij contactinformatie kan je een ander e-mailadres opgeven
 Belangrijkst van al : onderaan dit scherm kan je een nieuw wachtwoord ingeven
Om de wijzigingen in het profiel te bevestigen klik je op [Profiel bijwerken]
Ons eerste werk is het kiezen van een thema (=E theme,template). Er zijn zeer veel gratis thema’s
beschikbaar via Weergave | Thema’s links in de zijbalk van het Dashboard.
Zoals je ziet staan er al drie beschikbaar (dat is zo na installatie). Je kan zoveel thema’s toevoegen als
je wil en je kan eenvoudigweg wisselen tussen de thema’s . Niet alles zal er natuurlijk even goed uit
zien, of even geschikt zijn, maar het is in elk geval een krachtig instrument bij het ontwerpen of
aanpassen van websites. Wil je het actieve thema aanpassen? Klik dan op [Aanpassen] in het
thema. Wil je het thema ernaast even proberen? Klik voor informatie op [Thema details]. Wil je het
thema toegepast
zien zonder dat het
wordt geactiveerd
(een preview dus),
klik dan op [Live
voorbeeld]. Wil je
dit thema actief
maken? Klik dan op
[Activeren]
We gaan een geschikt thema zoeken. Daartoe klikken op [Nieuwe toevoegen]
Pagina 3
We maken de volgende keuzes via de Eigenschap Filter (maar er zijn nog tal van andere manieren om
te zoeken) . We zoeken naar een éénkoloms layout (omdat we eenvoudig willen beginnen) . We
vermijden ‘vloeiende layout’ omdat die niet op bij alle schermresoluties een goede schikking
garandeert. Als we klaar zijn om te zoeken klikken we op de knop [Thema’s zoeken] onderaan op het
scherm.
We vinden tal van
thema’s en we kunnen
er verschillende
installeren en
uitproberen vooraleer
we onze ‘voorlopig
definitieve’ keuze
maken.
Pagina 4
We kiezen “OneColumn” thema, klikken
daarbij op [Nu installeren] Die installatie
gebeurd automatisch.
Vooraleer we dit thema gaan aanpassen schakelen we eerst al zoveel mogelijk zaken m.b.t. bloggen
uit. Om te beginnen verwijderen we het standaard bericht via Berichten in het Dashboard links:
We vinken het bericht aan, kiezen als actie
[Naar de prullenbak verplaatsen] en klikken
dan op [uitvoeren]
Bij Instellingen | Reacties vinken we beide vinken in het onderdeel Standaard berichtinstellingen uit!
(dus geen vink bij Linknotificaties…. en bij Sta toe dat bezoekers kunnen reageren…)
Onderaan de pagina bevestigen we met [Wijzigingen opslaan]
Pagina 5
Sterk aan een CMS zijn de widgets, dit zijn functionele onderdelen die je aan een pagina kan
toevoegen. Je hoeft hiervoor geen code te kennen om het te laten werken. In de meeste thema’s
staan er een aantal standaard actief (wat deze templates dus direct praktisch bruikbaar maakt –
meestal echter gericht op bloggen). Gezien wij vooral pagina’s gaan maken met tekst en foto’s en
linken schakelen we deze bijna allemaal eerst uit!
We gaan dus naar
Weergave |
Widgets en
openen ze een
voor een (via het
pijltje) en kiezen
telkens
Verwijderen.
De widget Meta
laten we echter
staan, want die
bevat o.a. de
inlog-link!
Pagina 6
Tenslotte verwijderen we de Sample Page via Pagina’s in het Dashboard. We vinken de pagina aan ,
kiezen als actie verplaatsen naar de prullenbak, en klikken op [Uitvoeren]. Zie hieronder voor het
resultaat:
Volgende stap: we gaan onze pagina’s aanmaken (enkel met een titel), en daarna maken we het
menu.
We gaan dus naar
Pagina’s | Nieuwe
pagina en voeren als
titel in START en
klikken rechts op
[Publiceren]. Als de
pagina gepubliceerd is
komt we weer in
bijwerkmodus. We
gaan echter nog een
aantal pagina’s
toevoegen via Nieuwe
Pagina, nl de pagina’s
STUDIO AGENDA
PRIJZEN FOTOGRAFIE
en CONTACT & ROUTE
Vervolgens voegen we
nog een aantal
subpagina’s in:
Pagina 7
WAAROM EEN FOTOSTUDIO HUREN? (sub van
START), BOEKING (sub van AGENDA) en CONTACT
(sub van CONTACT & ROUTE) – Vooraleer we een
subpagina publiceren duiden we bij Paginaattributen aan wat de hoofdpagina is.
Nu gaan we een menu toevoegen via Weergave | Menu’s in de zijbalk van het Dashboard :
De menustructuur staat reeds afgeleid klaar, maar de volgorde en de plaatsing van de subpagina’s
moet nog aangepast worden. Je kan de items verslepen tot de structuur klopt. Onderaan, bij
Themalocaties vink je Hoofmenu aan (want dit wordt onze hoofdnavigatie).
Vervolgens klik je op [Menu aanmaken] . Tijd om de tussenstand eens te bekijken… Via het ‘Huis’icoontje links bovenaan kan je de website in preview bekijken en doorlopen.
Pagina 8
Gaan we terug naar Weergave |
Thema’s dan zien we dat het
nieuwe actief staat.
We klikken op [Aanpassen] om
het thema aan te passen.
Bij Statisch startpagina selecteren we de
radioknop Een statische pagina, we selecteren
START als Startpagina, en we selecteren niets
bij Berichtenpagina
Bij websitetitel en ondertitel vervangen wij de
tekstvelden door HUUR EEN FOTOSTUDIO en
Fotostudio 57
We verwijderen de standaard kopafbeelding
en gaan vervolgens in het dashboard naar
Weergave | Header : daar kunnen we een
passende foto uploaden.
Bekijk ten slotte het voorlopig resultaat op edu.lokaal230.be
Pagina 9
Pagina
10