Teknisk informasjon 4. Logge inn 7. Forskjell på sider og artikler 8. Struktur for sidene 10. Legge inn artikkel 17. Bilder 20

Transkript

1

2 1 Generelt Teknisk informasjon 4 Logge inn 7 Forskjell på sider og artikler 8 2 Sider 2.1 Struktur for sidene 10 3 Artikler Legge inn artikkel 17 Bilder 20 Kategorier styrer layouten 23 4 Verktøy og innstillinger Hva er verktøy og innstillinger? 25 Tabellverktøy 27 Lage en tabell 28 Sette inn link i tabell 31 Sette en tabell inn i en artikkel 34 Legge inn løype og høydekurve 36

3 - 3 Generelt

4 Teknisk informasjon Hva nettsiden bygger på av teknologi. Publiseringsløsning Nettsiden er basert på den til enhver tid nyeste versjon av Wordpress. I mai 2012 vil det si versjon 3.3.2, som denne veiledningen baserer seg på. Versjon 3.4 er snart ferdig, og kan ta med seg visse endringer i layout osv. Prinsippet er dog gjerne det samme, så brukerveiledningen vil ikke oppdateres kontinuerlig før det er såpass store avvik at det blir vanskelig å forstå. Du vil altså kunne oppleve at denne veiledningen og nettsiden ser litt forskjellig ut. Du vil alltid finne oppdatert supportinformasjon på Tema for siden Nettsiden baserer seg på proversjonen av BranfordMagazine fra DerPrinz, en tysk utvikler av temaer. I mai 2012 har vi versjon av dette temaet. Det kommer ikke like hyppige oppdateringer av temaet som av Wordpress, og det er en mer omfattende jobb å legge inn ny versjon. Det vil - 4

5 derfor være sjeldnere oppdateringer av temaet enn det er av nettsiden. For oppsett av siden er det gode hjelpesider på Webhotell Vårt webhotell er plassert hos domeneshop.no. Vi eier 2 domener: ubcup.no og united-bakeriescup.no Begge domener eies av Oslo Terrengsykkelklubb og har Jon Gravdal som juridisk kontakt og Ørnulf Pedersen som betalingskontakt. De håndteres fra min konto hos domeneshop.no. Webhotellet er knyttet til ubcup.no. united-bakeriescup.no rutes til ubcup.no. Det samme gjelder Nissancup.no. Nissancup.no eies av mitt firma siden vi ikke hadde organisasjonsnummer dengang dette ble opprettet. Jeg overfører det domenet til Oslo Terrengsykkelcup når det nærmer seg fornyelse, som skjer (Overføring medfører ny faktura, og det er ikke nødvendig før vi skal fornye) Dersom det er behov for FTP-tilgang til webhotellet så kan dette fås fra meg. For å komme til de gamle nissancup-sidene må man benytte adressen Administratorrettigheter til Vi har pr i dag 4 med administratorrettigheter til nettsiden, dvs tilgang til "alt", oppsett, nye brukere osv. Dersom noen mener det er vesentlige mangler i brukeroppsettet så gi meg beskjed. Disse 4 er: - 5

6 Meg; Bjørn Birkeland, Morten Holo, Ståle Berg, Rune Meisingset, Redaktørrettigheter innehas pr i dag av: Svein Aalrust, saalrust@online.no Jon Gravdal, jon.gravdal@zid.no Per Langseth, per.langseth@skrye.no Rune Moseby, runar.moseby@statnett.no - 6

7 Logge inn Logge inn gjør du ved å gå til Legg inn brukernavn og passord - 7

8 Forskjell på sider og artikler Sider og artikler er to forskjellige ting. En side er tekst som er ment å være statisk og vare lenge, mens artikler er mer dynamisk. Sider For ubcup.no er sider brukt til løypebeskrivelser, arenabeskrivelser, reglement osv. Sidene er knyttet til menyer og bygger opp menylinjen på forsiden. Sider knyttet mot forskjellige typer layout avhengig av hva som er hensiktsmessig for den siden. Artikler For ubcup.no er artikler det som definerer forsiden på siden. Forsidens layot styres ved å knytte ariklene til kategorier

9 - 9 Sider

10 Struktur for sidene Prinsipp for sidene Arena og løypebeskrivelse For å etablere en løypebeskrivelse lager vi 4 sider, en foreldreside og 3 barn. Hovedsiden heter "dato - arenanavn" og kan redigeres år for år. Hver arenaside har underliggende løypesider knyttet til seg, en for hver løypelengde, totalt 3 er normalt i Navn på løyper: Kort løype Middels lang løype

11 lang løype Disse sidene knyttes til menylinjen ved å bruke menyverktøyet du finner under utseende. Nødvendige filer for sidene knyttet til en arena med løypebeskrivelser For å bygge opp siden trenger vi: Excel-ark/CSV-fil med starttider. GPX-filer med høydekurver i utm-8 koding (som er std) Tilleggsinformasjon Bilde av arenaen Visning av hierarki for sider Her ser du hvordan sidene vises når de legges inn med ovenstående hierarki. Streken "." foran angir nivået for hiearkiet. Ingen strek sier toppnivå, en strek nivå 1, to streker nivå 2. Du finner denne oversikten under "Kontrollpanel - Sider - Alle sider"

12 Arenaside For å legge til ny side bruker du valget "sider" og legg til ny. For Arenasider bruker vi følgende Sideattributter: 1. Forelder: Ritt 2. Mal: Featured page 3. Sortering - det som er riktig for sortering under "Ritt", dvs fra 1-9- Under selve tekstediteringen finner du "tilpassede felt". Disse bruker vi i featured page-malen. Tilpassete felt featured page For arenasiden bruker vi tre tilpassete felt som er statiske. featuredpageheadline featuredpagepic featuredpagetext Bildet må lastes inn på en ftp-server og du må ha tilgang til url-en som du limer inn. Bildet skaleres ikke, og må være (bxh) 300 x 200 px

13 Oppdeling av en featured page 1. Featuredpagepic - følger mal 2. Featuredpageheadline - følger mal 3. Featuredpagetext - følger mal 4. Widget - settes fra "utseende - widgets - featured page top right" 5. Overskrift og tekst fra editor 6. Widget - settes fra "utseende - widgets - featured page text widgets" 7. Arenakart satt inn fra editor. Ang lenker satt til høyre i featured page text widgets så legges disse inn under menyvalget "lenker" som ligger på kontrollpanelet

14 Ny side for løypebeskrivelse Løypebeskrivelser: 1. Forelder er arenaside 2. Bruker vi standardmal. 3. Rekkefølge angir hvordan undersidene sorteres under foreldresiden. Jeg har sortert, "kort løype 1", "middels løype 2", "lang løype 3"

15 Side for løypebeskrivelse - ferdig 1. Tekst fra editor 2. Widget - satt inn fra "utseende - widgeter - regular sidebar" (deles med forsiden) 3. Resultat av WP GPX maps

16 Artikler

17 Legge inn artikkel Hvordan legge inn artikkel Kontrollpanel Det første du kommer til etter å ha logget inn er kontrollpanelet. Ny artikkel For å legge til artikler: 1. Innlegg 2. Legg til nytt

18 Skrive innlegg Det er spesielt fire ting som er viktig når du skal lage en artikkel: 1. Overskrift 2. Bildefil 3. Tekst 4. Kategori Overskrift og tekst er "ganske innlysende", men jeg forklarer om bilder og kategori i egne avsnitt. Trykk lagre når du er ferdig

19 Overskrift Forsøk å lage overskriftene moderat lange. Det ser bedre ut på forsiden. 4-5 ord er ofte nok

20 Bilder Vi må ha bilder med i en artikkel. Her er hvordan du legger inn bilder. Bilder Bilder legger seg på forsiden, tilpasser seg der artikkelen skal ligge og gjør forsiden mer levende. Alle artikler må derfor ha en illustrasjon i form av et bilde, en logo, et kart e.l. i form av en jpg eller png-fil. Å legge inn et bilde er enkelt. Plasser tekstmarkøren før all tekst og velg "Last opp/sett inn"

21 Filopplasteren Når du trykker på last opp får du denne dialogboksen Bare trekk filen over "slipp filer her"

22 Billedinformasjon Billedbehandleren 1. Tittel er som regel billedfilens navn 2. Alternativ tekst: Vises i nettlesere som ikke kan vise bildet. Bruk gjerne tittel på bildet. 3. Billedtekst er teksten som dukker opp under bildet. Kan være f.eks foto: navn på fotograf eller hvor bildet er tatt, hvem som er på e.l. 4. Beskrivelse: Dette er for internt bruk. Frivillig å bruke 5. Stille opp: Velg venstre. 6. Størrelse: Avhenger av hvor stor fil du har lastet opp. Bilder bør ha oppløsning mellom 300 og 1000 pixler i bredden. Programmet skalerer ned til behov, så vi trenger ikke å dra for store filer ut til brukeren. 7. Når du er ferdig: Trykk "sett inn i innlegg"

23 Kategorier styrer layouten Bruk av kategorier i layouten Kategorier styrer layouten Kategoriene styrer layouten på forsiden. Kategorien "hovedoppslag" viser artikler der jeg har markert hovedoppslag. Nyheter kommer på venstre side og Alt annet vil vises i midten. Valg av kategorier Kategorier finner du på høyre side når du skriver en artikkel. Her finner du de til enhver tid aktive kategoriene. De endres sjelden

24 Verktøy og innstillinger

25 Hva er verktøy og innstillinger? Verktøy og innstillinger er hjelpemidler for å putte ting inn i sider og artikler. 1. Vi bruker et verktøy for tabeller og moduler som legger seg under innstillinger for å lage kart. 2. Vi har to kartmoduler. Den ene er mer elegang enn den andre, men for øyeblikket virker ikke den jeg liker best så godt, så inntil det er løst bruker vi to. 3. Vi bruker også en innstilling som heter wptouch for å tilpasse siden til smarttelefoner. Denne går jeg ikke gjennom her, bare nevner at den finnes. Tabellverktøy Du finner tabellverktøyet under verktøy

26 Innstillinger for kart Du finner kartverktøyet for kartvisning og kurver under innstillinger. Det andre verktøyet bruker vi for arena. Det finner du under artikkeleditoren

27 Tabellverktøy For å lage tabeller bruker vi tabellverktøyet Tabellverktøy Du finner tabellverktøyet ved å gå inn på "Verktøy" og "WP-table Reloaded". Dette verktøyet lager gjenbrukbare tabeller som kan importeres fra en CSV-fil. Fordelen med dette er at du kan bruke samme tabell i alle artikler om et tema, og dersom det er endringer så skjer endringen over alt. Du har altså ett sted å oppdatere tabellinformasjon, og oppdaterer over alt

28 Lage en tabell Gå til tabellverktøyet Du finner det under verktøy - wp-table reloaded. 1. Verktøy for å lage nye tabeller 2. Eksisterende tabeller Importer csv-fil Den enkleste måten å etablere eller redigere en tabell på er å lage det i Excel, eksportere til en csv (kommadelt fil) og importere denne til tabellverktøyet. Når du er i verktøyet velger du "import table" Importverktøyet 1. Velg input. Det enkleste er en csv, men du kan også hente inn en tabell som ligger på en annen nettside. 2. Legg til eller erstatt en tabell? Her velger du om du skal lage ny tabell eller om du skal

29 erstatte en eksistrende. Velger du å erstatte så vil du få en liste over eksistrende tabeller og du velger den du skal erstatte. 3. Her velger du om du skal laste opp en fil eller om du har andre metoder, f.eks hente fra en annen nettside. Mest vanlig er å laste opp en tabell. 4. Velg fil på din maskin. Trykk på "velg fil" for å velge din lokale fil. Må være laget som en csv fil i et tekstformat. Pass på at ikke exel lager mange ekstra ";". Disse vil synes som ekstremt mange unødige kolonner eller linjer. Du kan åpne filen i en teksteditor før du importerer og fjerne disse i forkant. Det enkleste er å bruke søk/erstatt og søke etter ;; og erstatte med ; nok ganger til at du bare har en og en ; Tabellinformasjon Her legger du tittel og tabellinformasjon du vil ha med på nettsiden vedr tabellen. Kan være lenger enn dette

30 Utseende for tabellen Huk av slik som du ser her. Det gir et likt visuelt inntrykk. Du finner mer informasjon under denne tabellen, men det bruker ikke vi. Det under aktiveres med å velge "use JavaScript library". Ta vekk hake her. Verktøy for tabellutseende Her kan du velge verktøy for å justere på tabellenes utseende. Du kan slå sammen celler, legge til rader, legge til kolonner, sortere tabell osv. Husk å oppdatere alt du gjør Husk å lagre for hver ting du gjør. 1. Når du bare endrer på tabellen så velger du "update changes". 2. Når du er ferdig: Save and go back

31 Sette inn link i tabell For å legge inn link til en side i en celle Finn adressen du skal linke til Kopier adressen fra adressefeltet Verktøy for å legge inn link Velg insert link

32 Dialogboks for link Her kopierer du inn linken du skal sende folk til. Trykk "ok" når du er ferdig Beskrivende tekst Skriv inn tekst man skal klikke på Ferdig kode Trykk windows:ctrl-c eller mac: cmd-c for å kopiere ut teksten. Første celle du klikker i får denne teksten dyttet inn i cellen. Vi skal ha mange like celler, så det er gunstig å bare kunne kopiere inn teksten

33 Kopier inn teksten i "løypecelle" Kopier inn teksten i celle for løype. Husk å lage ny tekst for hver løypetype

34 Sette en tabell inn i en artikkel Sette en tabell inn i en artikkel Gå til verktøyet WP-table reloaded. Hold muspekeren over tabellen du ønsker å bruke. Trykk på shortcode Shortcode Du får opp denne dialogboksen. Kopier denne teksten "[table id=6 /] (eller den teksten du får opp). Legge tabell i artikkel eller side Tabellen kan du legge inn i en artikkel eller side mens du skriver den eller etterpå. Side og artikkel legges inn på samme måten. Når du er i artikkeleditoren:

35 1. Velg visuell 2. kopier inn "shortcode" der du vil at artikkelen skal vises. Ferdig resultat Koden [table id=5 /] gir deg dette resultatet gitt at du har innstillingene beskrevet tidligere

36 Legge inn løype og høydekurve For å legge inn kart og høydekurver i en side eller en artikkel. Forberedelser: Du må ha tilgang på gpx-filene du trenger lagret på din egen maskin. Gi filene navn uten mellomrom, f.eks LangsetLokkaKort.gpx eller Langsetlokka_kort.gpx Dersom du får vansker med å vise filen må du sjekke at den er UTM-8 kodet. (Det er standard, så om du ikke skjønner hva jeg skriver her så ikke bry det om det.) Gå til WP GPX Maps Du finner det under innstillinger. Verktøyet viser fortløpende tidligere innlastete filer

37 Last opp gpx-fil 1. Velg "Tracks" (standardvalget) 2. Trykk på velg fil Dialogboks for filvalg Velg ønsket gpx-fil. Du kan navigere deg rundt på maskinen. Kopier shortcode Kopier short code ved å trykke ctrl/cmd c (avhengig av operativsystem du bruker) Feilkilde: Denne kan noen ganger bli feil, dvs at du får med mer kode enn du skal. Dersom du er i visuell modus når du limer inn kan du få med overskytende kode når du limer inn. Lim inn i html, eller gå til html etter å ha limt inn og fjern overskytende koder

38 Kode for en artikkel med kart og høydekurve En artikkel ser sånn ut i visuell visning. Her ligger det også en link til siden som viser arenainformasjon for Gullhaug. Samme artikkel i html Her ser du lik artikkel i html-visning. Her ligger det også en link til siden som viser arenainformasjon for Gullhaug

39 Artikkel med for mye kode Her ser du koden som kan bli med ved å kopiere ut short code direkte og legge inn i visuell. Legger du den inn i HTML-visning kommer ikke koden med. Fjern evnt all kode fra og med &nbsp: og ta alt som ikke er [sgpx osv til neste] Fjern også koden </td> og under til </table>

40 Ferdig resultat Ovenstående kode gir deg denne siden