Hvordan bruke den nye editoren Gutenberg

av naldy
Hvordan bruke Gutenberg

Gutenberg introduserer en helt ny måte å skape innhold på. Etter flere henvendelser fra dere lesere, har vi laget en guide om hvordan bruke den nye editoren.

Siden lansering har Gutenberg blitt mottatt med delte meninger. Noen liker den, andre foretrekker fremdeles den klassiske editoren.

Enten du har brukt den en stund, eller fremdeles ikke forstår hvordan ting fungerer, vil denne guiden hjelpe deg i gang.

Hva skiller Gutenberg og klassisk

Før vi går løs på den nye editoren, la oss se nærmere på hva som skiller Gutenberg og den klassiske.

WordPress - Klassisk editor

Når du oppgraderer til WordPress versjon 5, byttes den klassiske editoren ut med den blokkbaserte editoren Guenberg.

WordPress - Gutenberg editor

Som du kan se fra skjermbildene er det en del som er forandret.

Den klassiske editoren har et brukergrensesnitt vi kjenner fra kjente tekstbehandlere som Microsoft Word.

Gutenberg derimot, behandler innholdet i det man kaller blokker. En blokk er et innholdselement, og hver blokk har sine egne menyknapper.

I Gutenberg kan en blokk være et avsnitt, bilde, videoe, lyd, tabell, liste osv. Det finnes blokker for mange ulike innholdselementer, og flere kan legges til fra installerte utvidelser.

Er Gutenberg bedre enn klassisk?

Hvilken som er best vil det nok være delte meninger om. De WordPress brukerne som i hovedsak skriver lengre tekster, vil sannsynligvis foretrekke klassisk.

Imidlertid er Gutenberg, slik vi ser det, en mer komplett editor. Den er brukervennlig for nybegynnere, lett å lære seg, og kan legge til innholdselementer som ikke var mulig i klassisk.

Den klassiske editoren var avhengig av utvidelser for å kunne håndtere noe så enkelt som en tabell.

I den nye editoren velger man bare antall rader og kolonner, og skriver innhold rett inn i tabellen. Det blir ikke stort enklere enn det.

For mange vil det oppleves som noe nytt å jobbe med blokker, men det hele er egentlig veldig enkelt. Blokker er fleksible, kan redigeres og formateres individuelt, flyttes opp eller ned osv.

Den nye editoren lar deg også lagre blokker til gjenbruk senere, noe som i klassisk må gjøres manuelt med kopier og lim inn.

Totalt sett mener vi at Gutenberg har mange egenskaper som gir den flere fortrinn sammenlignet med klassisk editor.

Samtidig er det fullt forståelig at erfarne WordPress brukere foretrekker å bytte tilbake til klassisk editor. En derimot ikke så urimelig teori er at de fleste vil gå over til Gutenberg etterhvert.

Hvordan lage et innlegg eller ny side

Når det kommer til praktisk bruk, kan Gutenberg gjøre alt den klassiske kunne, og mye mer.

Et nytt innlegg lages ved å trykke på Innlegg > Legg til nytt.

En ny side lages ved å trykke på Sider > Legg til ny.

Når du velger å lage et innlegg eller ny side, vil Gutenberg editoren starte automatisk.

Hvordan legge til en blokk

Når du skal skrive et nytt innlegg vil den første blokken alltid være tittelen.

Tittelen danner også grunnlaget for hva adressen (permalenke) blir. Denne kan forøvrig endres manuelt fra menyen.

Bruk muspekeren eller tabulator-knappen på tastaturet for å veksle mellom blokker.

Gutenberg har flere blokktyper, som til eksempel overskrift, avsnitt, sitat, bilde osv.

Som standard vil en ny blokk alltid være av typen avsnitt, og lar deg skrive inn tekst med det samme.

For å lege til en annen blokktype, klikk på knappen «Legg til blokk» som er synlig oppe i venstre hjørne, under eller ved siden av en eksisterende blokk.

Gutenberg - Legg til blokk

Når du trykker på knappen for «Legg til blokk» , vil en meny vise de mest brukte blokkene.

gutenberg velg blokk type

Bla nedover i listen med muspekeren, eller bruk søkefeltet øverst for å velge blokken du ønsker.

For deg som synes det er lettere å bare bruke tastaturet, kan du skrive / (slash) i en ny blokk for å velge blokken du ønsker.

Gutenberg - Skriv slash for søk

Hvordan jobbe med blokker

Hver eneste blokk har sin egen verktøylinje, og knappene viser på toppen.

Knappene i en blokk vil endre seg alt etter hvilken type blokk du arbeider med. Til eksempel en blokk av typen «Avsnitt», vil alltid vise alternativer for justering og formatering.

Gutenberg - Menyknapper for blokk

En blokk har (i tillegg til verktøylinjen) en del ekstra innstillinger i margen til høyre.

Gutenberg - Ekstra innstillinger i margen

Blokker kan flyttes ved å dra de opp eller ned med muspekeren, eller med knappene til venstre for blokken.

Gutenberg - Flytt en blokk

Lagre blokker for gjenbruk senere

En spesielt nyttig funksjon i Gutenberg er å kunne lagre en blokk for gjenbruk senere. Livet blir dermed litt lettere for innholdskapere som ofte må legge til et bestemt innhold.

For å lagre en blokk for gjenbruk, klikk på knappen «Flere alternativer» og velg «Legg til som gjenbrukbar blokk».

Gutenberg - Alternativer gjenbrukbar blokk

Når blokk skal lagres for gjenbruk, må du først gi den et navn. Skriv inn et navn på blokken og klikk «Lagre».

Gutenberg - Lagre gjenbrukbar blokk

Gjenbrukbare blokker er globalt tilgjengelig, og kan settes inn i hvilket som helst innlegg senere.

Klikk på «Legg til blokk» og bla nedover i listen til du finner «Gjenbrukbar», eller bruk søkefeltet.

Gutenberg - Sett inn gjenbrukbar blokk

Når du holder muspekeren over en blokk du har lagret for gjenbruk, vil en forhåndsvisning bli synlig til høyre.

Gjenbrukbare blokker lagres i databasen, og kan styres fra alternativet «Behandle alle gjenbrukbare blokker».

Gutenberg - Behandle alle gjenbrukbare blokker

Når du klikker på «Behandle alle gjenbrukbare blokker» vil skjermbildet for å administrere gjenbrukbare blokker vise.

Gutenberg - Administrer gjenbrukbare blokker

Her kan du endre, redigere og slette gjenbrukbare blokker. Les hvordan du kan eksportere og importere blokker til et annet nettsted med WordPress.

Publiser og andre alternativer

I Gutenberg er alternativer for synlighet, permalenke, stikkord, kategorier, fremhevet bilde osv. plassert i sidekolonnen til høyre.

Disse alternativene ligger under en egen fane i sidekolonnen, og du må klikke på «Dokument» for å vise de.

Gutenberg - Publiser og andre alternativer

Innstillinger for utvidelser

Utvidelser som er kompatible med Gutenberg vil vanligvis integreres sømløst i brukergrensesnittet.

Utvidelser vil vanligvis plassere ekstra blokker, innstillinger, menyknapper osv. for enkel tilgang.

Til eksempel vil utvidelsen Yoast SEO (som mange bruker) plassere en menyknapp oppe i hjørnet til høyre.

Gutenberg - Yoast SEO integrert i brukergrensesnittet

Boksen for tittel, meta-beskrivelse osv. er fremdeles plassert nederst (under innholdet), akkurat som i klassisk editor.

Legg til standard blokker i Gutenberg

I utgangspunktet kan Gutenberg gjøre alt den klassiske kunne. Utivklerne har derimot forsøkt å gjøre vanlige oppgaver raskere for deg.

Sett inn et bilde

For å legge til et bilde setter du først inn en blokk av typen «Bilde». Klikk deretter på «Last opp», «Mediebibliotek» eller «Sett inn fra URL».

gutenberg sett inn bilde

Du kan også bare dra et bilde fra datamaskinen til hvor du ønsker å sette det inn. Da vil Gutenberg automatisk lage en bildeblokk, og laste opp bildet for deg.

Gutenberg - Alternativer for bilde

Når du legger til et bilde, vil ekstra innstillinger for blokken bli synlig i sidekolonnen. Skriv inn alternativ tekst, velg størrelse osv.

Sett inn en lenke

En ny blokk vil som standard alltid være av typen avsnitt. Som vi har nevnt tidligere, har hver eneste blokk sin egen verktøylinje på toppen av blokken.

Sett inn en lenke ved å klikke på knappen «Lenke» på verktøylinjen. Du kan også sette inn en lenke ved hjelp av snarveier på tastaturet.

Gutenberg - Sett inn lenke

Snarveien for å sette inn en lenke er CTRL+K (Windows) eller Kommando+K (Mac).

Sett inn et bildegalleri

For å sette inn et bildegalleri legger du til en blokk av typen «Galleri».

Gutenberg - Sett inn et bildegalleri

Klikk deretter på «Last opp» eller velg bilder fra «Mediebibliotek».

Når du har lastet opp eller valgt bilder til galleriet, kan alternativer som kolonner, beskjæring m.m. endres fra sidekolonnen.

Sett inn kortkode

Kortkoder fungerer på samme måte i Gutenberg som klassisk editor. Skriv bare koden rett inn.

Gutenberg - Sett inn kortkode

Gutenberg har også en egen blokktype for kortkoder.

Legg til nye blokker i Gutenberg

Utviklerne av Gutenberg har fokusert mye på å løse oppgaver som var problematiske i klassisk editor.

Sett inn media og tekst

Den klassiske editoren kunne ikke (på en enkel måte) sette inn tekst ved siden av et bilde. Dette kan du gjøre i Gutenberg ved å bruke blokken «Media og tekst».

Gutenberg - Media og tekst

Blokken «Media og tekst» er delt i to, media på en sde og tekst på den andre. Bruk verktøylinjen på toppen av blokken for å endre utseende.

Sett inn en knapp

Å legge til en knapp i et innlegg eller på en side, var en stor utfordring i klassisk editor. Du måtte enten bruke en utvidelse, eller skrive inn HTML koden manuelt.

Gutenberg derimot, kommer med en blokk hvor du kan legge til en knapp (nesten) hvor som helst.

Gutenberg - Sett inn en knapp

Koble knappen til en lenke, og bruk alternativene i sidekolonnen for å endre stil, farge m.m.

Sett inn et dekke eller cover

Noe du absolutt bør prøve er blokken «Dekke» på norsk, eller «Cover» på engelsk.

Et cover er et bilde som er bredere enn vanlig, og brukes ofte som omslag for nytt tema eller kapittel. De ser vakre ut og kan bidra til mer engasjerte lesere!

Gutenberg - Sett inn et dekke (cover)

Legg til blokken «Dekke», last deretter opp bildet du vil bruke. Velg overlegg og andre effekter i sidekolonnen.

Sett inn en tabell

Den klassiske editoren hadde ikke mulighet for å sette inn tabeller. Det måtte du bruke en utvidelse for, eller skrive inn HTML koden manuelt.

Gutenberg har en blokk som løser dette, og gjør det super enkelt å legge til tabeller i innlegg og sider.

Legg til blokken «Tabell», velg deretter antall kolonner og rader du vil sette inn.

Gutenberg - Sett inn en tabell

Legg merke til verktøylinjen. Her kan du legge til flere rader, kolonner, endre justering m.m. Flere alternativer finner du i sidekolonnen.

Del tekst inn i kolonner

Å dele tekst inn i flere kolonner var også et problem som den klassiske editoren ikke håndterte særlig godt.

Gutenberg - Del tekst inn i kolonner

Gutenberg har en blokk av typen «Kolonner» som gjør dette helt enkelt.

Noen tips og triks helt til slutt

Den nye editoren i WordPress introduserer en helt ny måte å skape innhold på. Gutenberg er ganske smidig, og de fleste vil nok oppleve (etterhvert) at arbeidet går raskere.

Vi tror at etter å ha brukt editoren en liten stund, legger du til blokker uten å tenke noe mer på det.

Helt til slutt har vi samlet sammen noen tips og triks som vi håper kan være av interesse.

Jobb effektivt med hurtigtaster

Gutenberg har flere innebygde snarveier for å gjøre arbeidsflyten bedre. Den første du bør begynne å bruke er / (slash).

I en ny blokk kan du til eksempel skrive /bilde, og Gutenberg vil vise deg matchende blokker å sette inn.

Gutenberg - Skriv /bilde for rask tilgang

Hvis du vet navnet på blokken du ønsker, kan du i mange tilfeller bare skrive /blokktype, og deretter trykke enter for å sette den inn.

For flere snarveier, klikk på knappen med de tre prikkene, «Vis flere verktøy og alternativer», øverst til høyre.

Gutenberg - Alternativer for tastatursnarveier

Listen vil inneholde litt forskjellige snarveier for brukere av Windows og Mac.

Dra og slipp for å lage mediablokker

Gutenberg lar deg dra og slippe filer hvor som helst på skjermen. En ny blokk lages da automatisk, ferdig tilpasset innholdet i filene.

Du kan til eksempel slippe bilde eller en videofil. Du kan også slippe flere bilder samtidig for å automatisk lage et galleri.

Flytt verktøylinjen på toppen

Vanligvis vil verktøylinjen vise øverst på hver blokk. Om du foretrekker det, kan denne flyttes på toppen.

Gutenberg - Verktøylinje på toppen

Klikk på knappen med de tre prikkene, «Vis flere verktøy og alternativer», øverst til høyre. Velg «Verktøylinje på toppen».

Ofte stilte spørsmål om Gutenberg

Den siste tiden har vi mottatt mange spørsmål om Gutenberg. Her er noen av de mest vanlige spørsmålene vi får og svar på dem.

Hva er Gutenberg?

Gutenberg er navnet på prosjektet for å skape en ny redaktør- eller publiseringsopplevelse i WordPress. Målet er å lage en editor hvor det er enklere å produsere innhold, uten hjelp fra andre utvidelser.

Hvilke nettlesere støtter Gutenberg

Alle de moderne nettleserne støtter den nye editoren.

Er det mulig å fortsatt bruke klassisk editor?

Du kan fint bruke den klassiske editoren ved å installere utvidelsen Klassisk redigering. Når denne utvidelsen aktiveres, vil den automatisk slå av Gutenberg. Les hvordan gå tilbake til klassisk editor for mer informasjon.

Hva om en utvidelse (plugin) ikke virker?

Ettersom Gutenberg har vært under utvikling en lang stund, fikk de fleste plugin- og temautviklere god tid til å gjøre produktet sitt kompatibelt.

Det er fortsatt sjanse for at noen utvidelser og temaer ikke fungerer med Gutenberg, men i så fall bør du se etter et nytt alternativ, eller bruke den klassiske editoren inntil utvikleren ordner opp.

Kan jeg fortsatt redigere eldre innlegg?

Dine gamle innlegg og sider er helt upåvirket av Gutenberg. Når du åpner noe som er laget med klassisk editor, vil Gutenberg åpne en blokk som inneholder den klassiske editoren. Derfra kan du trygt redigere de i den gamle editoren, eller konvertere de til blokker.

gutenberg konverter til blokker

Er Gutenberg det samme som en sidebygger?

Gutenberg har mange likheter i form av at den bruker blokker, men den har ikke like mange funksjoner som de beste sidebyggerne for WordPress. En sidebygger bruker også blokker, bare at noen av de kaller de for widgeter, moduler eller elementer.

Dessuten er Gutenberg en «backend» editor, mens de mest populære sidebyggerne er «frontend», hvor du kan se hvordan det endelige resultatet blir uten å bruke «forhåndsvisning».

Vil nettsiden min bli ødelagt hvis jeg installerer Gutenberg?

Gutenberg vil mest trolig ikke endre noe av det innholdet du allerede har publisert på nettsiden din. Hvis du har avansert innhold med mye egendefinert kode, kan du til fordel bruke staging (som alle de beste webhotell-leverandørene tilbyr) for å teste først.

Har du spørsmål eller tilbakemeldinger, hører vi gjerne fra deg i kommentarfeltet nedenfor, eller bruk kontaktskjemaet. Vi svarer på alle henvendelser.

Kanskje du liker

Skriv en kommentar

* Vennligst gjør deg kjent med vår personvernerklæring.

Vi benytter cookies for utvidet funksjonalitet, bedre nettleser-opplevelse, statistikk og målrettede annonser. OK Les mer

HOLD DEG OPPDATERT

MELD DEG PÅ NYHETSBREV

Sendes ut ca. hver 3. måned.