Lions KlubCMS (Lions DK hjemmeside-editorsystem)

Lions KlubCMS (Lions DK hjemmeside-editorsystem) Version 0208 Brugervejledning til oprettelse og vedligeholdelse af Lions klub hjemmesider Brugervejledning CMS system version 0208 Side 1 af 22

Indholdsfortegnelse 1 Indledning...3 2 Sådan kommer du i gang...4 3 Opret en side...5 4 Opret et menupunkt...6 5 Opret en nyhed...8 6 Side redigering (editor)... 10 6.1 De forskellige ikoner... 10 6.1.1 Gode råd om redigering... 10 6.2 Indsæt et billede... 13 6.2.1 Vælg et billede der ligger i KlubCMS systemet... 13 6.2.2 Vælg et billede der findes på din computer... 14 6.3 Indsæt en reference (link) til en anden side... 15 6.4 Lidt om linieskift... 15 6.5 Specielle koder... 16 6.6 Tabeller... 17 Appendix A. Om TinyMCE... 18 6.7 De mest almindelige knapper... 18 6.8 Indsæt billeder... 19 6.9 Indsæt link... 20 6.10 Indsæt bogmærke... 20 6.11 Indsæt tabel... 21 6.12 Skabe tilgængeligt indhold... 22 Brugervejledning CMS system version 0208 Side 2 af 22

1 Indledning Velkommen til Lions Danmarks klub hjemmeside system, der omfatter hjælp til at oprette og vedligeholde din klubs eksterne hjemmesider. Systemet kaldes i daglig tale KlubCMS CMS betyder Content Management System, og på dansk indholds administrations system. Det betyder at du kan koncentrere dig om indhold i stedet for tekniske koder (herunder HTML). KlubCMS kan anvendes blot du har en Internet adgang og en browser (det program du benytter til at gå på Internettet, f.eks. Internet Explorer, Firefox osv.), og har kendskab til tekstbehandling (f.eks. Word). KlubCMS består af følgende: Menuer Sider Nyheder Hjemmesidens opbygning ser således ud: LOGO Menu Nyheder Side Det overordnede layout, farvevalg og skrifttyper er fastlagt. Du skal således alene koncentrere dig om indhold på siderne. Systemet indeholder en række skabeloner, der gør det nemmere at opsætte siderne. Vi håber, at du og klubben vil få glæde af systemet. OBS: Der kan være forskelle i de viste skærmbilleder og det du faktisk ser. Dette skyldes at systemet jævnligt opdateres og forbedres. De grundlæggende ting er dog de samme. Brugervejledning CMS system version 0208 Side 3 af 22

2 Sådan kommer du i gang Før du kan gå i gang, skal du oprettes som KLUBCMS ansvarlig. Kontakt din KLOA eller Mailsupporten i LionsOffice derom. Du logger på CMS editoren på adressen CMS.NEXTWAVE.DK eller via LionsOffice menuen Links KlubCMS Logon Du skal indtaste dit medlemsnr og kodeord for at logge på. Det er det samme som du anvender i Lions Office. Herefter kommer følgende side frem og du er klar til at oprette/ændre klubbens hjemmeside. Er du i gang med at lave hjemmesiden, så er den ikke aktiv endnu og det er klubbens eksisterende hjemmeside der vises. Når du er klar med CMS hjemmesiden kontakter du din ITC og CMS siderne gøres herefter til klubbens aktive hjemmeside. Du skal være opmærksom på at rettelser vises straks på hjemmesiden når du gemmer dem. For at se den hjemmeside du er i gang med at lave, skal du i et browser vindue gå ind på adressen test.klubnavn.lions.dk. Husk at ændringer kun vises når du trykker på F5 eller du klikker på Opdater-knappen. Navnet på klubbens hjemmeside er:..og navnet på klubbens e-mail er: klubnavn.lions.dk klubnavn@lions.dk OBS: klubnavn har samme værdi som feltet webnavn i klub registret. Brugervejledning CMS system version 0208 Side 4 af 22

3 Opret en side Nu skal den første side oprettes. Klik i menuen i venstre side på sider. Herefter fremkommer to menupunkter yderligere. Oversigt der viser de sider der er oprettet og Opret ny side, der giver mulighed for at lave en ny side. Klik på Opret ny side. I feltet Beskrivelse indtaster du en beskrivelse af siden, så du kan genkende den, når du skal tilknytte siden til et menupunkt. I feltet Skabelon kan du evt. vælge en præ-formateret og udfyldt side. Er den side du laver, forsiden, skal du klikke i den lille firkant lige over ikonet Gem knappen, hvorefter der kommer et flueben. Dette fortæller systemet, at du ønsker at bruge denne side som forside. Du kan kun have én side markeret som forside. Hvis du senere vælger en anden side som forside, slettes dit tidligere valg. Har du ikke valgt nogen forside vil forsiden vises tom. Brugervejledning CMS system version 0208 Side 5 af 22

4 Opret et menupunkt Klik på menupunktet Menu. Der kommer nu to undermenuer. Klik på Opret nyt menupunkt. I feltet Navn indtaster du et navn til menupunktet. OBS: Skal være kort et enkelt ord. I feltet Menupunkt under vælger du, hvor dette menupunkt skal placeres i den menu, der vises i browseren. Systemet har kun to niveauer. F.eks. hovedmenupunkt Aktiviteter med undermenupunkter Pølsevogn, Juletræer, osv. Til sidst vælger du hvilken side, der skal være tilknyttet dette menupunkt. Hvis menupunktet skal pege på en ekstern side skal du i stedet skrive URL adressen ind i feltet Ekstern side. Klik herefter på ikonet Gem og menupunktet er oprettet og vil blive vist på siden. Brugervejledning CMS system version 0208 Side 6 af 22

I ovennævnte eksempel er der oprettet to menupunkter. Til venstre for menupunktets navn er der vist forskellige ikoner for de to menupunkter. Betyder at menupunktet er de-aktiveret (vises ikke på hjemmesiden). Betyder at menupunktet er aktiveret (vises på hjemmesiden). For at få menupunktet aktiveret eller de-aktiveret, klikkes på ikonet ud for det aktuelle menupunkt. I kolonnen Position er det muligt at ændre på rækkefølgen på menupunkterne ved at: flytte menupunktet op ved at klikke på ikonet flytte menupunktet ned ved at klikke på ikonet OBS: Menuerne vises i den rækkefølge, de står opført her. NB! Der er problem i CMS system ligenu dette virker ikke helt korrekt prøv at klikke på nedenstående link hvis du ikke kan flytte menu punkterne vi arbejder på sagen prøv igen senere. I kolonnen Funktioner er det muligt at: slette et menupunkt ved at klikke på ikonet ændre et menupunkt ved at klikke på ikonet OBS: Siden som menupunktet er tilknyttet forsvinder ikke, når du sletter et menupunkt. Brugervejledning CMS system version 0208 Side 7 af 22

5 Opret en nyhed I systemet er det muligt at lægge klubnyheder ind i venstre side af hjemmesiden. Klik på menupunktet Nyheder. Der kommer nu to undermenuer: Klik på Opret nyhed. Datoen sættes automatisk til dags dato, men det er muligt at ændre den. Nyhederne vises i dato orden. I felterne Vis nyhed i tidsrum kan du indsætte fra og til datoer. På den måde kan du indtaste en nyhed før den skal vises hhv. få den fjernet når den er uaktuel. I feltet Overskrift indtaster du overskriften på nyheden. OBS: Bør være kort. I feltet Resumé indtaster du en kort teaser. OBS: Bør være en appetitvækker. Klik herefter på ikonet Gem og nyhedspunktet er oprettet og vil blive vist på siden. Selve skallen for nyheden er nu oprettet og du skal nu indtaste selve nyheden. Brugervejledning CMS system version 0208 Side 8 af 22

Selve nyheden indtaster du ved at klikke på ret ikonet retter en side. - på samme måde som når du Nyheden bliver først aktiv når du klikker på Nu vil oversigten se således ud: OBS: Selve nyheden skal indtastes før den aktiveres. Hvis du vil ændre de basale informationer om nyheden klikker du på Eksempel på nyhed som den kommer til at se ud på hjemmesiden: Brugervejledning CMS system version 0208 Side 9 af 22

6 Side redigering (editor) Editoren benyttes til at ændre den tekst, der står på en side. Den fungerer stort set som Word. Når du ændrer en side (eller nyhed) åbnes et nyt vindue med editoren: 6.1 De forskellige ikoner I toppen af editoren findes der en række ikoner. Hvis du ikke kan huske hvad et ikon benyttes til, så flyt musen hen over ikonet, hvorefter der fremkommer en hjælpetekst. 6.1.1 Gode råd om redigering Dette afsnit indeholder nogle gode råd til hvordan du oplever en lettelse i dit arbejde med KlubCMS. Dette skal ikke læses, som om det er den eneste måde, at redigerer en side på, men som en hjælpe på vejen. Siden vil blive opdateret jævnligt. Brugervejledning CMS system version 0208 Side 10 af 22

A: Start med at oprette en tabel, der indeholder det antal felter du regner med siden skal opretter i, f.eks. 3 afsnit Overskrift Tekstindhold og fodnoter mm. Dette eksempel indholder 6 felter, for at kunne styre start tekster og billede prøv dig frem. Du kan tilføje ekstra kolonner og rækker på et senere tidspunkt. Indstillinger i eksemplet: Kolonner: 1 Rækker: 6 Bredde: 520 prøv dig frem, så du er sikker på at bredden ikke bliver større end hjemmesiden. Talbellen giver dig en nemmere styring af siden og tekst indstilling God fornøjelse. B:Klippe / Kopierer fra andre tekst editorer Word, Wordblok, Notesblok o.a. Det er en god ide, at vælge en editor, der ikke indeholder automatisk tekst opsætning og faste fontstørrelser m.m. Vælg altid Notesblok i Windows (XP Alle programmer tilbehør Notesblok Du kan godt skrive eller lave Layout i Word, så du har et overblik, over hvordan siden kommer til at se ud derefter mærkere du teksten i Word sætter den ind i Notesblok dette fjerner alle automatiske koder m.m. herefter mærkere du teksten igen i Noteblokes kopierer/klipper og sætter teksten ind i KlubCMS. Du kan bruge de forskellige klippeblokke Normal indsæt Indsæt ren tekst eller hvis du er nødt til at kopiere fra Word Indsæt Word Brugervejledning CMS system version 0208 Side 11 af 22

Nu kan du tilrette font, type, format m.m. via Menuen: Overskrift lilleoverskrift og almtekst Her kan sætte størrelsen og typen af tekst Prøv dig frem... God fornøjelse. Gem siden når den er færdigredigeret Når en tekst er skrevet og billeder er indsat, klikkes på diskette ikonet, for at gemme siden. Brugervejledning CMS system version 0208 Side 12 af 22

6.2 Indsæt et billede Klik på billed ikonet for at indsætte et billede. Herefter fremkommer der en dialogboks, hvor du skal klikke på gennemse ikonet. OBS: Hvis du har et Pop-up blokerings program skal du slå det fra. 6.2.1 Vælg et billede der ligger i KlubCMS systemet Din klub har sin egen private mappe. I feltet Folder vælges hvilken mappe du vil søge i. I har ikke adgang til andre klubbers mapper, men nogle udvalgte mapper af generel Lions interesse. Brugervejledning CMS system version 0208 Side 13 af 22

Det billede du ønsker at indsætte klikker du på. Herefter kommer du tilbage til foregående billede, hvor du klikker på ikonet Indsæt. Nu er du tilbage i editoren og kan fortsætte med at redigere. 6.2.2 Vælg et billede der findes på din computer Hvis det billede du ønsker at indsætte på hjemmesiden findes på din computer, skal det først uploades til KlubCMS systemet. Det gør du ved at klikke du på ikonet Upload. OBS: Husk at vælge den Folder billedet skal uploades til. (Du kan kun uploade i din egen klubs folder) Herefter kommer upload vinduet frem. Klik på ikonet Gennemse hvorefter Windows Stifinderen kommer frem. Her vælger du det ønskede billede. Du kommer derefter tilbage til ovenstående vindue og klikker på ikonet Brugervejledning CMS system version 0208 Side 14 af 22

Upload. Herefter indsætter du billedet på samme måde som når det er i KlubCMS systemet. (se ovenfor) 6.3 Indsæt en reference (link) til en anden side Hvis du ønsker at linke til en intern side, skriver du først en link tekst. Denne tekst marker du og klikker på ikonet Link. Herefter kommer Link vinduet frem. I dropdown boksen Linkliste vælger du den side du vil linke til. Dernæst trykker du på knappen Indsæt 6.4 Lidt om linieskift Når du trykker på ENTER på tastaturet vil editoren lave et nyt afsnit, dvs. der kommer 2 liniers mellemrum. Hvis du ikke ønsker dette, men vil starte på linien lige neden under, holder du SHIFT nede og trykker på ENTER. Brugervejledning CMS system version 0208 Side 15 af 22

6.5 Specielle koder Det er muligt at indsætte data automatisk dannes ud fra informationerne i LionsOffice. F.eks. hvem er i bestyrelsen. Specielle koder er omgivet af [ ], f.eks. [bestyrelse] De specielle koder udvides løbende. De nuværende er: (NB! Har du forslag til andre?) OBS: Koderne indsættes automatisk når du opretter en side og vælger en skabelon. Brugervejledning CMS system version 0208 Side 16 af 22

6.6 Tabeller Tabeller er en måde at opstille data i kolonner og rækker. Det fungerer i stil med Word tabeller. Dog er der ikke lige så mange muligheder som i Word (dette skyldes begrænsninger i den bagvedliggende HTML kode). Når du vil oprette en tabel placerer du musen hvor tabellen skal ind og klikker én gang, dernæst klikker du på ikonet Tabel Herefter kommer der et billede frem hvor du vælger antal kolonner og rækker. Og afslutter ved at klikke på Indsæt. En tabel eller en celle kan ændres ved at markere det ønskede og dernæst klikke på tabel ikonerne. Brugervejledning CMS system version 0208 Side 17 af 22

Appendix A. Om TinyMCE OBS: Dette appendix afspejler ikke fuldstændig vores CMS editor. Der vil derfor være forskelle i forhold til vores CMS system. Dog er de grundlæggende ting de samme da vores er bygget på toppen af TinyMCE. TinyMCE er et kompakt WYSIWYG editeringsmodul, der kan anvendes i browsere som MS Internet Explorer eller Mozilla. Modulet gør det muligt for dig at redigere HTML-indhold på en mere brugervenlig måde. Den er forsynet med de samme funktioner, som man finder i de fleste tekstbehandlingssystemer og skulle ikke være svær at anvende. 6.7 De mest almindelige knapper Herunder finder du en beskrivelse af de enkelte knapper. Brugervejledning CMS system version 0208 Side 18 af 22

6.8 Indsæt billeder Knappen "Indsæt billede" åbner et vindue, der ser ud som nedenfor. Her indskriver man ganske enkelt adressen på det billede, man vil linke til samt en billedbeskrivelse. Denne beskrivelse bliver derefter vist som den alternative tekstbeskrivelse af billedet. Feltbeskrivelser: Image URL Adressen på eller stien til billedet. Image description Alternativ tekstbeskrivelse af billedet. Dimentions Alignment Border VSpace HSpace Billedets bredde / højde. Billedets justering - brugbar når der skal sættes tekst på plads omkring et billede. Ramme bredde. Vertikal margen - brugbart når billedet skal placeres i en tekst. Horisontal margen - brugbart når billedet skal placeres i en tekst. Her indskriver man ganske enkelt adressen på det billede, man vil linke til samt en billedbeskrivelse. Denne beskrivelse bliver derefter vist som den alternative tekstbeskrivelse af billedet. Feltbeskrivelser: Image URL Adressen på eller stien til billedet. Image description Alternativ tekstbeskrivelse af billedet. Dimentions Alignment Border VSpace HSpace Billedets bredde / højde. Billedets justering - brugbar når der skal sættes tekst på plads omkring et billede. Ramme bredde. Vertikal margen - brugbart når billedet skal placeres i en tekst. Horisontal margen - brugbart når billedet skal placeres i en tekst. Brugervejledning CMS system version 0208 Side 19 af 22

6.9 Indsæt link Denne knap åbner et nyt vindue, som rummer linkfunktionen. Der er to felter i dette vindue. I det første skal man indskrive adressen på linket - i det andet det "target", som linket skal pege på - dvs. hvordan linket åbnes, når brugeren trykker på det. 6.10 Indsæt bogmærke Denne knap åbner et nyt vindue, som rummer bogmærkefunktionen. Der er kun et enkelt felt i dette vindue - i det skriver du navnet på dit bogmærke. Husk at to bogmærker ikke kan hedde det samme. Brugervejledning CMS system version 0208 Side 20 af 22

6.11 Indsæt tabel Trykker man på indsæt tabel knappen åbnes det vindue, som du kan se herunder. I dette vindue kan du oprette nye tabeller. Feltbeskrivelser: Kolonner Rækker Cellemargin Indvendig margin Justering Kant Bredde Højde Klasse Antal kolonner i tabellen. Antal rækker i tabellen. Tabellens cellemargin. Indvendig margin i cellerne. Tabellens justering. Kantbredden i tabellen. Tabellens bredde i pixels. Tabellens højde i pixels. Style eller stylesheet klasse for tabellen. Brugervejledning CMS system version 0208 Side 21 af 22

6.12 Skabe tilgængeligt indhold TinyMCE kan producere HTML, der vil være tilgængeligt for alle brugere, også dem med handicaps, som anvender forskellige hjælpeteknikker. Den kan også skabe indhold, der er tilgængeligt for brugere, som anvender tekstbaserede browsere eller dem, der browser uden at vise billederne frem på siderne. Ting du selv kan gøre, for at gøre dine tekste tilgængelige: 1. Lav en billedbeskrivelse: Blinde brugere eller andre, som ikke er i stand til at se billeder, er helt afhængige af billedbeskrivelsen eller alt-teksten, som erstatter selve billedet. Hvis et billede ingen betydning har - dvs. hvis det blot fungerer som dekoration eller som et blankt område, så lad billedbeskrivelsen stå tom. Så vil TinyMCE indsætte et tomt alt-felt, der vil tvinge hjælpeprogrammerne til at ignorere billedet. 2. Tilføj udstrækning til en tabels overskriftsceller: I den dialog, som gør det muligt at styre en tabels attributter, bør man angive en overskrifts udstrækning. Det vil fungere sådan, at overskriften automatisk knyttes til alle værdier i tabellen, hvilket gør det nemmere for blinde brugere at forstå, hvad indholdet i den enkelte celle betyder. 3. Strukturer indholdet med fornuftige overskrifter: Vælg standardformaterede overskrifter (som f. eks. H1-6) for at lave overskrifter til dit indhold - går det i stedet for at lave dine egne standarder. Blinde brugere anvender en læser, der kan genkende disse standardformater og på den måde lave en indholdsfortegnelse over siden. På den måde kan en blind bruger lettere bevæge sig rundt på siden og springe fra afsnit til afsnit. 4. Husk at lave alternativt indhold: Lav en alternativ side der repræsenterer ikke- HTML-formateret indhold - så som Flash, Java applets eller indlejrede videosekvenser. Denne kan laves som et stykke statisk grafik kombineret med en beskrivelse af billedet og en beskrivelse af det indhold, som ville være dukket op, hvis man havde set siden på normal vis. En alternativ HTML-side kan også laves, hvorefter man så kan lægge et link på til den ved siden af Falsh-referencen eller referencen til Java appletten. På denne måde sikrer du, at indholdet også er tilgængeligt for folk, som bruger hjælpeteknologier, som ikke er i stand til at vise eller afvikle dit indhold eller som mangler den relevante player eller plugin. Kontroller tilgængeligheden: Når AChecker plugin'en er installeret sammen med TinyMCE, kan du blot trykke på den relevante knap for at blive adviseret om mulige tilgængelighedsproblemer. Besøg ACheckers hjemmeside http://checker.atrc.utoronto.ca/ for at se yderligere informationer om, hvordan man skaber indhold, som alle brugere kan tilgå. Brugervejledning CMS system version 0208 Side 22 af 22