Vedlikehold av din nettside

Denne guiden forklarer hvordan du kan vedlikeholde din nettside ved bruk av det innebygde CMS-systemet (Content Management System).

Guiden inneholder 3 seksjoner:

  1. Oppstart
    Logge inn til CMS-verktøyet — og komme seg tilbake igjen.
  2. Bli kjent med ditt CMS
    Et overblikk over funksjoner og seksjoner.
  3. Opprette og administere innholdet ditt
    Hvordan legge til og redigere innholdet på siden.

Trenger du hjelp?

Gi meg beskjed om det er noe du trenger, eller om du har spørsmål.

Takk! Du hører fra meg ASAP.
Oops! Noe gikk galt. Prøv igjen?

Oppstart

Å ta kontroll over din nye nettside starter ved å få tilgang til det innebygde systemet for innholdshåndtering (CMS). Har du fått levert nettside fra meg skal du allerede ha fått login med admin-rettigheter satt opp, eller du har mottatt en epost for opprettelse av bruker.

For å logge inn til redigering taster du inn din nettadresse og legger til /?edit på slutten. 

Så hvis din URL er nettside.no, går du bare til nettside.no/?edit for å logge inn og starte redigeringen.

Når du går til denne URLen kommer du til din nettsides CMS – som først vil se helt lik ut som din nye nettside. Med unntak av en grå linje i bunn, med et enkelt innloggingsskjema (om du ikke allerede er logget inn).

The login screen for the Editor

Her fyller du inn din e-post og passord og klikker på "Log in".

Merk: om du er side-administrator (med fullt eierskap til back-end) vil du her få opp en rød boks med lenke videre til egen login. Følg lenken og logg inn, deretter går du tilbake til redigering-URLen.

Once you're logged in, the control panel sits at the bottom of your site
Når du er logget inn vil du se en ny linje i bunn hvor du kan administrere dine sider og samlinger.

Ditt CMS-system ser helt likt ut som din nettside – med unntak av verktøylinjen i bunn med to faner merket Pages og Collections, pluss en rekke ikoner. Alt dette forklarer jeg mer om under.

Nå, ta deg tid til å legge til bokmerke for denne siden, slik at du enkelt kan gå tilbake til den senere. I de fleste nettlesere kan du legge til bokmerker for en side ved å trykke Control + D (Windows) eller Command + D (Mac).

Om du er logget inn og kommer tilbake til den vanlige siden din senere kan du også se en knapp nederst til høyre Edit Site, klikk på denne for hurtig tilgang til redigering. Denne knappen dukker kun opp om du er logget inn i systemet, ingen andre kan se dette.

Med det grunnleggende ute av veien, la oss se mer på selve CMS-systemet.

Hva er CMS?

CMS står for content management system, eller system for innholdshåndtering, og som navnet antyder, er det et system for å håndtere innholdet på nettsiden din.

Hva din CMS kan gjøre

Ditt CMS lar deg redigere eksisterende innhold på nettstedet ditt, inkludert tekst, bilder, knapper, lenker osv.

Det lar deg også lage elementer utover redigering gjennom samlinger (Collections).

Hva din CMS ikke kan gjøre

Hvis du trenger en ny side eller eller elementer som ikke passer inn i en av dine eksisterende samlinger, kontakt meg!

Bli kjent med ditt CMS

Nå som du har en konto til ditt CMS og vet hvordan du kommer deg tilbake til det, kan vi se litt nærmere på grensesnittet.

The Editor panel with tabs for pages, Collections, account settings, help content, and a log out button

Vi starter med de to fanene til venstre, Pages (sider) og Collections (samlinger). Dette er systemets to standardfaner. Du vil få muligheten til å åpne flere faner, men disse to vil alltid være der for deg.

Pages-fanen

Fanen Pages innholder en liste over ditt nettsteds sider. Den kan være delt opp i flere seksjoner.

  1. Static pages (Statiske sider): Dette er sider jeg har satt opp utenom dine samlinger. Dette er som regel forsiden, om-siden, tjenester, kontakt osv.
  2. Collection pages (Samlingens sider): Dette er sider generert fra dine samlinger, og kan inkludere ting som nyheter, hjelpesenter, dokumentasjon o.l. De er listet med samlingsnavnet som dette: Nyheter Pages. Ikke alle samlinger har statiske sider knyttet til sitt innhold, og du kan i så fall ignorere disse under Pages-fanen (se egen fane Collections for redigering av disse).
The expanded Editor panel

Hva du kan gjøre i Pages-fanen

Listen over statiske sider lar deg gjøre flere ting::

  1. Søk etter en side: Tast inn en sides navn i søkefeltet for å finne denne. Merk at dette er et eksakt-match-søk, så du er nødt til taste inn minst ett ord som er i side-navnet nøyaktig.
  2. Gå til en side: Bare klikk på sidenavnet i listen for å minimere fanen og gå til valgt side. Når du er der kan du redigere innhold som i et vanlig tekstbehandlingsprogram.
  3. Rediger sidens innstillinger: Når du holder musen over en side i listen får du opp en knapp merket "Settings". Klikk på denne for å komme til den valgte sidens egne innstillinger, som SEO meta tittel og beskrivelse samt Open Graph.

Page settings

Sidens innstillinger er viktige for søk og sosiale medier, la oss se litt nærmere på hva disse innstillingene betyr, og hvordan du kan gjøre mest mulig ut av de.

Page settings in the Editor

SEO Settings

SEO, eller "søkemotoroptimalisering" er metoden for å sette opp og forbedre nettsider slik at sjansen for at de blir funnet gjennom søkemotorer som Google, Bing, etc. øker.

I hver sides innstillinger kan du sette opp eller redigere følgende SEO-innstillinger:

  1. Meta title: En sides tittel spiller en stor rolle innen synlighet og ytelse i søkemotorer, både fordi den a) forteller søkemotorer hva siden er om, og b) er hva brukerne vil klikke på for å komme til siden. Pass på at den inkluderer den type som beskriver sidens innhold. Ideelt sett kan du sikte på en tittel med lengde på rundt 55-60 bokstaver.
  2. Meta description: Dette er en litt mer detaljert beskrivelse om siden din (rundt 150 bokstaver). Den er viktig for søk, men ikke på nær så viktig som tittelen. Denne teksten vil ikke vises på selve nettsiden din.

Under disse feltene vil du også se en forhåndsvisning av hvordan ditt innhold vil se ut i Googles søkeresultat. Hvis noe tekst blir klippet bort her bør du trimme ned teksten slik at den passer.

Open Graph (OG) settings

Open Graph-innstillinger er veldig like SEO-innstillinger, men disse blir brukt av sosiale medier som Facebook, Twitter og LinkedIn. Hvis du bruker en av disse tjenestene har du sett hvordan Open Graph virker flere ganger.

Som regel kan du la dette stå (den sil som standard sette lik tittel og beskrivelse som i dine SEO-innstillinger). Men her har du altså muligheten til å redigere, om du har behov.

Open Graph lar deg også spesifisere et bilde som kan vises sammen med tittel og beskrivelse når noen deler en lenke inn til din side.

An Open Graph card, showing image, title, description, and page URL
Et eksempel på Open Graph-bilde, tittel og beskrivelse på Facebook. 

Collections-fanen

Fanen Collections er veldig lik Pages-fanen, men lister kun opp innholdet i dine samlinger – som jeg har satt opp (gjelder kun om du har pakken CMS).

Når du klikker på en samling blir du tatt til en ny fane med en liste over alle elementene i samlingen.

Tab for Collection items
 Som i Pages-fanen, har vi også her et søkefelt du kan bruke for å finne elementer etter navn.

For å legge til et nytt element i denne samlingen, klikk på den grønne knappen + New Samlingsnavn og fyll ut feltene som dukker opp. Pass på å lese hjelpeteksten og eventuelle krav til hvert felt.

The Editor's item view, with back button, preview button, and changelog

Hva du ser inne på hver samling vil variere basert på strukturen jeg har satt opp til den, men noen kjennepunkter dukker opp uansett.

  1. Tilbake: En pil til venstre for tittelen tar deg tilbake til listen i denne samlingen.
  2. Forhåndsvis: Ikonet til høyre for tittelen. Denne kollapser CMS tilbake til linjen i bunn og viser deg elementet du redigerer nå, slik den vises på siden (enkelte samlinger har ikke en egen statisk side for hvert element. Siden vil i så fall være blank, da denne vises andre steder på nettstedet).
  3. Status: Viser gledende status for elementet du ser på. De forskjellige statuser er Published (publisert), Not Published (ikke publisert) og Draft (Kladd).
  4. Draft avkryssningsrute: Huk av for Draft (Kladd) dersom du ikke er ferdig med redigeringen. Alt som ikke er markert som kladd vil bli publisert når noe klikker på Publish-knappen!
  5. Changelog: Når du gjør endringer i CMS vil den notere ned antall endringer i dette feltet, inntil du klikker Publish. Du kan klikke på changelog for å se en liste over elementer og sider som har upubliserte endringer, sammen med hvem som gjorde endringene, hvis du har satt opp flere CMS-brukere.
  6. View Site: Vis siden. Øverst i vinduet finner du denne knappen, som tar deg tilbake til nettsiden din. Du kan bruke alle knapper og lenker for a navigere gjennom sidene dine i denne modusen.

Save for å lagre endringer, og trykk på Publish for å publisere endringene, du er nødt til å klikke på Publish to ganger for å bekrefte.

Hvordan publisering virker i din CMS

Hver gang du klikker på Publish i din CMS, publiserer hele nettsiden din på nytt. Hvis du vet andre jobber på nettsiden når du er klar til å publisere, bør du sjekke med de om de er klare for at deres endringer går ut nett.

Forms-fanen

Hvis din CMS er inkludert et skjema vil du se en egen fane for dette, Forms. Her vil du kunne se noe grunnleggende informasjon som brukere har sendt inn, men denne listen er mest brukt som et nyttig sted å laste ned all data fra skjemaet. Klikk på Download CSV for å eksportere data (CSV støttes av alle store regneark-applikasjoner).

The forms tab lists submissions by date

Hva med de ikonene?

Etter Pages og Collections finner du tre ikoner. Fra venstre er disse:

Konto

Viser informasjon om din CMS-konto, inkludert registrert e-post og bilde, hvis du har lastet opp et. Hvis ikke kan du laste opp et her.

Hjelp

Gir svar på noen vanlige spørsmål om å bruke systemet (engelsk).

Logg ut

Logger deg ut av systemet for å vise siden din slik alle andre ser den.

Hva er SEO?

SEO står for "søkemotoroptimalisering", og enkelt sagt er det en rekke fremgangsmåter som er utformet for å sikre at folk kan finne innholdet ditt når de søker etter emner du skriver om på Google, Bing og andre søkemotorer.

Din CMS lar deg tilpasse "metatittelen" og "metabeskrivelsen" - to av de viktigste SEO-elementene - for hver side og samling på nettstedet ditt.

Opprette og administrere innhold

Systemet gir deg to måter for å redigere innhold som allerede er på siden.

  1. Direkte på den publiserte siden
  2. I samlinger-fanen (Collections)

Vi skal se på begge måtene å redigere på, og vi starter med redigering direkte på siden.

Direkte redigering

Redigering direkte på siden er ganske intuitivt i din CMS, men det er et par ting du bør vite.

Redigere tekst

Editable areas display a pencil icon in the upper right
Hvis du ser blyant-ikonet øverst til høyre er innholdet redigerbart.

Når du først logger inn til ditt CMS ser du din publiserte side med CMS-panelet (den grå linjen) kollapset i bunn av skjermen din.

Hvis ser noe tekst du vil redigere, bare hold musepekeren over teksten. Hvis du får opp en lys grå ramme med et blyant-ikon kan du redigere dette innholdet. Bare klikk inn i boksen og skriv i vei!

Redigering av tekst fungerer som alle andre programmer, men styling av teksten – fet, kursiv etc. – virker på en litt annen måte.

Select text to show a toolbar with formatting options
Bare marker noe tekst for å vise alle formateringsvalg.

For å style teksten, markerer du området du vil endre. En grå verktøylinje dukker opp, som gir deg følgende valg:

Du kan også style tekst med følgende tastekombinasjoner (Mac/PC):

For å bruke en tastekombinasjon, bare trukk og hold inne Command (på Mac) / Control (i Windows), så trykker du på bokstavtasten (B, I eller K), så slipp.

Merk: Noen ganger vil ikke tekstfelt gi deg alle disse alternativene. Dette var mest sannsynlig gjort med overlegg, men om du trenger flere stylingvalg, ta kontakt!

Sette inn lenker

Systemet lar deg legge til flere forskjellige lenke-typer for å oppnå forskjellige funksjoner.

The toolbar for adding and managing links
Å legge til en lenke tar et par klikk, men gir deg en rekke alternativer.

Marker tekst og klikk på lenke-ikonet. Verktøylinjen viser deg som standard et felt du kan legge inn lenken, men hvis du klikke på ikonet til venstre får du flere valg:

  1. External: ekstern lenke, som regel til en annen nettside, men du kan også lenke til en annen side på dit nettsted
  2. Page: lenker til en annen side på ditt nettsted. Du vil få opp en liste med dine sider her.
  3. Section: lenker til en annen seksjon på den samme siden du legger inn lenken på. Du vil se en liste med evt. muligheter her.
  4. Email: lager en standard e-post-lenke som åpnes i standard e-post-program, med e-posten du spesifiserer som mottaker.
  5. Tel: lager en lenke til som ringer et telefonnummer du spesifiserer. Dette er spesielt nyttig om brukere besøker siden på en mobiltelefon.

Hver lenketype har forskjellige tilpasningsalternativer. Klikk på tannhjul-ikonet for å se hva som er tilgjengelig for den valgte lenke-typen.

Flere tekstredigeringsvalg

Noen tekstområder (som regel lengre tekster) vil gi deg flere redigeringsvalg.

Create a new line to show options for inserting images, video, rich media, and lists
Tast enter og klikk på + ikonet for å legge til bilder, video, rikt media eller en enkel liste.

Når du taster enter (return) for å starte en ny paragraf, kan du se et lite + ikon. Klikk på dette for å åpne verktøylinjen, som gir deg følgende valg.

The image icon
Bilde

Lar deg laste opp et bilde.

The video icon
Video

Lar deg legge inn en video. Dette må være en video som er lastet opp på en platform som YouTube eller Vimeo – du kan ikke laste opp en video-fil fra din datamaskin.

The rich media icon
"Rikt media"

Lar deg legge inn "rikt media / (rich media)" via en lenke. Det er mange forskjellige elementer du kan legge til (embedde) med denne funksjonen, men er her er noe av de mest populære.

The bulleted list icon
Punktliste

Legger til en punktliste.

The numbered list icon
Nummerert liste

Legger til en nummerert liste.

Alt vi har gått gjennom om tekstredigering gjelder også ved redigering av elementer i listevisningen til systemet.

Redigere knapper

To edit a button's text or link, click the gear icon, then the appropriate option
Vil du endre teksten eller lenken til en knapp? Bare hold musen over og se etter tannhjuls-ikonet.

Du kan også redigere knapper i ditt CMS. Bare hold musen over knappen og se etter et tannhjulsikon øverst til høyre. Klikk på ikonet og du vil få opp to valg:

  1. Edit link settings lar deg oppdatere hvilken side knappen tar brukerne til.
  2. Edit text lar deg endre teksten inne i knappen.
Button with options for editing links and text

Redigere bilder

Editable images show the image icon in the upper right
Å erstatte bilder virker på samme måte som med knapper – bare hold musen over bildet og klikk på ikonet øverst i høyre hjørne.

Du kan også erstatte bilder på siden din med systemet. Bare hold musen over bildet du vil oppdatere, klikk så på bilde-ikonet øverst til høyre.

Dette vil åpne opp din maskins filsystem, hvor du kan velge bildet du vil bruke.

Merk: Noen ganger vil visse visuelle stiler automatisk gjelde for bildet du laster opp, så ikke bli overrasket om bildet ditt plutselig endrer størrelse/format, får en farget kant eller skygge osv.

Håndtere objekter i samlinger i bulk

Click the "Select" button to bulk manage Collection items
Klikk på Select...-knappen for å håndtere flere samlingsobjekter.

Noen ganger vil du slette, arkivere eller publisere flere objekter på én gang fra samlingslisten. I så tilfelle kan du klikke på Select... slik at du kan velge flere objekter. Dette er spesielt hendig om du f.eks. skal publisere flere koblete objekter (som en serie artikler) på én gang.

Lage nytt innhold

Du kan bruke din CMS for produsering av nytt innhold gjennom dine samlinger, så det er superlett lage et nytt blogg-innlegg, product, tjeneste – hva enn dine samlinger er satt opp for!

Creating a new Collection item

Dette bør være relativt intuitivt, og etikettene og den beskrivende teksten for hvert felt skal være til hjelp (om jeg har gjort jobben min). Men det er et par ting vi kan se på.

Name-feltet

Feltet merket Name (navn) er standard for alle samlinger, og den gjør som regel 3 ting.

  1. Gir tittelen på evt. statisk side
  2. Er kilden til URL-en på nett (Slug)
  3. Gir tittelen til objektet innen CMS-systemet

Det kan være at jeg har satt opp separate felter for 1 og 2 her.

Bildefelter

Hvis du ser teksten "Drag & Drop Image Here" ser du på et bildefelt. Du kan enten dra et bilde over fra en annen applikasjon på din datamaskin, eller du kan klikke på "Upload an Image" for å laste opp gjennom filsystemet på maskinen din.

Merk at din CMS ikke kan takle bilde-filer over 4MB. Hvis filen din er større enn dette kan du bruke et Photoshop el lign. eller et onlineverktøy som TinyPNG eller Compressor for å få filene dine under denne terskelen. Husk alltid på at jo større bildet er, jo lenger tid tar det å laste inn, slik at det optimale er å få bildefilen så liten som mulig uten å forringe kvaliteten.

Det er også opp til deg å sørge for at du har rettighetene til å bruke alle bildene på din nettside.

Referansefelt

Hvis du ser felter med et forstørrelsesglassikon til høyre, har samlingen et referanse- eller flerreferansefelt. Dette lar deg importere innhold fra en samling til en annen, som kan brukes til å hente ting som kategorier og tags (vanlige bloggfunksjoner).

For å bruke

For å bruke et referansefelt, klikker du bare inn i feltet og velger riktig referanse for det nye elementet. Hvis du ikke ser riktig referanse for den nye siden, kan det hende du må opprette et nytt element i samlingen dette feltet refererer til.

Dette kan stå forklart i hjelpeteksten til dette feltet, men hvis det ikke gjør det kontakter du meg bare for hjelp.

Tilvalgfelt

Du kan ha et tilvalg-felt som er en liste du klikker deg inn i for å velge riktig valg for ditt nye innhold. Dette ligner på referansefeltet over, men er ikke koblet til en annen samling. Trenger du flere tilvalg her tar du kontakt.

Videofelt

Videofeltet lar deg legge til video i ditt nye innhold. Det henter innholdet ditt fra en offentlig videovert som YouTube eller Vimeo – slik at du ikke bare kan laste opp en videofil. Hvis du har en videofil du vil ha på nettstedet ditt, kan du laste den opp til YouTube eller en annen tjeneste, og deretter bare kopiere og lime inn URL-en i Video-feltet.

Merk: du trenger ikke innebyggingskoden (embed) som genereres av tjenester som YouTube, bare nettadressen.

Bryterfelt

Bryterfeltet er en enkel av/på, ja/nei bryter som aktiverer eller deaktiverer funksjonalitet på nettstedet ditt. Hvis du ikke er sikker på hvordan dette fungerer på siden din, spør meg.

Fargefelt

Fargefeltet lar deg legge til en dæsj med farge på ditt innhold på en måte som er forhåndsdefinert av meg. Selve feltet lar deg velge en farge visuelt, fra fargevelgeren, eller å legge inn det som er kalt en "Hex kode" – mer om webfarger.

The color field

Bruk av fargevelgeren kan ta litt tid å bli vant til i begynnelsen, men du får raskt taket på det. Linjen til venstre representerer hele spekteret av tilgjengelige farger - ved å klikke her oppdateres fargeprøven i midten til en rekke toner i området du klikket på. Midtområdet er der du velger den nøyaktige fargen du vil ha. Linjen til høyre representerer fargens opasitet, som styrer hvor gjennomsiktig fargen er.

Tips til din redaksjonelle workflow

Hvis du er den eneste som jobber i CMS-systemet på din nettside vil du klare deg fint med å skrive, redigere og publisere, alt inne i ditt CMS.

Men hvis skrive- og redigeringsteamet ditt er større enn én person, bør du sannsynligvis bruke et annet verktøy for å skrive, dele, redigere og samarbeide om innhold.

Hvorfor? Her er to store grunner:

  1. De fleste skriveverktøy tilbyr mer detaljerte samarbeids- og redigeringsalternativer, som sporendringer og kommentarer.
  2. Det er alltid bra å ha sikkerhetskopier av alt du publiserer på nettstedet ditt (i tilfelle noen ved et uhell sletter noe)

Anbefalte skrive- og redigeringsverktøy

Her er noen få skriveverktøy som gir en flott skriveopplevelse, enkelt samarbeid med andre, og som fungerer bra med ditt CMS, ved at du ikke mister formateringen når du kopierer og limer inn innhold fra dem inn i systemet.

Jeg anbefaler ikke å bruke Microsoft Word.

Tips! Skriv lengre innhold utenfor ditt CMS-system

For kort innhold er det ikke noe problem å skrive og redigere rett inn på nettsiden når du vil.

For lengre innhold som kanskje behøver et ekstra par øyne kan det ofte være lurt å skrive, samarbeide og redigere i en separat app, og så lime inn innholdet i systemet ditt når det er klart for publisering.

Dette gjør samarbeid enklere, og f.eks. Google Docs virker veldig bra som verktøy da deres overskirft og formateringsvalg overføres sømløst rett inn i ditt CMS.

Men, etter at du har limt inn Google Docs-innhold inn i systemet, pass på at du sletter og legger inn bildene dine på nytt, slik at du sørger for at de er lastet inn til din nettside på riktig måte.

Du kan laste ned bilder fra et Google-dokument ved å gå til:

File > Download as > Web Page

Dobbelklikk på den nedlastede ZIP-filen for å pakke den ut, og du bør se en mappe merket "Images".

Redigere tekst i en samling

Hvis du redigerer innhold som kommer fra en av dine CMS-samlinger vil alle andre instanser av den samme teksten automatisk oppdateres over hele nettsiden din.

For eksempel, hvis du redigerer tittelen på et blogg-innlegg på forsiden til bloggen vil tittelen også endre seg på selve artikkelsiden og alle andre steder den evt. dukker på på sidene dine.

Redigere URLer

For å fortsette fra eksempelet over, la oss si du redigere tittelen på et blogg-innlegg, og nå oppdager du at du vil oppdatere lenketeksten (URL) slik at den matcher den nye tittelen.

Bra tenkt, og den gode nyheten er at du enkelt kan redigere dette også i ditt CMS-system.

Men, dette vil også ødelegge alle innlenker til den gamle URLen din!

Bare slapp av: Dette kan jeg fikse, men det er best å gi meg beskjed før du endrer lenketeksten.

Logo - Logotype

Logotype - Ingjer Media

Per-Erik Ingjer
Postadresse: Fuglekongestien 26, 1920 Sørumsand
Epost: post@ingjermedia.no
Org.nr. 999 018 998 MVA