CMS made simple Handleiding CMS: deel 1. Tekst en Links. drs. Erik van der Pol. Januari 2014, Versie 1.1

©

CMS made simple Handleiding CMS: deel 1 Tekst en Links drs. Erik van der Pol

Januari 2014, Versie 1.1

CMS Made Simple, simpel uitgelegd door de Master

Introductie Deze handleiding is geschreven om met het beheermenu van CMS Made Simple (CMS) de website zelf bij te houden en inhoud te wijzigen, het zgn. Content Management Systeem (CMS). Nadat de website op een server is gezet en uitgepakt, is er een systeem aangemaakt om de website te bouwen. Het raamwerk (sjabloon) is klaar, met kleuren en huisstijl (css). De webmaster heeft het voorwerk gedaan. Het is tijd om de website van inhoud (content) te voorzien. Het mooie van dit systeem is dat u zelf uw site kunt onderhouden en vullen met inhoud, tekst en plaatjes (en eigenlijk nog veel meer…). Deze handleiding is voor iedereen die met CMS de website wil onderhouden.

Inhoudsopgave deel 1 Inloggen in het Beheer Panel ...................................................................................................................................3 Aanpassen van de tekst op de pagina’s....................................................................................................................5 Uitleg van het pagina overzicht ...............................................................................................................................6 Een nieuwe pagina maken........................................................................................................................................7 Toelichting op de meest gebruikte menuknoppen ............................................................................................... 10 Enkele oefenopdrachten ....................................................................................................................................... 11 Een link maken op de site ...................................................................................................................................... 12

CMS Made Simple – Gebruikershandleiding - deel 1

www.demaster.nl

Pagina 2 van 14


Inloggen in het Beheer Panel Het Beheer Panel kunt u meestal vinden op het volgende adres: www.uwdomeinnaam.nl/admin/ Figuur 1 laat een afbeelding zien van deze loginpagina.

Figuur 1: CMS Login Scherm

Vanaf versie 11 zie je dit scherm. Het werkt verder hetzelfde.

Uw inlognaam en wachtwoord heeft u ontvangen. Er is voor u een aparte login aangemaakt. Vul uw gebruikersnaam en wachtwoord in en klik op “Versturen”. U wordt nu doorgelinkt naar de beginpagina. Een voorbeeld hiervan ziet u bij figuur 2. Afhankelijk van de geïnstalleerde modules en de aan u toegewezen bevoegdheden kan deze pagina meer of minder opties hebben. De afbeelding kan, net als de andere afbeeldingen, iets afwijken van hetgeen u te zien krijgt. Dat heeft te maken met uw bevoegdheden en de instellingen van uw eigen website, maar ook met de versie van CMS die geïnstalleerd is. Ik geef hieronder enkele voorbeelden. Het werkt verder allemaal hetzelfde!


www.demaster.nl

Pagina 3 van 14


Figuur 2: CMS Hoofdpagina-voorbeeld 1 (versies voor 1.11)

Figuur 3: CMS Hoofdpagina-voorbeeld 2 (versies vanaf 1.11)

Het menu aan de bovenzijde in voorbeeld 1 (CMS, Inhoud, Opmaak….) geeft bij aanklikken op een knop een onderliggend menu. Figuur 4: Knop inhoud

Bij figuur 5 is het menu aan de zijkant geplaatst, de werking is verder hetzelfde. Als u met de muis over het menu aan de bovenzijde of zijkant gaat (klikken), zal er een submenu tevoorschijn komen. Op deze manier kunt u uw pagina’s benaderen en bijwerken.


www.demaster.nl

Pagina 4 van 14


U ziet hier tevens dat onder het kopje Inhoud nog enkele modules zijn aangemaakt, te weten HTML-blokken en Nieuws. Die zijn nu niet relevant. Daar komt een aparte uitleg en handleiding over.

Figuur 5: Knop inhoud (voorbeeld 2, mogelijk vanaf versie 1.11……)

Extra: verandering van eigen beheer-layout U kunt de lay-out van het beheer paneel wijzigen. Het is maar net wat u prettig vindt werken. Stel dat u CMS vanaf versie 1.11…. heeft, zoals het plaatje hierboven en u wilt de knoppenbalk toch bovenaan hebben zoals bij figuur 4, dan kunt u dat veranderen bij de optie ‘Mijn instellingen’, kies voor ‘Mijn account’, tab ‘Gebruikersinstellingen’. Zoek ‘ Beheerthema’ en kies daar ‘NCleanGrey’. Klik tot slot op versturen, pas dan wordt het geactiveerd. De eerdere versies van CMS hebben allemaal de knoppen bovenin de balk zoals in figuur 4. De knop toepassen (en/of versturen) is bij elke verandering nodig om iets definitief te maken. Dan pas zijn wijzigingen ook in CMS doorgevoerd!

Aanpassen van de tekst op de pagina’s Dit zult u waarschijnlijk het meeste doen. Om de verschillende pagina’s te kunnen zien, klikt u binnen het hoofdmenu ‘Inhoud’ op de optie ‘Pagina’s’. Een lijst met pagina’s zal dan getoond worden. Zie figuur 6 voor een voorbeeld hiervan. De volgorde van de pagina’s is per website verschillend, maar meestal staat de pagina ‘HOME’ of ‘Welkom’ bovenaan. Zoals in het voorbeeld bij figuur 6.


www.demaster.nl

Pagina 5 van 14


Figuur 6: Lijst met pagina’s

Uitleg van het pagina overzicht 1) 2) 3) 4) 5) 6) 7) 8) 9)

Bovenaan de knoppen van het hoofdmenu die telkens een submenu geven Overzicht pagina’s van de website Pagina alias (die heb je bv. nodig om interne links te maken) Het sjabloon dat gebruikt wordt (niets aan veranderen!) Hier kun je een pagina actief maken (of tijdelijk verbergen: is dan niet zichtbaar voor publiek) Standaard pagina die getoond wordt als de website geopend wordt Verplaatsen: met de pijltjes kun je de volgorde aanpassen (bv. in de menuknoppen) Vergrootglas: bekijk die pagina op je site. Kopieer die bladzijde (handig als je een voorbeeld hebt en je wilt een andere bladzijde er ook ongeveer zo uit laten zien), maar wel met een andere (alias)naam. 10) Bewerk die pagina, werkt hetzelfde als op de pagina links te klikken. 11) Verwijderen: pagina verwijderen of met vinkjes meerdere verwijderen (kijk uit, weg is weg) 12) Als je site een menu heeft kan er bij sommige pagina’s een submenu onder zitten. Dan staat er voor de pagina een blauw pijltje. Het voorbeeld heeft dit niet. Misschien jouw site wel! Je kunt op het pijltje klikken om die onderliggende pagina’s te zien. 13) De versie van jouw CMS-site. 14) Vergrootglas is site bekijken, slotje is uitloggen, plusje is een bladwijzer toevoegen / bekijken (voor jezelf, niet voor publiek. Daar kunt u een link maken naar andere sites voor uzelf, bijv. naar deze handleiding)


www.demaster.nl

Pagina 6 van 14


Als u de inhoud van een pagina wilt aanpassen klikt u op die pagina (menutekst), zie nummer 2 op het voorbeeld. Dit is de pagina waar u de wijzigingen in gaat aanbrengen. U ziet dat de website van figuur 6, begint met pagina ‘Welkom’ en eindigt met pagina ‘Contact’. Deze website bestaat uit 6 pagina’s. Iedere pagina is actief en de standaardpagina is ‘Welkom’.

Een nieuwe pagina maken Als u een nieuwe pagina wilt maken, klikt u in plaats van op de naam van een bestaande pagina op “Nieuwe inhoud toevoegen”. Deze optie staat boven en ook onderaan de lijst met de al bestaande pagina’s.

Figuur 7: Pagina Nieuwe inhoud toevoegen

Hier ziet u in het voorbeeld, geel omcirkeld, een nieuwe inhoud (pagina) toe te voegen. Nieuwe inhoud betekent gewoon een nieuwe websitepagina aanmaken. Als u erop klikt komt er een nieuw scherm tevoorschijn en kunt u beginnen om een nieuwe pagina voor de website aan te maken en met inhoud (tekst en plaatjes) te vullen. Hetzelfde scherm krijgt u ook bij een bestaande pagina. Daar is de menutekst en titel al eerder aangemaakt. Bij een nieuwe pagina moet dat nog gedaan worden.


www.demaster.nl

Pagina 7 van 14


In het volgende figuur ziet u het scherm dat u te zien krijgt als u klikt op ‘Nieuwe inhoud toevoegen’.

Figuur 8: Pagina Nieuwe Inhoud toevoegen

U kunt nu de door u gewenste toevoegingen en/of wijzingen aanbrengen. Inhoudstype kunt u laten staan op ‘Inhoud’. U gaat straks inhoud (of tekst) typen op deze pagina. De andere typen zijn niet relevant. Titel is de titel van de betreffende pagina zoals die wordt getoond op de website (wordt ook vaak meegenomen in zoekmachines). Menu Tekst is de tekst die getoond wordt in het navigatie menu van de site (indien deze is aangevinkt bij het tabblad ‘Opties’). Bovenliggend geeft u de mogelijkheid om een pagina onder een andere pagina te zetten als een submenu. Bijvoorbeeld: onder de het menu ‘Dieren’ plakt u de pagina ‘katten’, ‘honden’ enz. In het overzicht van de pagina’s zal dan een blauw pijltje bij ‘Dieren’ komen te staan.


www.demaster.nl

Pagina 8 van 14


Op deze manier kunt u zien dat er een submenu aanwezig is. Dat kan handig zijn als u veel menuknoppen wilt gebruiken, maar de site wel overzichtelijk moet blijven! Het tabblad ‘Opties’ links bovenaan geeft een nieuw scherm waar u een aantal dingen kunt aanvinken die voor deze pagina belangrijk kunnen zijn. Dat kan per pagina verschillen. U vindt er ook het sjabloon dat gebruikt wordt (laten staan!). -

>Het sjabloon dat gebruikt wordt (niets aan veranderen).

-

>Dit vinkje verwijderen zorgt dat de pagina niet meer in het menu zichtbaar is voor publiek.

-

>(HTTPs gebruikt u voor een beveiligde omgeving, is hier niet relevant)

-

>In buffer opnemen zorgt ervoor dat website sneller worden geladen in de browser

-

> Wel of niet doorzoekbaar in de search module (als die aanwezig is)

-

> niet direct relevant

-

> Houd kleine letters aan en schrijf de alias aan elkaar De alias wordt bijv. gebruikt bij interne links.

-

> U kunt er een beschrijving tegenkomen van de site of kernwoorden voor de zoekmachines en een bepaalde code bv. {embed header=true}. U hoeft hier nu nog niets aan te veranderen!

Figuur 9: Tabblad Opties van een pagina

Het tabblad ‘Voorbeeld’ toont een voorbeeld van de pagina. Er staat boven het venster nog wat tekst beschreven en het komt hierop neer dat sommige veranderingen nog niet zichtbaar hoeven te zijn. Dat kan o.a. komen omdat de cache van deze pagina nog in het geheugen van de browser staat. Dat kan vooral het geval zijn bij een verandering op een bestaande pagina.


www.demaster.nl

Pagina 9 van 14


TIP: Door op uw toetsenbord tegelijkertijd CTRL en F5 in te houden en weer los te laten, vernieuwt u die cache en worden veranderingen (wel eerst opslaan bij toepassen of versturen) zichtbaar. Het volgende stukje gaat over de inhoud van de pagina. Hier vindt u allerlei knoppen zoals u wellicht herkent bij een tekstverwerker. De inhoud hiervan kunt u immers aanpassen op een manier die in grote lijnen gelijk is aan Word. In de menubalk staan functies die u kunt gebruiken zoals het invoegen van plaatjes en het maken van hyperlinks. Een voorbeeld van de menubalk kunt u zien in figuur 10. Het voorbeeld kan ook weer iets afwijken van wat u bij uw eigen site ziet.

Figuur 10: Menubalk

Toelichting op de meest gebruikte menuknoppen Bekijk of bewerk het document in de broncode (alleen voor gevorderden) Knippen Kopiëren Plakken (met of zonder opmaak) Plakken als Word-gegevens. Door hierop te klikken opent zich een nieuw venster. Hierin kunt u aangegeven welke gegevens u wel of niet wilt behouden bij het plakken. Ongedaan maken of opnieuw uitvoeren van een uitgevoerde actie. Vet, schuingedrukt, onderstreept, doorhalen van de geselecteerde tekst Opsomming maken met bullets of met cijfers Inspringing van de tekst vermeerderen of verkleinen Uitlijning van de tekst (links, centreren, rechts of uitvullen)


www.demaster.nl

Pagina 10 van 14


Invoegen of verwijderen van een hyperlink Invoegen of aanpassen van een interne link binnen de eigen site Invoegen of wijzigen van een afbeelding Ook kunt u deze optie nog tegenkomen: dan kunt u een tabel invoegen.

Figuur 11: Stukje menubalk dat het invoegen van een tabel mogelijk maakt.

Als u de uitleg tot zover begrepen heeft, is het handig om eerst wat pagina’s aan te maken of wat tekst op een bestaande pagina te veranderen. TIP: Als u tekst gaat typen, verander het lettertype dan niet in bv. Arial. Die keuze is al gemaakt bij het bouwen van de site. Bij het bouwen is een standaardlettertype geselecteerd met een bepaalde kleur passend bij de huisstijl. Die wordt automatisch toegevoegd als u de pagina via de knop versturen of toepassen opslaat. Wel kunt u de grote, en kleur van een woord veranderen om iets op de pagina te accentueren. Dat is soms ook een beetje uitproberen. TIP: Wilt u een pagina aanmaken en u weet dat het een tijdje gaat duren voordat de inhoud geplaatst gaat worden, zet de pagina dan op niet actief en/of haal het vinkje weg bij tabblad ‘Opties’ – ‘toon in menu’. Dan ziet de bezoeker van uw site die pagina niet. TIP: Omdat u eigenlijk in CMS in een soort HTML tekstverwerker aan het typen bent, werkt de return/enter knop iets anders dan u misschien gewend bent. Als u een nieuwe alinea wilt, klikt u op Enter, er ontstaat een witregel. Wilt u de tekst direct onder de vorige tekst klik dan op ‘Shift’ ‘Enter’.

Enkele oefenopdrachten 1) Verander enkele woordjes op de site van kleur, grootte enz. 2) Voeg een symbool toe bv. © het copyright teken in de tekst. 3) Voeg uit een bestaand artikel dat in Word gemaakt is tekst toe in de website door te knippen en te plakken met de menubalk.


www.demaster.nl

Pagina 11 van 14


4) Maak een opsomming van tekst met bullets of cijfers. 5) Kopieer tekst van een bestaande site naar je eigen paginasite met de knoppen op je toetsenbord: ‘Ctrl C’ en ‘Ctrl V’. (In sommige browser kun je niet knippen en plakken met de rechtermuisknop, dat kan dan wel met de genoemde toetsencombinaties.)

Een link maken op de site Er zijn enkele mogelijkheden.

a) Een link binnen de eigen website maken U heeft al enkele pagina’s aangemaakt en die voorzien van bv. tekst en nu wilt u in de tekst een link opnemen naar een andere pagina op uw site. Dat kan handig zijn om snel te linken naar een ander stukje informatie op uw site. Selecteer de tekst met de muis (die de link wordt ‘hier een interne link’) en kies het oranje en klik erop. Onderstaand schermpje (figuur 12) komt dan te tevoorschijn (dat palmboompje overzicht van pagina’s is per site verschillend!). Wat tevoorschijn komt is een overzicht van de aangemaakte pagina’s op uw site in de menustructuur.

Figuur 12: een interne link toevoegen

Selecteer uw doelpagina bv. ‘Diensten’ en klik erop. De tekst wordt blauw en is onderstreept, de link is gemaakt. Als u de link wilt veranderen naar een andere pagina op uw site, gaat dat hetzelfde. Selecteer de tekst en kies een interne pagina bij het palmboompje.


www.demaster.nl

Pagina 12 van 14


Om te controleren of de link is gemaakt, klikt u met de muis even op de tekst die een link is geworden en u ziet 2 kettingen in het menu oplichten. De eerste geeft de link. Klik op de ketting dan bv. dit venster:

en u ziet

Figuur 13: een interne link toevoegen

Bij de URL staat dan bv. zoiets als: {cms_selflink href='diensten' }. Jawel de link is gemaakt naar de pagina ‘diensten’ binnen uw site. Bij ‘Doel’ ziet u staan dat de link in dit venster geopend wordt. Dat is goed, de huidige link op de pagina linkt zo binnen de site naar de pagina ‘diensten’. Kies voor bijwerken en u komt terug op de pagina. Bijwerken moet u gebruiken als u hier iets wijzigt. Is dat niet het geval, dan kunt u annuleren. Voor de uitdagers onder ons: als u hier ‘diensten’ zelf verandert in de alias van een andere pagina, zal de link naar die pagina gaan op de website. Zo kunt u snel een link wijzigen en bijwerken in het script. Die link is gemaakt. Wilt u die link verwijderen, maar de tekst wel laten staan, dan gaat dat als volgt: Op de pagina waar de link staat: klik op de blauwe onderstreepte tekst (= link). De 2 kettingen lichten op, klik op het gebroken anker , de link wordt verwijderd. Dat is alles. b) Een link naar een andere site maken Wilt u een link maken naar een andere website, selecteer dan eerst de tekst (dat wordt de link, in het voorbeeld is dat nog vaag te zien: ik ga een link naar de master maken) en klik dan op de kettingschakel

. Onderstaand scherm komt tevoorschijn.


www.demaster.nl

Pagina 13 van 14


Figuur 14: een externe link toevoegen

Type achter het kader URL het adres van de website. Hier is dat http://www.demaster.nl Bij ‘Doel’ kiest u hoe de website geopend moet worden. Een externe site kan het handigste geopend worden in een nieuw venster in de browser. Kies de optie (_blank). TIP: Een link naar een externe site: kies voor Doel ‘In nieuw venster openen (_blank)’. Een link binnen de eigen site: kies voor Doel ‘In dit venster / frame openen’. c) Een link naar een document of afbeelding maken De derde optie is het maken van een link naar een foto of een document. Maar voordat u hiermee aan de slag gaat, is het handiger eerst even het onderwerp afbeeldingen op de site apart te beschrijven. Dat komt in deel 2 van de handleiding. Succes met het maken en vullen van uw site.


www.demaster.nl

Pagina 14 van 14

CMS made simple Handleiding CMS: deel 1. Tekst en Links. drs. Erik van der Pol. Januari 2014, Versie 1.1

Recommend Documents