Website beheren: de basis

Website beheren: de basis Website beheren: de basis In dit document krijg je een overzicht van de belangrijkste functies en elementen van het nieuwe onderhoudsprogramma voor cluster websites.

Website beheren: de basis

Page 1

Website beheren: de basis 1. Inloggen om de site te bewerken (voor een live website) Op iedere pagina van je website staat helemaal linksonderin een icoontje van een pijl die naar binnen wijst. Klik erop om naar de inlogpagina te gaan. NB: eenmaal ingelogd kun je alle pagina's bewerken. Het maakt dus niet uit op welke pagina je op het icoontje klikt. NB2: het icoontje doet niets anders dan "/login" achter je website adres te plakken. Als je website adres luidt: www.cluster.st-er.nl, dan kun je inloggen op adres: www.cluster.st-er.nl/login.


Page 2

Website beheren: de basis 1.1 Inloggen om de site te bewerken (voor een website die nog niet live is) Zolang je website nog niet live is, kun je de site bekijken via het preview-adres dat je hebt gekregen. Dat adres heeft de vorm : http://preview.st-er.nl/xxxxxx Op de plaats van de x-tekens staat een code die uniek is voor jouw site. Door aan het adres toe te voegen: "/login", kom je bij het inlogscherm: dus: http://preview.st-er.nl/xxxxxx/login


Page 3

Website beheren: de basis 1.2 Inloggen

Het inlogscherm verschijnt en je logt in met je gebruikersnaam (= e-mailadres) en wachtwoord. Er is een "wachtwoord vergeten" linkje waarmee je een nieuw wachtwoord kunt instellen als je het oude bent vergeten.


Page 4

Website beheren: de basis 1.3 1e Keer inloggen: wachtwoord wijzigen Voor je eerste inlog heb je van de webredactie een tijdelijk wachtwoord gekregen. Zodra je daarmee inlogt verschijnt dit scherm en moet je zelf een wachtwoord kiezen.


Page 5

Website beheren: de basis 1.4 Accountinstellingen Na de eerste keer inloggen en het verplicht wijzigen van je wachtwoord, kom je in onderstaand scherm. Het biedt de mogelijkheid om: • Je naam, wachtwoord en/of e-mailadres te wijzigen • Uit te loggen • Naar "Mijn Site" te gaan


Page 6

Website beheren: de basis 2. Mijn Site: startscherm Dit is het scherm waarop je terechtkomt na het inloggen (behalve de eerste keer). Via het menu kun je naar de accountinstellingen (1) en uitloggen (6) Het bevat statistieken m.b.t. het bezoek van je website (3). Hier kun je ook het commentaar beheren dat bezoekers op je site hebben achtergelaten (tabblad "comments"). (4) Het tabblad "Form Entries" is voor het beheren van gegevens die bezoekers hebben ingevuld in formulieren op je site. (5) De belangrijkste functie op deze pagina is Site bewerken (2)


Page 7

Website beheren: de basis 3. Pagina's bouwen! Bij het bewerken van je site zijn er 2 hoofdonderdelen: "Bouwen" en "Pagina's". • "Bouwen" is het bewerken van de inhoud van een pagina • met "Pagina's" bepaal je welke pagina's er zijn en wat hun volgorde is.


Page 8

Website beheren: de basis 3.1 Bouwen, de inhoud van een pagina Het onderdeel "Bouwen" is waar Weebly echt in uitblinkt: het zo intuïtief en makkelijk mogelijk bewerken van de inhoud van je site


Page 9

Website beheren: de basis 3.2 Pagina's, de structuur van je site Als je in de blauwe bovenbalk op de knop Pagina's klikt dan verandert de linker kolom op het scherm. Daarin is nu de structuur van de website zichtbaar en kun je deze gemakkelijk wijzigen.


Page 10

Website beheren: de basis 4. Het onderdeel Pagina's In het onderdeel Pagina's kun je zeer eenvoudig: • • • • •

pagina's toevoegen pagina's verwijderen pagina's kopiëren. de volgorde van pagina's veranderen pagina's onder een andere pagina plaatsen (zodat een subpagina ontstaat)


Page 11

Website beheren: de basis 4.1 Pagina's verplaatsen De volgorde van de pagina's in je site verander je eenvoudig door ze naar een nieuwe plaats in de lijst te slepen.


Page 12

Website beheren: de basis 4.2 Pagina's toevoegen: stap 1 Klik op de Toevoegen-knop (1) Kies vervolgens om een "standaard pagina" aan te maken (2). Met de andere optie, "Externe pagina" (3) kun je verwijzen naar een een pagina op een andere website. In het menu van jouw website komt er dan een link naar die andere site. TIP: gebruik een Externe pagina om een hoofdonderwep in je websitemenu te maken, waaronder dan een aantal subpagina's komen te "hangen". Dat kan natuurlijk ook met een Standaard Pagina, maar dan ben je ook verplicht om die pagina te vullen. Bezoekers kunnen 'm immers aanklikken. Als je in plaats van Standaard Pagina kiest voor Externe pagina en daarbij het webadres ("URL") leeg laat, dan komt de pagina wel in het menu, maar als je er op klikt dan klapt alleen het submenu uit en verder gebeurt er niets. Je hoeft dan de "hoofdpagina" dus niet van inhoud te voorzien.


Page 13

Website beheren: de basis 4.3 Pagina's toevoegen: stap 2 Nadat je in de vorige stap hebt gekozen voor het toevoegen van een "standaard pagina", kun je de kenmerken van de pagina gaan invullen: Zo is er: • • • •

de naam (1) een vinkje waarmee je de pagina kunt verbergen in het websitemenu (2) de globale indeling van de pagina. (3) Hier geef je aan welk soort pagina het moet worden. de zichtbaarheid van de pagina. Daarmee is het mogelijk om de pagina achter een wachtwoord te zetten.

Klik als laatste op "Opslaan" (5). De nieuwe pagina is nu automatisch toegevoegd onderaan het lijstje met pagina's.


Page 14



Page 15

Website beheren: de basis 4.4 Pagina's toevoegen: stap 3 In deze laatste stap sleep je de pagina naar de gewenste plaats in de site. Dit kun je overigens op elk gewenst moment weer veranderen. Als je tijdens het slepen wat meer naar rechts beweegt dan ontstaat een subpagina. Pak je een subpagina beet en beweeg je 'm naar links dan wordt het een hoofdpagina. Je kunt zo ook sub-subpagina's en sub-sub-subpagina's maken!


Page 16

Website beheren: de basis 4.5 Pagina verwijderen Klik in de lijst van pagina's, op de pagina die je wilt verwijderen. Het menu "Pagina bewerken"opent zich. Via de knop "Verwijderen" kun je de geselecteerde pagina verwijderen. Er wordt vervolgens eerst nog om een bevestiging gevraagd, want een verwijderde pagina is niet meer terug te halen.


Page 17

Website beheren: de basis 4.6 Pagina kopiëren Door een pagina te selecteren in de lijst en vervolgens te drukken op de knop "Pagina kopiëren", ontstaat onmiddelijk een kopie van de geselecteerde pagina. Deze kopie staat in de lijst dan helemaal onderaan, en je kunt 'm dus vervolgens naar een andere plek in de lijst slepen. NB: Het is niet mogelijk om pagina's uit een andere website te kopiëren.


Page 18

Website beheren: de basis 5. Pagina indelingen In Weebly kun je pagina's in principe volledig vrij zelf indelen. Er zijn echter pagina-indelingen waarbij enkele vaste onderdelen in de pagina worden opgenomen. Hieronder zie je een overzicht: • basis: Volledig vrij in te delen pagina, voor de meeste doeleinden geschikt. • basis-minder-breed: Gelijk aan basis, maar de in te delen ruimte is smaller doordat de kantlijnen breder zijn. Als je maar één kolom op je pagina hebt dan blijft de tekst ook op een PC-schem prettig leesbaar. • kolom-links: Pagina heeft een vaste kolom ("sidebar") aan de linkerkant, o.m. te gebruiken voor navigatie-linkjes (submenu). De inhoud van de kolom is uniek voor de pagina • kolom-links-vast : Pagina heeft een vaste kolom ("sidebar") aan de linkerkant, o.m. te gebruiken voor navigatie-linkjes (submenu). De inhoud van de kolom komt automatisch terug op elke pagina met deze indeling. • kolom-rechts: Pagina heeft een vaste kolom ("sidebar") aan de rechterkant, o.m. te gebruiken voor navigatie-linkjes (submenu). De inhoud van de kolom is uniek voor de pagina • kolom-rechts-vast : Pagina heeft een vaste kolom ("sidebar") aan de rechterkant, o.m. te gebruiken voor navigatie-linkjes (submenu). De inhoud van de kolom komt automatisch terug op elke pagina met deze indeling. • nieuws: Deze indeling maakt van je pagina een weblog die uitstekend bruikbaar is voor nieuwsberichten.


Page 19



Page 20

Website beheren: de basis 6. Bouwen Bouwen: "Kies een layout of sleep elementen hiernaartoe" Hier heb je de keuze om je pagina te vullen met voorbeeldtekst en afbeeldingen in één van de beschikbare layouts, óf je kunt gewoon vanaf "nul" beginnen en zelf titels, tekst en afbeeldingen op je pagina slepen.


Page 21

Website beheren: de basis 6.1 Layout menu Als je kiest voor een layout als uitgangspunt, dan zijn er vele opties om uit te kiezen. Van de paginasoorten Home, Over, Diensten, Contact, Menu en Portfolio zijn er vele mogelijke layouts. Kies een layout en je krijgt in een preview te zien hoe de layout er in jouw pagina stijl uitziet. (zie volgende stap)


Page 22

Website beheren: de basis 6.2 Layout preview Een aangeklikte paginalayout kun je hier beoordelen. Vervolgens kun je klikken op Annuleren om terug te gaan en een andere layout te kiezen, of je klikt op Houden. Bij "Houden" wordt de lay-out toegepast en worden de teksten en afbeeldingen op je pagina geplaatst. Deze kun je vervolgens gaan vervanderen in je eigen teksten en afbeeldingen.


Page 23

Website beheren: de basis 6.3 Slepen vanuit de linker kolom De linker kolom van de Weebly website builder bevat de elementen die je kunt gebruiken op je pagina's. Kies een element en sleep het naar je pagina. De blauwe lijn geeft aan waar het element zal "vallen".


Page 24

Website beheren: de basis 6.4 Loslaten van een element Zodra je de muisknop loslaat, "valt" het element op de plek die met een blauwe lijn werd aangegeven. Vervolgens kun je klikken op het element om het te bewerken.


Page 25

Website beheren: de basis 6.5 Element bewerken Pas het element naar wens aan. In dit voorbeeld is het een tekst.


Page 26

Website beheren: de basis 6.6 Kopieëren, verplaatsen en verwijderen Als je met de muis over een element op de pagina gaat, dan komt er een dun blauw lijntje om het element, met aan de bovenkant drie functies: 1. Knopje om het element te kopiëren naar deze of een andere pagina, of te verplaatsen naar een andere pagina 2. Handvat om het element te verslepen binnen de pagina 3. Knopje om het element te verwijderen


Page 27

Website beheren: de basis 6.7 Kolommen maken Kolommen maak je eenvoudig door een element links of rechts naast een bestaand element te slepen. Let op het blauwe streepje dat aangeeft waar het nieuwe element zal "vallen" als je de muisknop loslaat. De beschikbare ruimte wordt dan verdeeld over twee kolommen. Sleep je er nog een element naast, dan onstaan er 3 kolommen, enz.


Page 28

Website beheren: de basis 6.8 Kolombreedte aanpassen In dit voorbeeld zie je 3 kolommen, maar ze zijn niet even breed. Je kunt de breedte aanpassen door op de grens tussen 2 kolommen te klikken en naar links of rechts te slepen. De breedte zal dan stapsgewijs worden aangepast. TIP: Als je de Shift-toets ingedrukt houdt tijdens het slepen, dan kun je geheel traploos de breedte aanpassen.


Page 29

Website beheren: de basis 6.9 Kolom verwijderen Verwijder stuk voor stuk de elementen uit de kolom die je weg wilt hebben, of sleep ze naar een nieuwe plek op de pagina. Zodra de kolom leeg is zal hij automatisch verdwijnen.


Page 30

Website beheren: de basis 7. Beschikbare Elementen Hieronder volgen voorbeelden van de meest belangrijke elementen die tot je beschikking staan.


Page 31

Website beheren: de basis 7.1 Element Titel Gebruik titels om kopjes te maken boven pagina's en boven teksten. Door de lettergrootte aan te passen kun je hoofd- en subkoppen maken


Page 32

Website beheren: de basis 7.2 Element Tekst Het tekstelement kan worden gebruikt voor lange en voor korte teksten. De tekst kan worden bewerkt met de volgende functies (zie afbeelding): 1. 2. 3. 4. 5. 6. 7.

Vet, schuingedrukt en onderstreept Lettergrootte groter en kleiner Kleur van de tekst Maak een link naar een pagina binnen of buiten de site Uitlijning van de tekst Opsomming genummerd of ongenummerd Opmaak van tekst verwijderen. Gebruik dit wanneer tekst is gekopieerd uit andere bronnen. 8. Undo / Redo: ongedaan maken van de laatste bewerking(en). Een tekst element kan ook een afbeeldingselement bevatten! Sleep een afbeeldingselement daartoe op het tekstelement en kies vervolgens of je het links of rechts uitgelijnd wilt hebben.


Page 33

Website beheren: de basis 7.3 Element Afbeelding Een afbeelding kan eenvoudig worden toegevoegd vanaf je computer of door de link naar een afbeelding elders op het internet in te voeren. De volgende functies staan tot je beschikking: 1. 2. 3. 4. 5. 6. 7. 8.

Sleep de hoek rechtsonder om de grootte van de foto te wijzigen. Bewerk de foto (o.a. bijsnijden, kleureffecten, afbeelding toevoegen (bijv. logo o.i.d.)) Uitlijning van de foto, links, midden of rechts. Lightbox houdt in dat als een bezoeker op de foto klikt, deze vergroot wordt weergeven, terwijl de achtergrond wordt gedimd. Via de link functie kun je van de afbeelding een link maken naar een andere pagina binnen of buiten je site. Spatie heeft betrekking op de hoeveelheid witruimte boven en onder de foto Via de optie Beschrijving kun je een onderschrift toevoegen aan de foto. Via Geavanceerd (niet zichtbaar in deze afbeelding) kun je een rand om de foto aanbrengen en een tekst voor blinden en slechtzienden opgeven.


Page 34

Website beheren: de basis 7.4 Element Tekst gecombineerd met afbeelding Sleep eenvoudigweg een afbeeldingselement over een tekst element. Kies vervolgens de juiste afbeelding. Via de rechteronderhoek van de afbeelding kun je de grootte aanpassen, sleep de hoek totdat de afbeelding de gewenste afmetingen heeft. Klik op de foto om de instellingen aan te passen. Onder de rubriek "geavanceerd" van de instellingen vind je de optie om de foto links of rechts in je tekst te plaatsen. De tekst vloeit er vervolgens automatisch omheen, met de juiste afstand tot de afbeelding. NB: Per tekstelement kun je één afbeeldingelement toevoegen. Heb je een langere tekst die je met plaatjes wilt illustreren, verdeel de tekst dan over meerdere tekstelementen.


Page 35

Website beheren: de basis 7.5 Element: Galerij Een galerij element laat meedere foto's zien, in rijen en kolommen. Bezoekers kunnen klikken op een foto om deze groot in beeld te krijgen, en vervolgens te bladeren door de andere foto's. Elke foto kan een link zijn naar iets anders, of van een onderschrift worden voorzien. Ook kun je instellen uit hoeveel foto's er op één regel getoond moeten worden (aantal kolommen).


Page 36

Website beheren: de basis 7.6 Element Diapresentatie Via een dispresentatie kun je vele afbeeldingen toevoegen waarvan er steeds één groot in beeld is. De foto's kunnen elkaar automatisch afwisselen en je kunt kiezen om kleine versies van de foto's (Thumbnails) naast de grote foto te tonen.


Page 37

Website beheren: de basis 7.7 Element Kaart / Map / Plattegrond Met dit element kun je eenvoudig een Google Maps kaartje van een bepaald adres invoegen.


Page 38

Website beheren: de basis 7.8 Element scheidingslijn Met een scheidingslijn kun je onderdelen van een pagina (of van een kolom) van elkaar scheiden. De lege ruimte boven en onder de lijn kun je instellen. De scheidingslijn kan alleen horizontaal worden toegepast.


Page 39

Website beheren: de basis 7.9 Element Spacer (Ruimte) Met het ruimte element ("spacer") kun je lege ruimte creëren. Door aan het blauwe balkje onderin te slepen, kun je traploos de hoogte bepalen. Je kunt er ook een lege kolom mee forceren. Sleep 'm daartoe naast een bestaand element en pas vervolgens de kolombreedte aan (zie 6.8 van deze handleiding).


Page 40

Website beheren: de basis 7.10 Element Knop Een knop kun je gebruiken als prominente link naar een ander onderdeel van de site.


Page 41

Website beheren: de basis 7.11 Elementen Media Je kunt diverse soorten media gebruiken op je pagina: 1. HD Video bestanden 2. Audiobestanden (bijv. MP3) 3. Geopende documenten (bijv, Word of PDF), die direct kunnen worden gelezen en doorgebladerd op je site. 4. Films van YouTube 5. Willekeurige bestanden kun je via je site ter beschikking stellen.


Page 42

Website beheren: de basis 7.12 Elementen Overig De overige elementen die je kunt toepassen zijn: 1. Een ingesprongen blok tekst, bijvoorbeeld een uitspraak van iemand 2. Sociale media knoppen, deze vormen links naar je Facebook, Twitter, Pinterest, Google+ en andere sociale media 3. Een enquete formulier 4. Een contactformulier 5. Een zoekveld om binnen je site te zoeken.


Page 43

Website beheren: de basis 8. Opslaan en publiceren Alle wijzigingen die je doet worden door Weebly altijd automatisch opgeslagen. Daar hoef je geen moeite voor te doen. Zolang de website niet live is en alleen bekeken en bewerkt kan worden via het preview-adres, zijn alle wijzigingen ook meteen zichtbaar voor iedereen die het preview-adres kent. Als je website live is, dan zie je rechtsbovenin het scherm een oranje "PUBLICEREN" knop. Alle wijzigingen die je doet worden opgeslagen, maar zijn nog niet zichtbaar voor het publiek. Zo kun je vandaag, morgen en bijv. volgende week aanpassingen doen terwijl de website voor het publiek al die tijd ongewijzigd blijft. Pas als je op de PUBLICEREN knop klikt worden alle wijzigingen in één keer doorgevoerd en kan iedereen ze zien. Je kunt zovaak op PUBLICEREN klikken als je wilt, dus ook voor kleine wijzigingen.


Page 44

Website beheren: de basis 9. Uitloggen Alles wat je doet in Weebly wordt automatisch opgeslagen. Je kunt dus eigenlijk gewoon het venster van je browser (Google Chrome) sluiten zodra je wilt stoppen met bewerken. De "nette" manier om te stoppen is als volgt: 1. klik op het "hamburger" menu helemaal rechtsbovenin je scherm. 2. kies voor Editor verlaten, je komt nu weer op het hoofdscherm. 3. Op het hoofdscherm, klik op UITLOGGEN.


Page 45

Website beheren: de basis

Recommend Documents