Introduktion till WordPress nya redigerare

WordPress nya blockredigerare, tidigare känd som Gutenberg, har släppts. Anders ger dig fem tips på du kommer igång så snabbt som möjligt.

Om du är duktig på att hålla dina WordPress-sajter uppdaterade så la du säkert märke till att innehållsredigeraren nyligen började se lite annorlunda ut. Den 6 december släpptes version 5.0 av WordPress, och den stora nyheten är den nya blockredigeraren – tidigare känd som Gutenberg. Du hittar mer information om hur du uppdaterar, och om vad du bör tänka på innan du trycker på knappen, i det här blogginlägget.

Den nya blockredigeraren är den största förändringen av hur man jobbar med innehåll i WordPress historia, och om du har använt WordPress ett tag så kommer det att bli en stor omställning. Men den nya redigeraren, och dess nya blockstruktur, för också med sig många nya möjligheter. I den här guiden delar vi med oss av ett par tips som hjälper dig bli produktiv i den nya redigeraren så snabbt som möjligt.

Hitta rätt i nya gränssnittet

Den första utmaningen i den nya redigeraren är att saker inte ligger de brukade ligga – åtminstone inte vid en första anblick. Själva innehållet ligger fortfarande i mitten av sidan, och inställningar för publicering, kategorier, taggar, och utvald bild ligger fortfarande i den högra sidokolumnen. Gränssnittselementet som saknas är verktygsraden – raden med ikoner där man anger fet/kursiv stil, lägger till länkar, och så vidare.

I den klassiska WordPress-redigeraren visas hela tiden en verktygsrad i toppen av fönstret, snarlikt det upplägg som används i traditionella ordbehandlingsprogram som Microsoft Word. I blockredigeraren visas verktygsraden bara när du aktivt jobbar med innehåll, och verktygen som ligger i verktygsraden anpassas efter den typ av innehåll som du jobbar med. Om du klickar i innehållsrutan, skriver lite text och för muspekaren över texten som du har skrivit, så visas verktygsraden ovanför blocket.

Verktygsraden för ett paragrafblock.

Om du gör en radbrytning, klickar på plus-ikonen och väljer ”Bild”-blocket så får du istället upp verktygsraden för det blocket. I bildblockets verktygsrad kan du ange hur bilden ska vara placerad i innehållet. För muspekaren över varje ikon för att se vilka placeringar du kan välja mellan. Varje block har en egen verktygsrad med egna inställningar, och det enklaste sättet att bekanta sig med dem är att experimentera.

Du kan också välja att visa verktygsraden i toppen av skärmen, om den känns distraherande när du jobbar med innehållet. För muspekaren till ikonen med de tre prickarna högst upp till höger på sidan, klicka på den, och bocka för alternativet ”Verktygsfält i toppen”. Om du klickar på textparagrafen nu så visas verktygsraden i toppen av sidan istället.

Utforska möjligheterna med block

I den nya blockredigeraren är allt innehåll ett block. Ett stycke text? Ett block. En rubrik? Block. Bilder, videoklipp och listor? Block, block, block. Avsikten med den nya blockstrukturen är att göra det enklare att skapa mer komplexa sidlayouter, och det är det också – med lite träning. Du lägger till ett block genom att klicka på plus-ikonen i det övre vänstra hörnet av skärmen. Du kan också föra muspekaren över utrymmet mellan två block och klicka på det plustecknet för att lägga till ett block mellan de två blocken.

Om du vill ta bort ett block så för du muspekaren över det, klickar på ikonen med de tre prickarna i blockets verktygsrad, och klickar på ”Ta bort block”. Om du vill byta plats på ett block så får du muspekaren över det och klickar på ”Flytta upp” eller ”Flytta ner”-pilarna till vänster om blocket. Du kan också dra och släppa blocket till en ny plats genom att klicka och dra ikonen mellan pilarna.

Block-beslutsångest.

Blockredigeraren kommer med ett dussintal inbyggda block, indelade i olika kategorier: ”Vanliga block”, ”Formatering”, ”Layoutelement”, och så vidare. Blockredigaren kan förstås återskapa allt som den klassiska redigaren kunde göra, men den innehåller också block som ger den många nya möjligheter. I blockkategorin ”Widgetar” kan du till exempel infoga en lista med de senaste inläggen eller kommentarerna på din webbplats, och i kategorin ”Layoutelement” kan du lägga till en knapp med en valfri länk.

Tips: Om du vill lägga till block ännu snabbare så kan du göra en radbrytning och skriva ”/” följt av namnet på det block du vill lägga till. Markera blocket i listan, tryck på enter, och bingo – blocket är tillagt.

När du vill fokusera på skrivandet

Blockredigeraren gör det mycket enklare att skapa komplexa sidlayouter med flera kolumner, fullbreda bilder, citat, och mycket annat. Många gånger vill man dock fokusera på skrivandet, och eliminera så många distraktioner i gränssnittet som möjligt. Som tur är har blockredigeraren inställningar som hjälper oss att förbättra skrivupplevelsen lite.

Steg ett är att dölja den högra sidokolumnen, som innehåller inställningar för sidan/inlägget du jobbar med. Klicka på kugghjulet uppe i högra hörnet, så försvinner sidokolumnen och lämnar mycket mer utrymme till innehållet. Du kan alltid ange kategorier, etiketter och utvald bild när det är dags att publicera. Steg två är att gå in i blockredigerarens helskärmsläge, som döljer WordPress-administrationspanelen på den vänstra sidan av skärmen när du skriver. Det gör du genom att klicka på ikonen med de tre prickarna uppe till höger, och sedan klicka på ”Helskärmsläge”.

Nu börjar det likna något! När man jämför med bilderna högre upp i artikeln så är skillnaden på skrivupplevelsen markant. Som jag berättade högre upp i inlägget kan du också visa block-verktygsraden i toppen av skärmen istället för i anslutning till varje block, så att det inte poppar upp verktygsrader när du jobbar med dina texter. Det gör du genom att klicka på ikonen med de tre prickarna, och sedan på ”Verktygsfält i toppen”.

Om du vill ta det ytterligare ett steg så kan du aktivera blockredigerarens ”Spotlight-läge”, som minskar kontrasten på alla block förutom det du jobbar med. Du aktiverar det genom att klicka på ikonen med de tre prickarna och välja ”Spotlight-läge” i listan. Jag tycker inte att det tillför särskilt mycket, men du kan alltid ge det en chans.

Spotlight-läget.

Spara tid med sparade block

Beroende på vilken typ av innehåll du jobbar med så finns det säkert många layouter som du återkommer till. Om din arbetsplats har en blogg så kanske ni vill avsluta varje blogginlägg med en liten puff som uppmuntrar läsaren att kontakta er för mer information om era tjänster eller produkter. WordPress nya blockredigerare har en funktion som är byggd med det här behovet i åtanke. Den heter ”Återanvändbara block”, och den låter dig spara layouter bestående av flera block.

Låt oss ta ”Call to Action”-sektionen som exempel. Den här layouten innehåller följande block:

  • Paragraf
  • Avgränsare (skiljelinje)
  • Paragraf med svart bakgrundsfärg och vit textfärg
  • Knapp

Jag kommer att vilja avsluta varje blogginlägg med de tre sista blocken, och återanvändbara block-funktionen låter mig spara de tre blocken i en layout så att jag inte behöver skapa varje enskilt block manuellt varje gång jag skriver ett inlägg. Jag sparar blocken som en återanvändbar blocklayout genom att markera de tre blocken med musen, klicka på ikonen med de tre prickarna ovanför blocken, och välja ”Lägg till i återanvändbara block”. I namn-textfältet anger jag ”Call to Action”, och klickar på ”Spara”.

Vår Call to Action-layout, återanvänd i ett annat inlägg.

Nästa gång jag lägger till ett block på en sida eller i ett inlägg kommer blocket ”Call to Action” att vara valbart i blockkategorin ”Återanvändbar”. Call to Action-sektionen kan alltså läggas till i ett nytt blogginlägg med bara ett par knapptryck, och om jag bestämmer mig för att ändra innehållet i blocket så slår de ändringarna igenom i alla inlägg som använder det återanvändbara blocket. Smidigt.

”Det finns ett block för det”

Man kan komma långt med WordPress inbyggda block, men de stora möjligheterna med den nya blockredigeraren ligger i block som följer med i tillägg och teman. Använder ni e-handelstillägget WooCommerce? Installera tillägget WooCommerce Blocks, så kan du enkelt bädda in produkter och produktkategorier i inlägg och sidor. Kör ni Jetpack? Då kan du börja använda Jetpacks praktiska block för e-postformulär och inbäddade kartor. Blockredigeraren har också skapat en marknad för tillägg som Atomic Blocks, som innehåller samlingar med block som gör det enkelt att skapa mer komplexa layouter.

WordPress 5.0 och den nya blockredigeraren har bara varit ute i ett par veckor, och majoriteten av de största WordPress-tilläggen har redan börjat uppdateras med block som möjliggör ny design och funktionalitet. Utbudet är fortfarande ganska begränsat, men allt tyder på att block snart kommer att bli en lika självklar del av WordPress ekosystem som tillägg eller teman. Det är bara en tidsfråga innan frasen ”det finns ett block för det” blir det nya ”det finns ett tillägg för det”.


Vill du få ännu fler tips om WordPress nya blockredigerare, och samtidigt lära dig mer om hur du använder alla andra delar av WordPress? Min kollega Thord D. Hedengren jobbar just nu på en uppdaterad version av boken Webbpublicering med WordPress, som kommer att släppas som gratis e-bok nästa år. Boken innehåller allt du behöver veta för att navigera WordPress administrationspanel, oavsett om du använder WordPress på fritiden eller som en del av ditt arbete.

Anmäl dig till nyhetsbrevet på wpmwp.se, så får du ett e-postmeddelande när boken finns tillgänglig för nedladdning.