Brukerkurs 16.februar 2012

Størrelse: px

Begynne med side:

Download "www.lakselvdal.no Brukerkurs 16.februar 2012"

Ellinor Aasen
9 år siden
Visninger:

1 Brukerkurs 16.februar 2012

2 Kort introduksjon til world wide web og struktur der. Forskjellige måter å lage seg en hjemmeside på. Hvordan vi i Lakselvdal gjør det. Og viktigst av alt, utdanne flere til å kunne bruke og vedlikeholde siden vår

3 World Wide Web...

4 World wide web inneholder millioner av forskjellige sider, type lakselvdal.no, dagladet.no osv Felles for alle sidene er at de trenger lagringsplass. Lagringen foregår typisk på såkalte FTPservere. En plass der vi kan lagre og offentliggjøre informasjon vi vil dele med andre

6 Alle kan kjøpe seg plass på nettet gjennom såkalte web hotell. Web hotell gir deg tilgang på en ftp-server der du i praksis kan opprette så mange sider du ønsker. For å offentliggjøre en hjemmeside må du i tillegg skaffe deg et domenenavn, feks. Olereidar.com, itromso.no osv

7 Ole-Reidar sin ftp konto gir husvære til to hjemmesider: Dette pga av at Ole-Reidar har kjøpt rettighetene til begge domenenavnene.

8 Innhold på en hjemmeside - Finnes primært to metoder å lage en side på: - Hardcoding (sitte og skrive inn kode og tekst manuelt) - CSM (Content system management)

9 Eksempel på hardcoding (tatt fra <html><head><title>kalott 2009</title> <meta http-equiv="content-type" content="text/html; charset=iso "> <link rel="stylesheet" href="css/styles.css" type="text/css"></head> <body leftmargin="0" topmargin="0" style="background-color: rgb(153, 153, 153);" marginheight="0" marginwidth="0"><h2></h2> <table align="center" border="0" cellpadding="0" cellspacing="0" width="780"> <tbody> <tr> <td style="padding-left: 25px; text-align: center;" class="logo" bgcolor="#5678bb" height="75"> <h1>kalott 2009</h1> <h3>tromsø Septhember 5th and 6th</h3> </td> </tr> </tbody> </table> <table align="center" border="0" cellpadding="0" cellspacing="0" width="780"> <tbody> <tr> <td bgcolor="#cccccc" height="250" valign="top" width="160"><br> <div style="text-align: center;"> <h3> <a href="

10 Hardcoding er vanskelig, krevende og lite brukervennlig. Terskelen for bruker blir stor. Lakselvdal.no er derfor bygd opp med et såkalt CSM, et Content System Managment som lager et oversiktlig og brukervennlig grensesnitt for den som skal redigere siden. Populært kalles dette What You See is What You Get...WYSIWYG

11 Lakselvdal skytterlag har gjort følgende ting for å komme seg på nett. 1) Skaffet seg plass på nettet, gjennom å leie seg plass på en FTP-server. 2) Skaffet seg rettighet til å bruke domenenavnet lakselvdal.no 3) På FTP server, lastet opp et CSM program som kalles Wordpress, som gjør drift og vedlikehold av siden enkel for brukeren.

12 Litt om CSM programmet Wordpress - Verdens mest brukte CMS - Gratis - Rimelig stabilt (er av og til noen små ting som krangler litt...men heldigvis sjelden) - Enkel å bruke - Nye applikasjoner dukker opp hver dag og kan tilføyes dersom det er interesse for det - En kryssning mellom WYSIWYG og koding

13 Vi skal nå lære å: - Opprette en bruker - Skrive en artikkel og offentligjøre denne - Legge til et bilde i artikkelen - Redigere artikkelen - Se litt på sidepanelene og mulighetene der

15 Etter log in ser vi dashbordet for siden vår

16 Opprette en ny sak på hjemmesiden, gå til Posts og trykk på Add new

17 Denne skjermen dukker opp, nå er det bare å begynne. Skriv først tittel på saken, fortsett så i vindu under med saken.

19 Sette inn et bilde i saken Legg merke til de fire små knappene på siden av Upload/Insert Fra venstre mot høyre: Legg til bilde, Video, Musikk, Mediafil (feks resultatlister, oppropslister etc

20 Trykk på bildeknappen (hvis du holder muspekeren over knappen vil det stå add an image på et lite skilt som dukker opp) Trykk på Select Files knappen

21 En ny boks vil dukke opp: Velg korrekt fil (martha.jpg i dette tilfellet) og dobbelklikk på filnavnet

22 Dette dukker opp, noen justeringer trengs:

23 Legg merke til forandringen på tekstfeltene Alternate text, Caption og Description. Samme tekst er fylt inn i alle feltene Trykk ellers på Center knappen Velg Medium Og trykk Insert into post

24 Laste opp dokumenter som resultatlister, etc (word dokumenter, pdf dokumenter osv) Trykk på mediaknappen til høyre Denne skjermen dukker opp

25 Velg så fila du ønsker å laste opp, dobbelklikk og en ny skjerm dukker opp Husk å trykke Insert into post

26 Og dokumentet havner så på saken vi skriver på

Legge til en link i en sak versjon 1: For den enkle metoden, skriv www.tromso.skytterlag.

27 Legge til en link i en sak versjon 1: For den enkle metoden, skriv blir automatisk til en link Dersom man ønsker å åpne denne linken i et nytt vindu, markerer man teksten til linken og så trykke på symbolet for å legge til en link, det ser ut som en kjetting: Så dukker denne opp

28 PåURL fyller man inn ønsket adresse, enklest er det å kopiere adressen på siden du vil linke til og lime inn. På Title kan man skrive inn en tekst, feks her, Tromsø skytterlag eller andre ting man ønsker at linken skal se ut som, husk å kryss av for Open in a new window dersom man ønsker å åpne saken i et nytt vindu. Så ser det sånn her ut til slutt:

29 Når saken er ferdigskrevet, trykk på Publishknappen på høyre side.

30 Redigere tidligere poster, eller den du nettopp har publisert: Trykk på saken du ønsker å redigere, og saken vil dukke opp igjen. Rediger i vei og trykk updateknappen på høyre side.

31 Husk å trykke Update

32 Redigere lakselvdal.no sine undersider, som Linker, Om oss, Pokaler osv: Trykk på Pagesknappen på dashbordet:

33 Denne siden viser seg:

34 Trykk på ønsket side, feks pokaler. Samme type side som vi allerede er vant til fra tidligere dukker opp. Rediger på samme måte som før. Ønsker man å laste opp dokumenter, som feks lister med pokalvinnere, så gjøres dette på samme måte som i en helt vanlig sak på lakselvdal.no

35 Sidebarene Sidebar 1 sidebar 2

36 Sidebarene er en krysning av WYSIWYG og bruk av koder. Ren tekst er lett Innsetting av bilde, sponsorlogo er vanskelig og krever inngående kjennskap til bruk av ftp og html språk Innsetting av linker er litt krevende, men overkommelig vha litt kjennskap til html koding, evt html tips man kan finne på nett.

37 Redigere en eksisterende boks På dashbordet, gå til Appearance og trykk på denne En ny meny synes nå, velg Widgets og trykk på denne

38 Et helt nytt vindu kommer opp, legg merke til boksene helt til høyre, sidebar 1, sidebar 2 osv

39 Trykk på feks utleie av banen, og fyll inn datoer der banen er utleid. I dette eksemplet skriver jeg bare test1, test 2 osv Husk å hake av Automatically add paragraphs og trykk Save når du er i mål

40 Opprette en ny tekstboks Legg merke til alle de små boksene midt på siden, med Custom menu, Links, Meta osv Her finner vi også en boks som heter Text, denne skal vi jobbe videre med.

41 Før musa over Text og trykk ned venstre knapp, hold inne og dra Text bort til den sidebaren du vil ha en ny textboks på. Man kan plassere boksen hvor man vil på sidebaren, øverst, eller innimellom andre saker. Fyll inn tekst i Tittelfeltet og i feltet der man vil ha ut info. Vær obs på at overskriften ikke kan være for lang.

42 Opprette en link i en tekstboks

43 Bilde i en tekstboks

44 Andre ting vi vil lære?

Like dokumenter

Lage klubbens webside i Rotary med verktøyet Webwiz 2.0

Lage klubbens webside i Rotary med verktøyet Webwiz 2.0 Versjon 1.0 av DICO 2250 25.04.2011 Det å lage en webside uten å ha kjennskap til dette fra før, kan virke vanskelig, men ikke fortvil. Det går alltid