Sportfondsen Nederland Handleiding websitetraining Versie 1.6
Versie 1.6 20-12-2012
1
Inhoudsopgave
1
INHOUDSOPGAVE ......................................................................................... 2
2
INLEIDING .................................................................................................... 3
3
WEBSITESTRUCTUUR .................................................................................... 4 3.1 UITLEG OPBOUW SITE ...................................................................................... 4 3.1.1 Gebruikerstabbladen .......................................................................... 4 3.2 RELATIES TUSSEN DE VERSCHILLENDE HOOFDONDERDELEN ........................................... 4 3.3 CONSUMENTENHOMEPAGE (WWW.SPORTFONDSEN.NL) ................................................ 5 3.3.1 Homepage......................................................................................... 5 3.3.1.1 Accommodatie zoeken ..................................................................... 5 3.3.1.2 Overige functies .............................................................................. 6 3.3.1.3 Site-Menu ...................................................................................... 6 3.3.1.4 Acties ............................................................................................ 6 3.3.2 Nieuws en activiteiten/evenementen .................................................... 7 3.3.3 Producten ......................................................................................... 7 3.3.4 Werken bij ........................................................................................ 8 3.4 ZAKELIJKE WEBSITE (WWW.SPORTFONDSEN.NL/ZAKELIJK) ........................................... 9 3.5 INTRANET .................................................................................................... 9 3.6 DE ACCOMMODATIEWEBSITE .............................................................................10 3.6.1 De homepage ...................................................................................10 3.6.2 Productpagina...................................................................................11 3.6.3 Contactpagina ..................................................................................12 3.6.4 Nieuws-/evenementpagina .................................................................13
4
AAN DE SLAG .............................................................................................. 14 4.1 BEHEERBARE ONDERDELEN ...............................................................................14 4.2 INLOGGEN IN HET CMS ...................................................................................15 4.3 BEHEERBARE ONDERDELEN: HOMEPAGE ................................................................16 4.3.1 Sliderbanner, logo en buttonafbeeldingen ............................................16 4.3.2 Footer en link naar snelbuttons en sociale media-icoontjes aanpassen .....19 4.3.2.1 Slider-banners linken ......................................................................21 4.3.3 Beheerbare Twitter-account ...............................................................22 4.4 BEHEERBARE ONDERDELEN: NIEUWS ...................................................................25 4.5 BEHEERBARE ONDERDELEN: ACTIVITEITEN / EVENEMENT ............................................29 4.6 BEHEERBARE ONDERDELEN: PRODUCTEN ...............................................................32 4.6.1 Menuvolgorde aanpassen ...................................................................39 4.6.2 Een pagina bewerken ........................................................................42 4.6.2.1 Inhoudseditors ...............................................................................43 4.6.2.2 Een afbeelding toevoegen................................................................44 4.6.2.3 Een link/koppeling toevoegen ..........................................................45 4.6.2.4 Een pdf toevoegen .........................................................................46 4.6.2.5 Video plaatsen op pagina ................................................................47 4.6.2.6 Titel aanpassen van de inhoudseditor ...............................................48 4.7 VACATURES .................................................................................................50 4.8 BUTTON PLAATSEN IN EEN INHOUDSEDITOR ...........................................................52
Versie 0.9
Pagina 2 van 54
2
Inleiding
Deze handleiding geeft uitgebreide informatie over het cms. Het Sportfondsen CMS is gebaseerd op het WYSIWYG principe. Dit CMS is uiterst gebruikersvriendelijk en biedt veel voordelen. Snel content wijzigen via het CMS Je kunt via het CMS zelf nieuwe berichten plaatsen of teksten wijzigen. Je bent hierin niet meer afhankelijk van derden. Gemakkelijk actueel houden Het CMS is zeer gebruikersvriendelijk opgebouwd volgens “what you see is what you get” principe. Het CMS toont een kopie van de publieke website zodat de betreffende pagina in het CMS makkelijk is op te vragen en te wijzigen. Eenvoudig tekst aanpassen met ingebouwde Word editor Door de herkenbare Microsoft Word functiebalk is het toevoegen, wijzigen en opmaken van tekstpagina's binnen de CMS word editor zeer eenvoudig. Het CMS converteert dit naar HTML code zonder dat u ook maar iets hoeft te doen! Foto’s en afbeeldingen in de tekst toevoegen Via de webbrowser in het CMS zijn JPEG afbeeldingen te uploaden. Met CMS nieuwsberichtenmodule zelf nieuws publiceren Nieuwsberichten kun je via het CMS zeer snel en eenvoudig online publiceren. De nieuwsberichten worden dynamisch getoond in de nieuwsberichtenmodule en op publicatiedatum gesorteerd.
Versie 0.9
Pagina 3 van 54
3 3.1
Websitestructuur Uitleg opbouw site
Er is gekozen voor een frisse lay-out en een heldere structuur, waarbij er duidelijk onderscheid wordt gemaakt tussen de 3 bezoekerstypen van de website; consumenten (accommodatie) zakelijke bezoekers accommodatiemedewerkers en managers. 3.1.1 Gebruikerstabbladen Via tabbladen rechtsboven op de pagina kun je schakelen tussen de verschillende hoofdonderdelen van de site. Afhankelijk van welke gebruiker je bent.
3.2
Relaties tussen de verschillende hoofdonderdelen Sportfondsen
Consument
accomodatie x
accommodatie y
Versie 0.9
Pagina 4 van 54
Zakelijk
Intranet
3.3
Consumentenhomepage (www.sportfondsen.nl)
3.3.1 Homepage De homepage voor consumenten ziet er als volgt uit:
3.3.1.1
Accommodatie zoeken
Via de homepage van Sportfondsen kunnen bezoekers van de website (consumenten) zoeken naar accommodaties bij hen in de buurt. Deze zoekfunctie is de belangrijkste functie van de homepage.
Versie 0.9
Pagina 5 van 54
3.3.1.2
Overige functies
Als aanvulling op het site menu, ook aan de onderzijde van de homepage een aantal belangrijke onderdelen van de consumenten-site prominent in beeld gebracht zoals nieuws, producten, acties, werken bij en Twitter.
3.3.1.3
Site-Menu
Via het Site-Menu kun je naar de verschillende onderdelen binnen het huidige geselecteerde hoofdonderdeel van de site gaan
3.3.1.4
Acties
Op deze pagina vinden bezoekers informatie over collectieve acties van Sportfondsen, bijvoorbeeld over Lucky Lockers of het NK Bommetje. Deze pagina wordt beheerd door de afdeling Expertise.
Versie 0.9
Pagina 6 van 54
3.3.2 Nieuws en activiteiten/evenementen Het nieuws en de activiteiten/evenementen op de algemene nieuwspagina is een verzameling: van alle landelijke en accommodatie-gebonden nieuwsberichten van alle landelijke en accommodatie-gebonden activiteiten en events Als je als accommodatie een nieuwsitem en/of evenement plaatst op je accommodatiewebsite verschijnt deze automatisch op de algemene nieuwspagina.
3.3.3 Producten Op deze pagina vinden bezoekers informatie en uitleg over de productformules van Sportfondsen Nederland zoals ClubAqua, Jip’s WaterWereld en het NationaalZwemles kompas. Via deze pagina worden bezoekers via een link doorgestuurd naar de productformule specifieke website, bijvoorbeeld www.jipswaterwereld.nl. Deze website wordt beheerd door de afdeling Expertise.
Versie 0.9
Pagina 7 van 54
3.3.4 Werken bij Ook de pagina ‘werken bij Sportfondsen’ is een verzameling van alle Sportfondsen vacatures. Deze pagina wordt automatisch gevoed met de vacatures van de accommodatie. Als je als accommodatie een vacature plaatst op jouw accommodatiewebsite, dan verschijnt deze automatisch op de pagina Werken bij Sportfondsen. Ook de vacatures van het hoofdkantoor worden vanuit de zakelijke website geplaatst in de totale vacaturelijst.
Versie 0.9
Pagina 8 van 54
3.4
Zakelijke website (www.sportfondsen.nl/zakelijk)
Met de zakelijke website profileren we het Sportfondsen Shared Services Center voor onze zakelijke klanten. Dit zakelijke deel van de website heeft dezelfde structuur en dezelfde lay-out als de accommodatiesites. De corporate huisstijl (kleurstelling + logo) maakt duidelijk dat de bezoeker zich bevindt in de zakelijke omgeving. Deze zakelijke website wordt beheerd door de afdeling Expertise.
3.5
Intranet
De pagina Intranet biedt toegang tot de online diensten Sportfondsen Nederland, zoals de Bestelsite, de Sportfondsen Academie en de Sportfondsen Portal.
Versie 0.9
Pagina 9 van 54
3.6
De accommodatiewebsite
De accommodatiewebsite bestaat uit vier typen pagina’s: De homepage Productpagina Contactpagina Nieuws-/evenementpagina
3.6.1 De homepage Zoals je ziet heeft de accommodatiewebsite dezelfde structuur en lay-out als de algemene consumentenwebsite van Sportfondsen. Dit maakt het voor bezoekers van de website eenvoudig navigeren. Het belangrijkste onderdeel van de homepage is het activiteiten/evenementen-overzicht. Daarnaast is er een fotocarrousel om dynamiek te creëren en onderin buttons voor een makkelijke navigatie.
Versie 0.9
Pagina 10 van 54
3.6.2 Productpagina Binnen jouw accommodatie heb je uiteraard een hoop producten (lees: diensten). Zo hebben zwembaden groepsactiviteiten zoals (Club)Aqua-activiteiten, zwemlessen en overige activiteiten. Voor al deze producten bestaat een vaste vorm. Deze vorm bestaat uit een hoofdafbeelding van het product, teksten met informatie over het product bestaande uit een titel, sub kopjes, en een meer informatie kolom waarin je kunt verwijzen naar een externe pagina (voor bijvoorbeeld openingstijden en tarieven), een download of contact laten opnemen met de receptie. Op deze pagina wordt tevens het lokale weer getoond.
Versie 0.9
Pagina 11 van 54
3.6.3 Contactpagina Een contactpagina is een afwijkende pagina en bevat een contactformulier, contactgegevens (met eventueel een foto) van de accommodatie en een verwijzing naar de routebeschrijving via Google Maps.
Versie 0.9
Pagina 12 van 54
3.6.4 Nieuws-/evenementpagina Een nieuws-/evenementpagina bevat informatie over een nieuwsitem of een evenement uit jouw accommodatie. De pagina bevat het nieuwsbericht of het evenementbericht met een titel, een tekst en eventueel een bijhorende afbeelding. In de rechterkolom wordt een overzicht getoond van de laatste overige nieuwsberichten of evenementen.
Versie 0.9
Pagina 13 van 54
4
Aan de slag
Het Sportfondsen CMS geeft je de mogelijkheid om een groot deel van jouw website aan te passen en te vullen naar eigen wensen. Voordat je informatie krijgt over hoe je onderdelen kunt aanpassen, geven we eerst een overzicht van welke onderdelen die je wel kunt aanpassen en welke onderdelen je niet kunt aanpassen. 4.1
Beheerbare onderdelen
Om de uitstraling, leesbaarheid en functionaliteiten van de websites te bewaken zijn een aantal onderdelen en teksten van uw accommodatiewebsite vergrendeld en niet door een beheerder van de accommodatiewebsite aan te passen. De onderstaande onderdelen van de accommodatiewebsite worden beheerd door de afdeling Expertise:
Tagline Kleurstelling Productpagina’s van: ClubAqua, Jip’s WaterWereld, Zwemleskompas, Gedragscode en Keurmerk Veilig & Schoon.
Heb je vragen en/of opmerkingen over deze onderdelen of wil je deze items laten aanpassen, neem dan contact op met de helpdesk via 020-3550563 of
[email protected]. Als beheerder van de accommodatiewebsite heb je toegang tot de onderstaande onderdelen die je kunt toevoegen, wijzigen en aanpassen:
Hoofdmenu Nieuws Fotocarroussel Activiteiten / Evenementen Productpagina’s / submenustructuur Vactures Sociale media-icoontjes Twitter Foto’s (inclusief inrichten beeldbank via Picasa. Let op: SEO-proof) Filmpjes (uitleg YouTube kanaal + embedden) Contact
Versie 0.9
Pagina 14 van 54
4.2
Inloggen in het CMS
Om gegevens aan te passen in de website dien je in te loggen in het CMS. Om in te loggen, klik je op ‘Sign In’ rechts onderin de pagina. Dit kan op elke willekeurige pagina binnen de accommodatiewebsite.
Vervolgens voer je jouw inloggegevens in:
Inloggegevens: De inloggegevens ontvang je van ons. Inloggegevens kwijt? Als u uw inloggegevens kwijt bent kunt u contact opnemen met de Helpdesk, op 0203550563 of
[email protected].
Versie 0.9
Pagina 15 van 54
4.3
Beheerbare onderdelen: Homepage
In hoofdstuk 1.6.1. hebben we de verschillende onderdelen van de homepage aangegeven. We geven nu een omschrijving hoe je zaken van de homepage kunt aanpassen. 4.3.1 Sliderbanner, logo en buttonafbeeldingen Op de homepage staat standaard een slider-banner (ook wel foto-carrousel genoemd), bestaande uit maximaal drie foto’s (afmeting 580 x 295 pixels) die om de 5 seconden wordt verwisseld, het Sportfondsen- of SportPlaza-logo, buttons naar openingstijden, tarieven en acties (afmeting 180 x 125 pixels) én extra buttons naar bijvoorbeeld het lesscore, direct kopen etc. Je kunt deze afbeeldingen veranderen in eigen afbeeldingen.
Om de afbeeldingen aan te passen ga je naar Siteacties Daarna kies je voor ‘Alle site-inhoud weergeven’
Versie 0.9
Pagina 16 van 54
Kies vervolgens voor SiteAfbeeldingen
Nu zie je een overzicht van de afbeeldingen die op de homepage staan
Versie 0.9
Pagina 17 van 54
Je kunt de afbeelding of logo vervangen door een nieuwe afbeelding of logo te uploaden met exact dezelfde eigenschappen als de huidige afbeelding of logo. Overzicht van de eigenschappen: Logo Sportfondsen Bestandsnaam: logo-green Bestandstype: jpg Afmetingen: 252 x 82 pixels Logo SportPlaza Bestandsnaam: logo-orange Bestandstype: jpg Afmetingen: 196 x 75 pixels Sliderbanner afbeelding Bestandsnaam: slider-banner# (# = nummer van de slide, dus 1, 2 of 3) Bestandstype: jpg Afmetingen: 580 x 295 pixels Afbeeldingsbuttons Bestandsnaam: thumbnail# (# = nummer van de slide, dus 1, 2, of 3) Bestandstype: jpg Afmetingen: 180 x 125 pixels Snelbuttons Bestandsnaam: OtherBtn, LesscoreBtn of ReserveBtn Bestandstype: png Afmetingen: 182 x 30 pixels Een afbeelding uploaden gaat als volgt. Klik op uploaden en vervolgens op ‘Afbeelding uploaden’
Haal de afbeelding of logo op door op bladeren te klikken en klik vervolgens op OK
Versie 0.9
Pagina 18 van 54
4.3.2 Footer en link naar snelbuttons en sociale media-icoontjes aanpassen In de footer (voettekst) staat de copyright informatie, het verplichte Kamer van Koophandel-nummer en icoontjes van Facebook, Twitter, Hyves en Youtube. Niet in de footer, maar wel op de homepage bevinden zich de snelbuttons. Deze informatie is uiteraard aan te passen. Ga hiervoor naar Siteacties.
Daarna kies je voor ‘Alle site-inhoud weergeven’
Kies vervolgens voor ‘Administration’
Versie 0.9
Pagina 19 van 54
Nu zie je een aantal onderdelen die op de homepage staan.
Versie 0.9
Pagina 20 van 54
Klik op de titel van het onderdeel dat je wilt aanpassen
En klik vervolgens op ‘item bewerken’
In het contentvak kun je vervolgens de tekst of link plaatsen die je wenst.
4.3.2.1
Slider-banners linken
Je kunt
Versie 0.9
Pagina 21 van 54
4.3.3 Beheerbare Twitter-account De Twitter-berichten moeten ingesteld worden op elke pagina waar deze verschijnt:
Na klikken op “Open menu” verschijnt onderstaand scherm
Klik op ‘here’, waarna je naar de Twitter-site gaat, waar je het account en wachtwoord invult dat je hier wil gebruiken:
Versie 0.9
Pagina 22 van 54
Klik vervolgens op “App authoriseren”, er wordt dan een PIN code gegenereerd:
Deze code vul je dan weer in op de Sportfondsen site:
Versie 0.9
Pagina 23 van 54
Klik vervolgens op “Get acces token info” Als laatste moet je in de lijst “Administration” (te vinden via ‘Site-acties | Alle Siteinhoud weergeven’) de naam van het Twitter-Account nog invullen:
Vul in dit item bij “Content” het twitter account in:
Het laatste Twitter-bericht wordt dan getoond:
Versie 0.9
Pagina 24 van 54
4.4
Beheerbare onderdelen: Nieuws
Om het nieuws te beheren ga je eerst naar ‘Siteacties’:
Daarna kies je voor: ‘Alle Site-inhoud weergeven’
Versie 0.9
Pagina 25 van 54
Daarna kiest u voor: ‘Nieuws’
Versie 0.9
Pagina 26 van 54
Nu zie je een overzicht van de bestaande nieuwsberichten en kun je er direct één toevoegen via de optie ‘Nieuw item toevoegen’:
Er verschijnt dan een nieuw scherm waarin u de volgende informatie kunt invoeren over het nieuwsitem: -
Newsimage (580 x 295 pixels) Titel Hoofdtekst (het nieuwsitem zelf)
Versie 0.9
Pagina 27 van 54
NewsImage plaatsen doe je als volgt. Klik in het vak van NewsImage. Een tabblad verschijnt in het lint.
Klik in het tabblad op Invoegen en daarna op de knop afbeelding. Je ziet het volgende venster:
Klik op Bladeren… om een afbeelding vanaf jouw computer te uploaden en selecteer vervolgens in het dropdownmenu Afbeeldingen in plaats van Siteactiva. Plaats de afbeelding door op OK te klikken.
Versie 0.9
Pagina 28 van 54
4.5
Beheerbare onderdelen: Activiteiten / evenement
De activiteiten/evenementen vind je op de nieuwspagina van de consumentenhomepage en direct op jouw accommodatiehomepage:
Nieuwspagina van de consumentenhomepage
Accommodatiehomepage
Versie 0.9
Pagina 29 van 54
Je beheert de activiteiten via de lijst ‘Activiteiten’ die je benadert via ‘Site-acties | Allesite-inhoud weergeven’:
Vervolgens klik je op ‘Nieuw item toevoegen’
Versie 0.9
Pagina 30 van 54
Je komt in het onderstaande scherm. In dit scherm kun je een nieuwe activiteit toevoegen door de diverse velden in te vullen. Klik vervolgens op ‘Opslaan’ en de activiteit wordt opgenomen op de activiteitenkalender op de homepage.
In hoofdstuk 2.4 valt te lezen hoe je een afbeelding bij de activiteit kunt plaatsen.
Versie 0.9
Pagina 31 van 54
4.6
Beheerbare onderdelen: Producten
In hoofdstuk 1.6.2. hebben we het gehad over de productpagina. Nu gaan we een productpagina maken, zodat je je aanbod kunt plaatsen op jouw website. Je kunt productpagina’s toevoegen aan het standaard menu en wordt tevens getoond in het dropdownmenu.
De pagina ziet er als volgt uit:
Ook om de Producten te beheren gaat u eerst naar ‘Siteacties’:
Versie 0.9
Pagina 32 van 54
Daarna kiest u voor ‘Nieuwe Pagina’:
U kunt de nieuwe pagina nu een naam geven (in dit geval: Voorbeeldproduct). Daarna klikt u op de knop ‘Maken’ onderaan dit scherm.
De pagina wordt nu aangemaakt. Direct vullen Wil je de pagina direct vullen? Lees in hoofdstuk 4.6.1 Pagina bewerken hoe je de pagina kunt aanpassen. Nadat de pagina is aangemaakt klik je op ‘ Opslaan en sluiten’ linksbovenin het scherm.
De pagina is nu gemaakt. Je moet alleen nog aangeven op welke plaats in het menu de pagina moet komen te staan. Dit doe je als volgt:
Versie 0.9
Pagina 33 van 54
In het vervolgscherm klik je op: Pagina
Daarna op Eigenschappen bewerken
Er verschijnt dan een scherm met een groot aantal eigenschappen die je kunt aanpassen. Je kunt hier onder andere kiezen voor een specfieke begindatum en einddatum waarop de pagina zichtbaar is (‘Scheduling Start Date’ en ‘ Scheduling End Date’ ).
Versie 0.9
Pagina 34 van 54
Onderaan het scherm kun je bij Category en Subcategory aangeven op welke plek (in welke laag) in het menu het product moet komen te staan. Lees meer de lagen en de menuvolgorde in hoofdstuk 4.6.1 Menuvolgorde aanpassen. Je kunt subcategories en categories aanmaken of wijzigen in de lijst Category of Subcategory (Site-acties Alle Site-inhoud weergeven Category/Subcategory).
Versie 0.9
Pagina 35 van 54
Nadat je de laag hebt gekozen, klik je opslaan. De productpagina is nu voor jou en andere beheerders zichtbaar, maar nog niet voor de gewone bezoekers van de website. Om het product ook voor hen zichtbaar te maken dien je de pagina in te checken en te publiceren. Hiervoor klik je op ‘ Publiceren’
Daarna klik je op het bijbehorende pictogram:
Er verschijnt nu een nieuw scherm waarin je een korte beschrijving van de pagina kunt geven, waarna je klikt op ‘ Doorgaan’ :
Versie 0.9
Pagina 36 van 54
De pagina is nu gepubliceerd en zichtbaar voor alle bezoekers van de website.
Nu hoeft de pagina alleen nog verborgen te worden, zodat het niet in het hoofdmenu zichtbaar blijft. Dit gaat als volgt. Klik op Siteacties en vervolgens op Site-instellingen
Klik vervolgens bij Uiterlijk op Navigatie
Versie 0.9
Pagina 37 van 54
Er volgt lijst met uitgebreide informatie over de navigatie. Bij het onderdeel Navigatie bewerken en sorteren zie je een lijst met de pagina’s in het menu. Klik op de nieuw gemaakte productpagina in de lijst om de pagina te selecteren en vervolgens op Verbergen.
Klik vervolgens op OK aan de onderzijde of bovenzijde van het menu om de wijziging op te slaan. De productpagina is nu succesvol aangemaakt.
Versie 0.9
Pagina 38 van 54
4.6.1 Menuvolgorde aanpassen De website bestaat uit drie menulagen. In dit hoofdstuk lees je hoe je de volgorde kunt aanpassen van elke menulaag. We onderscheiden de volgende lagen: - Category (laag 1) - SubCategoryPage (laag 2) - SubCategory (laag 3) Laag 1 De volgorde aanpassen van de eerste laag doe je als volgt: Klik op Siteacties en vervolgens op Site-instellingen
Klik vervolgens bij Uiterlijk op Navigatie
Versie 0.9
Pagina 39 van 54
Er volgt lijst met uitgebreide informatie over de navigatie. Bij het onderdeel Navigatie bewerken en sorteren zie je een lijst met de pagina’s in het menu. Klik op de pagina uit de eerste laag. De pagina wordt grijs gearceerd.
Klik vervolgens op Omhoog of Omlaag om de pagina naar voren (links) of achteren (rechts) te plaatsen. Klik op OK aan de onderzijde of bovenzijde van het menu om de wijziging op te slaan. De pagina is nu van positie veranderd. Laag 2 en 3 De volgorde aanpassen van de tweede en derde menulaag werkt op een andere manier. Ga als volgt te werk:
- Ga naar een pagina, - Klik op het tabblad Pagina
Versie 0.9
Pagina 40 van 54
- Kies vervolgens op Eigenschappen bewerken
Bij de keuze van de plek in het menu zijn twee velden bijgekomen, namelijk: - SubCategoryOrder - SubCategoryPageOrder
Met nummers kun je aangeven welke plek deze pagina moet krijgen, waarbij 1 helemaal bovenaan is, 2 daaronder etc. Betreft het een pagina in laag 2 (SubCategorypage) dan moet je bij SubCategoryPageOrder het nummer invullen. Betreft het een pagina in laag 3 (SubCategory), dan moet je bij SubCategoryOrder het nummer invullen. Tip: Aan het vinkje bij SubCategoryPage kun je zien om welke laag het gaat!
Wanneer je op opslaan klikt, zie je het ingevoerde product (Banen zwemmen) onder de geselecteerde subcategorie (Activiteiten) en in het hoofdmenu.
Versie 0.9
Pagina 41 van 54
4.6.2 Een pagina bewerken Je weet inmiddels hoe je een productpagina kunt aanmaken en de volgorde kunt bepalen in het menu. In dit hoofdstuk lees je wat je allemaal kunt doen om de pagina te vullen. Om een pagina te bewerken ga je via het menu naar de betreffende pagina. Klik vervolgens op Site-acties Pagina bewerken
Je komt nu in een scherm waarin je de content (tekst/afbeeldingen/video’s) van de pagina/het product kunt invoeren. Je ziet dat een productpagina bestaat uit 4 zones met daarin het webonderdeel Inhoudseditor. Zone 1 is bedoeld voor de productafbeelding (490 x 150 pixels), Zone 4 voor de hoofdteksten en Zone 2 en Zone 3 zijn geschikt voor subteksten, zoals verwijzingen en buttons. Let op: ontbreekt er een webonderdeel? Vraag dan naar het informatieblad Webonderdelen.
Met de Inhoudseditors kun je naar hartenlust de productpagina’s vullen met content. Hou wel rekening met de stijlregels die we hanteren in het huisstijldocument.
Versie 0.9
Pagina 42 van 54
4.6.2.1
Inhoudseditors
Een inhoudseditor is een webonderdeel waarin je content kwijt kunt. Sharepoint beschikt over ontzettend veel webonderdelen. Wij beperken ons tot twee webonderdelen, de inhoudseditor en het eigen ontworpen Webform. Content toevoegen aan de inhoudseditor werkt als volgt. Klik in inhoudseditor 2, 3 of 4 op de tekst Klik hier als u nieuwe inhoud wilt toevoegen om inhoud toe te voegen. Er verschijnt een editorlint die je waarschijnlijk ook van Word (her)kent.
Je kunt nu de informatie typen, maar ook plakken vanuit een andere tekst. De opmaakbalk met het lettertype, grootte en standaard opmaak zal niet al te veel problemen opleveren. Hou hierbij wel de huisstijlregels in acht. Tip: Kopieer de toe te voegen tekst via kladblok hier naar toe of maak zelf tekst. Op die manier wordt de opmaak uit de oude tekst gehaald.
Versie 0.9
Pagina 43 van 54
4.6.2.2
Een afbeelding toevoegen
Zoals hierboven staat gemeld is de inhoudseditor in zone 1 bestemd voor afbeeldingen. Hieronder geven we stapsgewijs weer hoe je een afbeelding kunt toevoegen. Klik in inhoudseditor 1 op de tekst Klik hier als u nieuwe inhoud wilt toevoegen om inhoud toe te voegen. In het editorlint verschijnt het oranje tabblad Bewerkingsprogr. Klik in dit tabblad op het subtabblad Invoegen
Klik op het pijltje onder Afbeelding. Je kunt hier kiezen om de afbeelding direct vanaf jouw computer te uploaden, van een extern adres of uit Sharepoint te halen. Van computer Met de optie Van computer upload je direct een afbeelding naar de website. Let er wel op dat je in het vervolgscherm bij Uploaden naar kiest voor de afbeeldingsmap.
Van adres Weet je de url van een afbeelding? Kies dan voor Van adres en plak hier die de url. Van Sharepoint Gebruik deze optie om direct een afbeelding te uploaden vanaf jouw afbeeldingsbibliotheek (of die van een andere website, bijv. de centrale bibliotheek)
Versie 0.9
Pagina 44 van 54
4.6.2.3
Een link/koppeling toevoegen
Je kunt in een inhoudseditor een koppeling maken naar bijvoorbeeld een PDF-bestand. Hiervoor ga je naar de betreffende pagina, klik je op site-acties en vervolgens op pagina bewerken. Klik in de inhoudseditor op de tekst Klik hier als u nieuwe inhoud wilt toevoegen om inhoud toe te voegen. Selecteer een getypte tekst, bijvoorbeeld Openingstijden 2013. In het editorlint verschijnt het oranje tabblad Bewerkingsprogr. Klik in dit tabblad op het subtabblad Invoegen
Klik op het pijltje onder Koppeling. Je kunt hier kiezen om de koppeling te maken naar een pagina of document binnen jouw Sharepointwebsite of naar een extern adres. Van Sharepoint Met de optie Van Sharepoint koppel je de geselecteerde tekst met een pagina of document binnen jouw Sharepoint website. Van adres Als je de tekst wilt koppelen aan een externe website, kies dan voor Van adres en plak hier die de url naar de website. Openen in nieuw tabblad Wil je dat de koppeling na het klikken op de tekst opent in een nieuw tabblad? Selecteer dan deze optie in het groene koppelingsmenu (deze verschijnt als je op koppeling klikt).
Versie 0.9
Pagina 45 van 54
4.6.2.4
Een pdf toevoegen
PDF-bestanden zijn ideaal voor folders, openingstijden, tarievenlijst of andere documenten. De bezoeker van jouw website kan deze vervolgens downloaden van jouw website, opslaan of uitprinten. Je kunt een Pdf-bestand of ander document op de volgende manier toevoegen aan jouw Sharepoint website. Hiervoor ga je naar de betreffende pagina, klik je op site-acties en vervolgens op pagina bewerken. Klik in de inhoudseditor op de tekst Klik hier als u nieuwe inhoud wilt toevoegen om inhoud toe te voegen. In het editorlint verschijnt het oranje tabblad Bewerkingsprogr. Klik in dit tabblad op het subtabblad Invoegen
Klik op het icoontje Bestand uploaden. Je kunt hier kiezen voor Bladeren om op jouw computer het bestand te kiezen welke je wilt uploaden. Kies bij Uploaden naar altijd voor Documenten, dan blijven jouw documenten op één plaats.
Versie 0.9
Pagina 46 van 54
4.6.2.5
Video plaatsen op pagina
Video’s uploaden naar de website gaat niet. Dit zorgt voor een trage website en hoge kosten voor het datagebruik. Wat wel mogelijk is om een video in te sluiten op een webpagina. Niemand die ziet dat het van een andere website komt. Ga als volgt te werk om de video in te sluiten. Videocode kopiëren Zoek de video op die je wilt embedden op Youtube
Klik onderaan de video op delen en vervolgens op insluiten. Kopieer de code van de video.
Video insluiten Ga naar de betreffende pagina waar de video moet komen, klik op site-acties en vervolgens op pagina bewerken. Klik in de inhoudseditor op de tekst Klik hier als u nieuwe inhoud wilt toevoegen om inhoud toe te voegen. In het editorlint verschijnt staat de rechterkant HTML, klik deze aan en kies vervolgens
Versie 0.9
Pagina 47 van 54
HTML-broncode bewerken.
Plak onderaan het venster de videocode. In de code staan de afmetingen van het filmpje vermeld. Deze moeten aangepast worden in Breedte 490, hoogte auto. Klik op Ok. De video is nu geplaatst.
4.6.2.6
Titel aanpassen van de inhoudseditor
Een titel van een Inhoudseditor wijzigen of weglaten kan als volgt. Klik op het kleine driehoekje naast de titel en vervolgens op Webonderdeel bewerken om de eigenschappen van het Webonderdeel aan te passen.
Het volgende menu verschijnt aan de rechterzijde van de pagina. Klik op Vormgeving om het menu uit te klappen en de eigenschappen van de vormgeving te tonen.
Typ de titel bij (Titel) in (altijd in hoofdletters!) en geef aan of je de titel wilt tonen of niet (Chroomtype).
Versie 0.9
Pagina 48 van 54
Klik op OK om de wijzigingen door te voeren.
Versie 0.9
Pagina 49 van 54
4.7
Vacatures
Het beheren van de Vacatures doe je weer via het menu ‘ Site-acties’:
Daarna kies je voor: ‘Alle Site-inhoud weergeven’
In de pagina die dan verschijnt kies je voor ‘ Vacatures’
Versie 0.9
Pagina 50 van 54
In de pagina die dan verschijnt kies je voor Nieuw item toevoegen
Dan verschijnt een nieuwe pagina waarin je de vacature kunt invoeren, waarna je op Opslaan klikt.
Versie 0.9
Pagina 51 van 54
4.8
Button plaatsen in een Inhoudseditor
Kies de gewenste zone waar je een button wilt plaatsen en klik daar op de inhoudseditor. Gebruik de Inhoudseditor om een afbeelding toe te voegen (zie hoofdstuk …)
Nadat de afbeelding is ingevoegd kun je deze selecteren door erop te klikken en deze afbeelding laten verwijzen naar een pagina (koppeling). Klik hiervoor (in het tabblad Bewerkingsprogr.) op Invoegen en vervolgens op het kleine pijltje onder Koppeling.
Versie 0.9
Pagina 52 van 54
Als je kiest voor Van adres moet je niets invullen bij Weer te geven tekst, anders wordt dit weergegeven in plaats van de afbeelding.
Wil je verwijzen naar een externe website vul dan bij Adres het adres van de website in, bijvoorbeeld http://www.google.com. Wil je de afbeelding laten verwijzen naar een emailadres vul dan het e-mailadres in met daarvoor de code mailto: bijvoorbeeld mailto:
[email protected]. Als je kiest voor van Sharepoint kun je kiezen voor een bestaande pagina binnen de website. Je kunt de afbeelding enkele opmaakstijlen meegeven door op Stijlen van afbeelding te klikken.
Versie 0.9
Pagina 53 van 54
Versie 0.9
Pagina 54 van 54