Sportfondsen Nederland Handleiding websitetraining Versie 1.6



Vergelijkbare documenten
Handleiding. HetSchoolvoorbeeld.nl. HetSchoolvoorbeeld 2.1. Websites voor het onderwijs. Websites Social media Mediawijsheid Grafisch ontwerp

Inloggen. In samenwerking met Stijn Berben.

Ga naar en log in met de gebruikersnaam en wachtwoord verkregen via mail.

Handleiding. HetSchoolvoorbeeld.nl. Versie juni Websites voor het onderwijs. Meest recente uitgave: www. hetschoolvoorbeeld.

Handleiding wordpress


Inhoud van de website invoeren met de ContentPublisher

SWIS Handleiding Webbeheer

Basis handleiding CMS

Intranet. Handleiding voor redacteurs, nieuwsberichten.

Handleiding Wordpress

Handleiding. Content Management Systeem (C.M.S.)

IQ LEADS Adres: Curieweg 8E Postcode: 2408 BZ Plaats: ALPHEN AAN DEN RIJN Telefoon: (0172)

Na het inloggen met de gegevens die je hebt gekregen, verschijnt het overzichtsscherm zoals hieronder:

Central Station. CS website

Handleiding adviescommissies gemeente Oegstgeest

Handleiding CrisisConnect app beheersysteem

Schoolwebsite.nu. Snel aan de slag met uw website. Versie 4.0

Handleiding om uw website/webshop aan te passen

Handleiding Joomla CMS

CMS Template Handleiding

Handleiding Word Press voor de bewoners Westerkaap 1

Handleiding CMS Online Identity Webontwikkeling. Handleiding CMS

Een webshop vullen. a. Een product aanmaken. Ga nu naar Producten en kies voor Product toevoegen om een nieuw product aan te maken.

Handleiding CrisisConnect app beheersysteem

Om in te loggen in het CMS (Content Management Systeem) gaat u naar Hier ziet u het inlogscherm:

Handleiding Procesarchitectuur Herziening

EBUILDER HANDLEIDING. De Ebuilder is een product van EXED internet EXED CMS UITLEG

Handleiding korte instructie gebruik LommOnline voor verenigingen. Stap 1. Vooraf:

Handleiding MijnGemeente-app

Content tips & tricks

Handleiding Mijneigenweb.nl

CMS Made Simple eenvoudig uitgelegd CMS MADE SIMPLE- Eenvoudig uitgelegd

Handleiding Joomla! Frontend, content en gallery. september 2014 versie 1.0

Materiaalontwikkeling in PAV

Juni 2013 OKRA HANDLEIDING TREFPUNTSITES.

Handleiding IZEE CMS. Dit is de handleiding voor IZEECMS

Functionaliteit Nooit updaten Gratis upgrades

Handleiding Zwem4daagse website voor organisatoren

Handleiding voor Leden Teampagina aanpassen op

Instructies Zitecraft Content Management System (CMS)

CMS HANDLEIDING

Handleiding Procesarchitectuur Herziening

Mach3Framework 5.0 / Website

Handleiding Wordpress CMS

Umbraco Gebruikershandleiding

Handleiding. Yvonne Rijks-Waardenburg. Tine Strikkers. Christel van de Steenoven-Livius. Pagina 1

Website maker. Bezoek je domein om de Website maker in te stellen. De volgende melding zal zichtbaar zijn.

Trippeltrap Content Management System

Gebruikershandleiding Website RKVVO

HANDLEIDING DOIT BEHEER SYSTEEM

De inlogpagina van het CMS wordt nu geladen. Vul uw gebruikersnaam en wachtwoord in

EEN WEBLOG MAKEN MET BLOGGER

Gebruikershandleiding websitebeheer m.b.v. Wordpress

Handleiding MOBICROSS actie banners

Basishandleiding website voetbalvereniging Lemelerveld Wordpress content managementsysteem

Handleiding 2designers Content Management Systeem

Handleiding CMS VOORKANT

Handleiding. Berichten maken in WordPress. juni 2013

Globale kennismaking

All rights reserved, HKBO Basishandleiding WordPress

CMS Instructiegids Copyright Endless webdesign v.o.f

Bitrix Site Manager gebruikershandleiding BureauZuid

Studieobjecten bewerken Marnix academie. Laatst bijgewerkt op dinsdag 2 juni 2015

Handleiding WordPress Bakkeveen.nl

Handleiding voor ondernemers

CMS Instructiegids Copyright Endless webdesign v.o.f

Invoermodule website oudesmidse.com versie 1.0

Handleiding Blogger. Het aanmaken van een weblog. In deze handleiding worden een aantal handelingen toegelicht:

Wordpress handleiding LOA Lak B.V.

De WordPress 3.5 Beginners Handleiding

Handleiding Website beheersysteem

Gebruikershandleiding websitebeheer m.b.v. Wordpress incl. Woo-Commerce


Handleiding SCHOOLSTART.ONLINE START.ME

Gebruikershandleiding

Aanvullen en wijzigen van uw Profiel

Navigator CMS Beknopte handleiding v1.0

Handleiding. Versie januari Meest recente uitgave: www. hetschoolvoorbeeld.nl/handleiding. Handleiding HetSchoolvoorbeeld 2.

Handleiding VPNL Instore Communicatie

Algemene basis instructies

HANDLEIDING WEBHARE 1

Leerpaden maken. 1. Account en wachtwoord. 2. Maak een nieuw leerpad aan. 3. Inhoud aan een leerpad toe voegen. 4. Structuur aanbrengen op een pagina.

C o n t e n t M a n a g e m e n t S y s t e e m. G e b r u i k s a a n w i j z i n g

Handleiding Melkvee Connect

Hoe maak ik een account aan op Drenthe.nl

Handleiding voor ondernemers. De directe invoer van content in de database van visitbrabant.com

Algemene WordPress Handleiding uitleg basics Karin de Wit Design

Je website is het centrum van al je online activiteiten. Dat werkt allerlei kanten op.

Het Wepsysteem. Het Wepsysteem wordt op maat gebouwd, gekoppeld aan de gewenste functionaliteiten en lay-out van de site. Versie september 2010

QUICKSTART WEBSITE SYSTEEM GARDEN CONNECT

Snel aan de slag met BasisOnline en InstapInternet

Handleiding Windmill CMS - Connectholland

Gebruikershandleiding online vacaturebanken vrijwilligerswerk

HANDLEIDING BEHEER WEBSITE. Vrouwen van Nu

Safira CMS Handleiding

HANDLEIDING. CONTENT MANAGEMENT SYSTEEM - CJG APP / versie 1. STAP 1 - Maak uw CJG aan in de App. 1. Surf naar

SPECIALE VERSIE VOOR LEERKRACHTEN. Inhoud van de website invoeren met de ContentPublisher. 1. Inloggen. 2. Overzicht

Transcriptie:

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 Websitestructuur 3.1 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 Zakelijk Intranet accomodatie x accommodatie y Versie 0.9 Pagina 4 van 54

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 d.verhoef@sfn.nl. 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 020-3550563 of d.verhoef@sfn.nl. 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 e- mailadres vul dan het e-mailadres in met daarvoor de code mailto: bijvoorbeeld mailto:d.verhoef@sfn.nl. 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