Hur man lägger till en radbrytning i WordPress (nytt radavstånd)

Har du märkt hur vissa webbplatser har perfekt avstånd mellan innehållet som är lätt att skanna, medan andra känns trånga och svårlästa?

Hemligheten handlar ofta om något enkelt: att använda nya rader och mellanrum effektivt.

Om du någonsin har lagt till radbrytningar i din WordPress-redigerare bara för att upptäcka att de inte visas på din publicerade sida, är du definitivt inte ensam. WordPress hanterar avstånd lite annorlunda än ordbehandlare som Google Docs eller Microsoft Word.

När du väl förstår hur det fungerar, har du dock fullständig kontroll över hur ditt innehåll ser ut.

Vi visar dig flera pålitliga metoder för att lägga till radbrytningar i WordPress, från snabba kortkommandon till mer avancerade formateringsalternativ.

Låt oss börja med de enklaste sätten att lägga till en radbrytning.

Varför lägga till ett radbrytning i WordPress (nytt radavstånd)?

Vid första anblicken kan ett radbrytning verka som ett litet formateringsval – men det kan ha stor inverkan på hur ditt innehåll presterar.

Från att förbättra läsbarheten till att öka användarupplevelsen, hjälper korrekt avstånd dina sidor att se rena och professionella ut. Här är varför det är viktigt:

• Bättre läsbarhet: Bryter upp textväggar för enklare skanning.
• Mobilvänligt: Håller innehållet tydligt på mindre skärmar.
• Rensar klistrad text: Rengör formatering från andra källor.
• Väcker uppmärksamhet: Hjälper tips och CTA:er att sticka ut.

Kort sagt, radbrytningar gör ditt innehåll lättare att läsa och mer engagerande – både för besökare och sökmotorer.

Med det sagt, låt oss titta på hur du enkelt lägger till en radbrytning i WordPress.

Hur man lägger till en radbrytning i WordPress (snabba metoder)

I WordPress kan du enkelt lägga till radbrytningar med ditt tangentbord. För att skapa ett dubbelt radavstånd (nytt stycke), tryck helt enkelt på Enter -tangenten (eller Return på Mac).

För ett enkelt radavstånd inom samma stycke, håll ner Shift + Enter (eller Shift + Return på Mac). Detta är de snabbaste sätten att kontrollera avstånd i blockredigeraren.

Hur man lägger till ett nytt stycke (standardavstånd)

När du trycker på Enter-tangenten (Windows) eller Return-tangenten (Mac) på ditt tangentbord skapar du vad som ofta kallas en "hård retur" eller en ny styckebrytning.

WordPress skapar ett nytt stycke. Som standard lägger ditt tema till lite vertikalt utrymme mellan stycken, vilket hjälper till att separera dina tankar och göra innehållet lättare att läsa.

Den exakta mängden av detta mellanrum styrs av ditt temas design.

Gå bara till innehållseditor, tryck på Enter- eller Retur-tangenten efter raden och skriv sedan något annat på nästa rad.

Genom att bara göra det, baserat på din temas stil, bör du se en tydlig åtskillnad mellan stycken.

Hur man lägger till ett enkelt radavstånd (mjuk retur / radbrytning inom stycke)

Om du skriver något som en adress eller en dikt och vill ha en enkelradig radbrytning utan att starta ett nytt stycke, behöver du använda en "mjuk retur".

I det här fallet måste du trycka på tangenterna SHIFT + ENTER på Windows eller SHIFT + RETURN på Mac.

Detta talar om för WordPress att du vill starta en ny rad men behålla den som en del av samma stycke.

Denna åtgärd skapar en "mjuk radbrytning" eller enskild radbrytning (med hjälp av en HTML <br> tagg), vilket innebär att det inte blir något extra vertikalt utrymme som du får med ett nytt stycke.

Det är en användbar metod för att rensa text som klistrats in från andra källor som kan ha överdrivna dubbla radbrytningar; ta helt enkelt bort de extra styckebrytningarna och infoga enskilda radbrytningar med Shift + Enter efter behov.

Lägga till anpassat vertikalt mellanrum med Spacer Block

För ett enkelt sätt att lägga till extra utrymme mellan två block utan kod, är det inbyggda "Spacer"-blocket en mycket intuitiv metod. Det ger exakt visuell kontroll direkt i redigeraren.

Klicka helt enkelt på knappen 'Lägg till block' i redigeraren för att lägga till ett nytt block och sök efter 'Spacer'. När du har lagt till det kommer ett nytt tomt utrymme att visas på din sida.

Du kan sedan klicka på avståndsskaparen och dra det blå handtaget uppåt eller nedåt för att justera dess höjd.

Detta ger dig exakt kontroll över ditt vertikala avstånd direkt i redigeraren.

Justera standardradhöjd och styckeavstånd

Ibland, även när du lägger till rätt radavstånd i redigeraren, visas det inte som du vill i ditt tema.

Det finns två sätt att åtgärda det:

1. Använda ett plugin (det enkla sättet)
2. Manuellt med CSS-kod (mer avancerat)

Låt oss titta på den enkla metoden först.

Lägga till radavstånd med en plugin

Om du vill göra stiländringar i ditt tema utan att behöva lära dig kod, är det ett bra sätt att använda ett plugin som CSS Hero. Detta beror på att pluginet litar på av över 100 000 webbplatser för sin intuitiva visuella redigerare.

CSS Hero är specifikt utformat för nybörjare och icke-kodare, vilket gör att du visuellt kan ändra din WordPress-webbplats design med några få klick – en funktion som hyllas mycket i dess genomsnittliga betyg på 4,8/5 stjärnor.

Du kan se mer information i vår fullständiga recension av CSS Hero.

För mer omfattande strukturella ändringar av ditt tema, som att flytta en sidopanel eller lägga till en sidfot, erbjuder ett dra-och-släpp-sidbyggarplugin mer omfattande visuell kontroll och dedikerade verktyg. Detta gör det till ett mer lämpligt alternativ för dessa uppgifter.

Vill du inte använda ett plugin, eller bara göra den här enda ändringen? Då kan alternativet med manuell CSS-kod vara bäst för dig.

Ändra styckeavstånd manuellt med CSS-kod

För att lägga till radbrytningar manuellt utan ett plugin behöver du lägga till lite CSS till ditt tema.

CSS (Cascading Style Sheets) är ett språk som talar om för webbläsare hur de ska visa din webbplats innehåll.

Tänk på det som en uppsättning instruktioner för styling, snarare än att klicka på knappar som i Microsoft Word. Det är inte så skrämmande som det låter och är ganska lätt att förstå när du väl greppat grunderna.

För att lägga till anpassad CSS till ditt tema behöver du besöka sidan Utseende » Anpassa. Detta startar WordPress temaanpassare, där du behöver klicka på fliken 'Ytterligare CSS' från den vänstra kolumnen.

Om du inte ser dessa menyalternativ kan du använda ett blocktema. Se vår artikel om hur du åtgärdar saknad temaanpassare i WordPress-admin.

I rutan för anpassad CSS måste du lägga till följande CSS-kod:

.post p{line-height: 1.5em;}

Denna regel ökar utrymmet mellan rader inuti varje stycke, vilket gör ditt innehåll lättare att läsa.

Tänk på att denna kod förutsätter att ditt tema använder .post för blogginnehåll. Om inget ändras efter att du har lagt till den, försök att ersätta .post med .entry-content istället.

Om du är osäker på vilken din tema använder kan du kontrollera genom att öppna ett blogginlägg, högerklicka inuti texten och välja Inspektera. Leta sedan efter klassen för huvudinnehållsomslaget (som .post eller .entry-content).

Observera att denna line-height -egenskap endast justerar det vertikala utrymmet mellan textrader inom varje stycke, inte utrymmet mellan hela stycken.

Om du vill öka det vertikala utrymmet mellan stycken i WordPress, skulle du vanligtvis lägga till padding-bottom till dina stycke-element.

.post p { 
line-height: 1.5em;
padding-bottom: 15px;
} 

Justera gärna siffrorna i denna CSS-kod. Att ändra padding-bottom -värdet kommer att ändra utrymmet mellan dina stycken.

Du kan också lägga till anpassad CSS på din webbplats med hjälp av WPCode-pluginet. Det används av över 1,5 miljoner webbplatser och har ett betyg på 4,9/5 stjärnor på WordPress.org för att göra kodinfogning superenkel.

För mer information, se vår guide om hur du lägger till anpassad CSS till din WordPress-webbplats.

Om du inte gillar att läsa instruktionerna, titta bara på vår videoguide.

Videohandledning

För en visuell genomgång kan du titta på vår videoguide nedan. Den täcker alla metoder vi har diskuterat för att lägga till enkel- och dubbelradsavstånd i ditt innehåll.

Vanliga frågor om att lägga till en radbrytning i WordPress

Här är några frågor som våra läsare ofta har ställt om att lägga till en radbrytning i WordPress:

Hur gör man 1,15 radavstånd i WordPress?

Du kan ställa in 1,15 radavstånd genom att lägga till anpassad CSS i ditt barntema eller använda ett kodavsnittsprogram som WPCode. Använd till exempel line-height: 1.15; för textelementen du vill justera.

Detta ger dig exakt kontroll eftersom WordPress inte inkluderar detta alternativ som standard.

Är 1,5 och 1,15 radavstånd samma?

Nej, 1,5 och 1,15 avstånd är olika. En 1,5 radhöjd skapar mycket mer utrymme mellan rader, medan 1,15 håller texten tätare och mer kompakt.

Hur lägger man till anpassat radavstånd i WordPress?

Du kan lägga till anpassat radavstånd med hjälp av CSS eller en inställning i blockredigeraren. I de flesta fall är det enklaste metoden att lägga till ett line-height-värde i din temaanpassare eller ett CSS-plugin.

Vad är skillnaden mellan en avdelare och en radbrytning i WordPress?

En avdelare lägger till en synlig linje eller ett utrymme mellan sektioner, medan en radbrytning helt enkelt flyttar text till nästa rad utan att lägga till extra visuella element.

Hur åtgärdar man oönskade radbrytningar i WordPress-titlar?

Ibland kan din WordPress-inläggs- eller sidtitel brytas på flera rader på ett obekvämt sätt. Detta beror vanligtvis på ditt tema och det tillgängliga utrymmet i titelområdet.

I de flesta fall bryter WordPress automatiskt långa titlar för att passa layouten. Men om du vill ha mer kontroll kan du justera det med CSS.

Till exempel kan du förhindra radbrytningar i titlar genom att lägga till:

.entry-title {  white-space: nowrap;}

Detta kommer att hålla titeln på en enda rad, men var försiktig – mycket långa titlar kan flyta över på mindre skärmar. Ett bättre tillvägagångssätt är vanligtvis att förkorta titeln eller justera ditt temas typografiinställningar istället för att tvinga den till en enda rad.

Vi hoppas att den här artikeln hjälpte dig att lägga till en radbrytning i WordPress. Du kanske också vill se vår guide om hur du använder WordPress blockmönster och vår lista över de bästa Gutenberg-vänliga WordPress-teman.

Om du gillade den här artikeln, prenumerera gärna på vår YouTube-kanal för WordPress-videoguider. Du kan också hitta oss på Twitter och Facebook.