2013 Prosjektsider - Fylkesmannen Solfrid Helvik Fylkesmannen i Sogn og Fjordane 27.11.2013 1
Introduksjon Fylkesmannen nyttar i dag Episerver 7 på prosjektsider og intranettsider Malene er basert på det responsivt design, og dette betyr at innholdsvisningen tilpasses enheten og oppløsningen som brukes når området vises. Innholdet håndteres som komponenter via bruken av blokker eller sider som kan slippes i innholdsområder for tilpasset visning. Avhengig av tilgjengelig plass vises hele innholdet eller en del av det i 1/3, 2/3 eller full bredde. Områdestruktur prosjekt Alle prosjektsider ligger under Root. De ulike prosjektsidene er bygd opp forskjellig, men benytter seg av de samme sidemalene. Vi har følgende startsidemaler for prosjekt: Blue Orange (Under test) Sidetyper Vi har flere ulike sidetyper som blir brukt på prosjektsidene. Obs! Merk at noen sider ikke vil ha en visningsmal for forhåndsvisning fordi de bare brukes som containersider. conatainersider har et spesialsymbol i sidetrestrukturen, se Lenkecontainer for mer informasjon. Du kan heller ikke koble til en containerside. En ny prosjektside vil alltid ha en startside som toppnivå. 2
Prosjektsider Alle prosjektsider har en startside som toppnivå. Under denne kan en lage følgende sider: Startside Meny/Underside Nyhetsside Søkeside Container Meny/Underside Nyhetsartikkel Alle sidetyper unntatt startside Begrep som blir brukt i denne veilederen Sideegenskaper: Felter som vi fyller ut eller endrer. Dette kan være felt der vi skriver innhold, eller innstillinger på sidene Enkel redigering: Det første bilde vi får opp når vi har laget en ny side, eller går inn på en side for å redigere. I enkel redigering får vi blå felter rundt feltene vi kan redigere. Skjemaredigering: Her får vi opp flere sideegenskaper vi kan endre. Ligg alltid med dette symbolet oppe til høyre på sidene. Sideegenskaper kan redigeres både med Enkel redigering eller Skjemaredigering. Noen egenskaper vil imidlertid bare være tilgjengelig for redigering via Skjemaredigering. Flytt musepekeren over innholdsområdet for å finne ut hvilke egenskapene du kan redigere direkte på siden. I det følgende beskriver vi noen vanlige spesifikke funksjoner på eksempelsidetypene. Logg på Gå inn på siden du har fått tilsendt fra Fylkesmannen i Sogn og Fjordane. Nederst til venstre på siden, i bunnteksten finner du knapp for å logge på siden. Brukere som jobber hos Fylkesmannen logger på med samme brukernavn og passord som når en logger på pc en. Eksterne brukere får tilsendt brukernavn og passord. 3
Blue startside Prosjektinfo Navn du skriver inn vil bli navn på nettstedet. Prosjektnavn vil vise nede på sida Prosjekteier vil også vise flere steder Innhold Kategori Blir ikke brukt på prosjektsidene Hovedinnhold Her legger en inn nyhetslisten som skal vise på framsiden Antall artikler - Velg hvor mange artikler som skal vise på framsiden Blokk Her kan en legge inn blokker som skal vises til høyre på framsiden 4
Metadata Vær oppmerksom på at dersom ein legg til tekst i Tittel på metadatafeltet vil dette endre namnet i toppmenyen på sida. Header Header-logo: her legg ein inn logo til prosjektet. Om denne er tom vil ikkje logo vise. Header-bilde: her legg ein inn bakgrunnsbilete som ligg i headeren. Om denne er tom vil standardbilete vise. Det er ein stor fordel om logo og bilete blir lasta opp i png-format. Dette vil fungere betre med responsivt design. Kontakt Denne informasjonen vil vise nede til høyre i bunnteksten. 5
Innstillinger Her kan en endre dato for publisering, opprettet og endret. En kan også oppdatere endret dato om det er behov for det. Her velger en også hvordan nye undersider skal sorteres. Sorteringsindeks skal normalt ikke endres. Header og footer kan skjules for hele nettstedet her. Her setter en også inn lenke til søk. Dette blir normalt satt opp av FMSF ved leveranse. Utforming På utforming kan en endre tekstfarge på bunntekst, samt endre bakgrunnsfarge på bunntekst. Vær oppmerksom på at i noen versjoner av enkelte nettlesere viser ikke disse endringene. Meny/Underside Denne sidetypen blir brukt på element som skal ligge i menyer, enten i toppmeny eller i venstremenyen. Under dette nivået kan en bare lage Meny/Underside. Opprette ny Meny/Underside Stå på siden du vil lage ny underside under, klikk på symbolet på sida i menystrukturen og velg ny side. Skriv inn navn på siden, og klikk på sidetype Meny/underside. 6
Når en har valgt side vil en få opp siden med felter som er klar til redigering. En kan velge om en vil legge inn tekst og bilde direkte eller om en vil gjøre dette i redigeringsmodus (felt 4. under). 5. Klikk for å publisere siden 4. Gå til redigeringsmodus med flere valg 1. Klikk her for å sette inn bilde 2. Klikk her for å legge til ingress 3. Klikk her for å legge til hovedinnhold En må legge inn disse feltene: Tittel Bilde Ingress Innhold Denne sidetypen har også et felt til høyre hvor en kan legge de blokkene en ønsker. Les mer om blokker i kapittelet Blokktyper Nyhetsside En nyhetsside lager vi normalt en gang. For å opprette en nyhetsside står en på hovedsiden og velger ny side. Velg nyhetsside og gi den det navnet den skal ha, for eksempel «nyhet». Under denne sidetypen lager vi nyhetsartikler. 7
Opprette ny nyhetsside Når siden er opprettet kan en enten publisere den direkte, eller gå til redigeringsmodus for flere valg. Publisere Gå til redigeringsmodus for flere valg I redigeringsmodus kan en sette flere valg. På innhold kan en fjerne hake for visning i meny En kan også velge å endre tallet på artikler som skal vise i listen. 8
Under innstillinger velger en for eksempel hvordan sidene under skal sorteres. På nyheter anbefales det at den står sorter etter dato for publiseringsstart (nyeste først) I denne malen er det ingen påkrevde felter. Nyhetsartikkel Denne malen får en bare valgt under nyhetsside. Dette er en vanlig artikkel. Obligatoriske felter Tittel Ingress Innhold En kan legge tekst direkte i feltene som kommer opp, eller en kan gå til redigeringsmodus 9
Alt 1: Rediger på denne siden og publiser 2. Skriv tekst inn i feltet her Alt 2: Redigeringsmodus med flere valg 1. Klikk i felt for å legge til tekst 3. Klikk på ferdig når du har lagt inn tekst Også på denne malen kan en legge til blokker til høyre. Les mer om blokker i kapittelet Blokktyper Søkeside Introduksjon Sidetypen Søkeside har innebygde funksjoner hvor gjestene kan søke gjennom webområdet og bla gjennom listen med søkeresultater som vises. Søket er basert på søkemotoren tilgjengelig i EPiServer CMS. Presentasjonen av søkeresultatene filtreres basert på de ulike sidetypene og blokktypene brukt ved oppretting av innhold. Innholdsområde Hele midtdelen av søkesideinnholdsområdet brukes til søkefunksjonene og visningen av søkeresultater. 10
Container Container er ein skjult side som ein kan legge en eller flere sider under. Disse vil ikke være tilgjengelige i menystruktur Forhåndsvisning Visningen av innholdet vil tilpasses avhengig av enheten og oppløsningen som brukes til å vise innholdet. Å vise området med en mobilenhet vil for eksempel gjøre at menyområdet øverst blir en rullegardinknapp. I EPiServer CMS er det mulig å forhåndsvise en side ved bruk av ulike kanaler og oppløsninger. Dette gjør en ved å klikke på øyet oppe til venstre og mobilsymbolet. En kan da velge å se forhåndsvisning av siden på ulike medier. (Klikk på automatisk på begge valg for å gå tilbake til standard.) Sidetypene vil også har innebygde alternative gjengivelser som definerer nøyaktig hvordan innholdet skal skaleres og tilpasses for visningen av visningsområder med full, 1/3 eller 2/3 bredde. Avhengig av tilgjengelig plass gjengis deler av innholdet, for eksempel overskriften og første delen av hoveddelen. Innhold på sidene Den spesifikke egenskapene tilgjengelig under kategorien Innhold i Skjemaredigering, vil variere avhengig av sidetypen. For eksempel kan du ha en hovedtekstegenskap som har alle funksjonene i EPiServer CMS-redigeringsprogrammet. Du kan også ha et innholdsområde hvor du kan slippe innholdsblokker eller andre sider. Metadata-informasjon Når du åpner siden i Skjemaredigering, har sidene en kategori Metadata. Det er hvor du legger til metadata-informasjonen som skal brukes for søkemotoroptimalisering når siden er indeksert og som skal vises i søkeresultater. Følgende Metadata-egenskaper er tilgjengelige: Tittel - legg til en visningstittel for siden. Nøkkelord - legg til en samling egnede nøkkelord som beskriver innholdet. Sidebeskrivelse - legg til en kort oppsummerende beskrivelse av innholdet. Deaktiver indeksering- når du velger dette alternativet, ekskluderes siden fra å bli indeksert av søkemotorer. Andre egenskaper Kategorier Kategorier blir ikke brukt på prosjektsidene 11
Skjule overskrift og bunntekst Kategorien Innstillinger inneholder egenskaper med funksjoner som er tilgjengelige for alle sidetyper. Noen av disse egenskapene er spesifikke for Alloy-eksempelmalene. Her vil du finne egenskapene Skjul header/footer. Hvis du velger disse alternativene for en side, skjules områdeoverskriften og bunnteksten som er definert på startsiden. Dette er nyttig hvis du ønsker å opprette en side uten overskrifts- og bunntekstinformasjonen. Planlegg publisering Enkelte ganger er det greitt å kunne opprette en artikkel eller side som skal publiseres om noen dager. Dette gjør du ved å klikke på publiserknappen og velge skjemalegg publisering. Du kan da sette dato og klokkelsett en ønsker å publisere. Arkivering av sider For å sette arkivering av en side må en gå til redigeringsmodus og klikke på verktøy. Du vil da kunne sette utløpsdato for siden og evt. Side den skal arkiveres til. 12
Blokktyper Introduksjon I EPiServer CMS kan du arbeide med blokker for å dele informasjonskomponenter på tvers av webområder. En blokk består av en samling av egenskaper, for eksempel et bilde og en tekstdel eller et sett med koblinger. Blokktyper likner på sidetyper. For å vise innholdet i en blokk må det tilordnes en mal for å gjengi sider. Blokker kan settes inn på et innholdsområde ved hjelp av dra og slippfunksjonen. Blokker kan også redigeres og omorganiseres på siden. Du kan videre organisere blokkene på siden i mapper og angi tilgangsrettigheter for blokkene. Slå opp i delen Bruk av delt innhold på en side for mer informasjon om hvordan du arbeider med blokker. Blokker opprettes på en liknende måte som når du oppretter sider. Dette betyr at du vil ha et sett med forhåndsdefinerte blokktyper å velge mellom, alle med deres spesifikke, innebygde funksjoner. Blokker kan redigeres med Enkel redigering eller Skjemaredigering, akkurat som sider. Imidlertid er ikke alle egenskapene tilgjengelige ved enkel redigering. Innhold Akkurat slik som med sidetyper vil forskjellige blokktyper har spesifikke egenskaper tilgjengelig under kategorien Innhold i Skjemaredigering. For eksempel kan du ha en hovedtekstegenskap som har alle funksjonene i EPiServer CMSredigeringsprogrammet. Gjengivelser Slik som det er for sidetyper, har blokkene innebygdt alternative gjengivelser som definerer nøyaktig hvordan innholdet skal skaleres og tilpasses for visning på for eksempel en mobilenhet med begrenset oppløsning og visningsplass. Ettersom blokker brukes til visning i innholdsområder på andre sider, har ikke blokker en egen mal for gjengivelse. I noen tilfeller kan du imidlertid forhåndsvise blokkvisningen når den brukes i forskjellige sammenhenger. 13
Ulike blokktyper på prosjektsidene I de følgende delene i denne dokumentasjonen vil vi beskrive funksjonene og de spesifikke egenskapene til blokktypene som er inkludert på eksempelområdet. Bruk disse eksempelblokkene som inspirasjon når du oppretter dine egne blokker. Du kan opprette delt innhold som blokker og sette dem inn på siden du redigerer. Blokkene kan brukes på en eller flere sider. Obs! En endring av en blokk påvirker alle sidene på webområdet hvor den brukes. Hvordan lage en blokk 1. Åpne biblioteket 2. Velg mappe du vil lage ny blokk under 3. Klikk på symbolet til høyre ved mappen og velg Ny blokk 4. Skriv navn på ny blokk og velg den blokktypen du vil bruke. De blokkene du har brukt tidligere vil komme opp som forslåtte blokktyper. Under andre blokktyper vil alle tilgjengelige blokktyper vise. 14
Hvordan legge en blokk inn på en side Opne biblioteket på den siden du vil legge en blokk inn på. Finn blokken du vil bruke på siden og dra den inn i feltet for blokker. Dette feltet vil bli uthevet med grønn stiplete linje når du frar blokken over) (Tips: klikk på pin for å feste biblioteket, da blir det lettere å dra blokken over til blokkfeltet) Kontakt Kontaktblokk er en blokk der du kan legge til en kontakt. Det kan være lurt å samle alle kontaktblokker i en mappe og gi blokken navner til den personen kontaktblokken er om. 15
Når du har valgt ny blokk vil du få opp bilde for enkel redigering av blokken. Den vil her forhåndsvise hvordan blokken ser ut i ulike bredder. Du må da gå til skjemaredigering ved å klikke på knappen, for å gjøre endringer Fyll ut informasjon i feltene. Navn, tittel, telefonnummer og e-post er obligatoriske felter. Telefontid og telenummer 2 er valgfrie felter. 16
Når du har fylt ut feltene kan du enten publisere eller klikke på knadden for skjemaredigering en gang til for å gå tilbake til forhåndsvisning. En blokk må alltid publiseres før den vil vise på siden du bruker den på. Alternativ visning På kontakt kan du velge alternativ visning for å endre utseende på blokken. Dette haker du av for i skjemaredigeringen. Vanlig visning gir kvit bakgrunn på overskrift og et lite personsymbol. Alternativ visning gir blå bakgrunn og v-symbol 17
Tekst Denne blokken brukes til å opprette en blokk hvor du kan legge til innhold ved å bruke EPiServer CMSredigeringsprogrammet. Du kan enten bruke alle funksjonene i redigeringsprogrammet ved å legge til bilder, koblinger, dynamisk innhold eller personlig tilpasset innhold. Eller du kan bare legge til en enkel tekst som skal kombineres med andre blokktyper ved visning. Intern lenke På Intern lenke legger du inn lenke til intern side og bilde. Blokka vil se slik ut når den er publisert. Lenke og tekst er da klikkbart. Ekstern lenke På Ekstern lenke legger du inn lenke til ekstern side og bilde. Blokka vil se slik ut når den er publisert. Lenke og tekst er da klikkbart. Lenkecontainer NB: Lenkecontainer kan benyttes men har for stor skrift i dag. Dette vil bli justert. 18
Denne blokken er enkel å redigere i enkel redigering. Dra de sider eller blokker du vil ha i den, ned til felte du kan slippe ting i. Denne kan også brukes dersom du har feks. To kontaktpersoner du vil ha inn på flere sider. Da kan du lage en lenkecontainerblokk med begge i, og legge denne på siden. Lenkecontainer vist med lenker til sider: Kontaktblokk med to kontaktpersoner Lenkeliste NB: Blokk er enda ikke ferdigutvikla. 19
Med denne blokken kan du legge inn lenker som du legger brakgrunnsfarge på. For å legge til dokument «Klikk knappen for å redigere». Det vil åpne seg et nytt vindu. Velg «Legg til kobling» og legg inn det/dei dokumentene du vil ha med. Klikk på fargekoden for å endre farge. Du får da opp en fargepalett du kan velge farge i. Dersom du vil ha samme farge på alle lenkene, kan du kopiere fargekoden til de andre boksene (Merk fargekoden bruk ctrl c og lim inn i neste boks med ctrl v). Dokumentliste NB: Dokumentliste er ennå ikke på plass men kommer snart Skriv inn navnet på blokka og velg «Dokumentliste» For å legge til dokument «Klikk knappen for å redigere». Det vil åpne seg et nytt vindu. Velg «Legg til kobling» og legg inn det/dei dokumentene du vil ha med. Dersom du vil endre symbol som viser over listen kan du gjøre dette på nedtrekksmenyen på Ikon. På rammetittel legger du inn tittel som skal vise over alle dokumentene, for eksempel referater, dokumenter eller lignende. Hak av for å vise fil-ikoner om du vil at det skal vise hvikle type dokumenter du har i listen (Word, PDF o.l.) 20