Hur man markerar text i WordPress (nybörjarguide)

Kommer du ihåg att du använde en gul överstrykningspenna för att markera viktiga passager i läroböcker? Det digitala motsvarigheten i WordPress är lika användbart för att få viktig information att sticka ut på din webbplats.

Men många nybörjare inser inte hur enkelt det är att lägga till denna formatering i sitt innehåll.

Under hela tiden vi drivit WPBeginner har vi märkt att enkla tekniker som textmarkering ofta gör störst skillnad i hur läsare engagerar sig i innehåll.

När den används strategiskt kan markerad text guida besökare till dina viktigaste punkter och förbättra minnesåterkallningen av budskapet.

I den här guiden visar vi dig flera enkla metoder för att markera text i WordPress.

Varför och när man ska markera text i WordPress

Textmarkering är ett enkelt sätt att betona viktig information i ditt innehåll. Det riktar användarens uppmärksamhet mot detaljer som du inte vill att de ska missa.

Till exempel kommer att markera ett rabatterbjudande på din WordPress-webbplats i en annan färg att dra läsarens uppmärksamhet till det, vilket hjälper dig att generera mer försäljning.

Här är ett exempel på hur textmarkering kan se ut i ett blogginlägg:

Att markera text i en annan färg kan också hjälpa användare med synnedsättning eller lässvårigheter att navigera och förstå innehållet lättare. Det kan till och med förbättra utseendet på ditt innehåll och göra det mer visuellt tilltalande.

Att markera för mycket text på din sida kan dock vara distraherande och minska dess effektivitet. Därför rekommenderar vi att du bara markerar viktig informationstext som uppmaningar till handling, varningar och andra detaljer som läsarna bör uppmärksamma.

Med det sagt, låt oss titta på hur man enkelt markerar text i WordPress. Du kan använda snabblänkarna nedan för att hoppa till den metod du vill använda:

• Metod 1: Markera text i WordPress med hjälp av blockredigeraren
• Metod 2: Markera text i WordPress med WPCode (rekommenderas)
• Bonus: Använd SeedProd för att markera viktiga sidor på din webbplats

Metod 1: Markera text i WordPress med hjälp av blockredigeraren

Denna metod är för dig om du enkelt vill markera text i WordPress med hjälp av blockredigeraren (Gutenberg).

Först måste du öppna ett befintligt eller nytt inlägg i innehållsredigeraren från sidofältet i WordPress-administrationen.

Väl där, markera helt enkelt den text du vill markera och klicka på ikonen 'Mer' i blockverktygsfältet högst upp. Detta öppnar en rullgardinsmeny där du måste välja alternativet 'Markera' från listan.

Ett färgvalverktyg kommer nu att öppnas på din skärm. Härifrån måste du först växla till fliken 'Bakgrund'.

Välj därefter en standardfärg för markering från de givna alternativen.

Du kan också välja en anpassad färg för att markera text genom att klicka på alternativet ‘Anpassad’ för att starta ett ‘pipett’-verktyg.

Glöm slutligen inte att klicka på knappen ‘Publicera’ eller ‘Uppdatera’ för att spara dina ändringar.

Du kan nu besöka din WordPress-blogg för att se den markerade texten i aktion.

Metod 2: Markera text i WordPress med WPCode (rekommenderas)

Om du vill använda en specifik färg konsekvent för att markera text över hela din WordPress-webbplats, då är denna metod för dig.

Du kan enkelt markera text i WordPress genom att lägga till CSS-kod i dina temafiler. Men det minsta felet när du anger koden kan bryta din webbplats och göra den otillgänglig.

Därför rekommenderar vi att använda WPCode, som är det bästa pluginet för kodsnuttar för WordPress på marknaden.

Efter noggranna tester har vi funnit att det är det enklaste och säkraste sättet att lägga till kod på din webbplats utan att direkt redigera dina temafiler. För detaljer, se vår WPCode-recension.

Skapa ett kodavsnitt med WPCode

Först måste du installera och aktivera pluginet WPCode. För fler instruktioner, se vår nybörjarguide om hur man installerar ett WordPress-plugin.

Efter aktivering, gå till sidan Kodavsnitt » + Lägg till avsnitt från WordPress admin sidofält.

Klicka sedan bara på knappen ‘+ Lägg till anpassad kodsnutt’ under alternativet ‘Lägg till din anpassade kod (ny kodsnutt)’.

Sedan behöver du välja en kodtyp. För den här handledningen, välj alternativet 'CSS-kodavsnitt'.

Lägg sedan till ett lämpligt namn för din kodsnutt.

Detta tar dig till sidan 'Skapa anpassad snutt', där du kan börja med att skriva ett namn för din kodsnutt.

Namnet är endast för din referens och kan vara vad som helst för att hjälpa dig att komma ihåg vad koden är till för.

Kopiera och klistra sedan in följande kod i rutan 'Kodförhandsgranskning':

mark {
background-color: #ffd4a1;
}

När du har gjort det, lägg till hexkoden för din föredragna markeringsfärg bredvid raden background-color i koden.

I vårt exempel använder vi #ffd4a1, vilket är en ljusbrun färg.

Skrolla sedan ner till avsnittet ‘Infogning’.

Välj här metoden ‘Automatisk infogning’ för att köra koden vid aktivering.

Gå sedan till toppen av sidan och byt omkopplaren från 'Inaktiv' till 'Aktiv'.

Klicka slutligen på knappen 'Spara kodavsnitt' för att spara dina ändringar.

Markera text i blockredigeraren

Nu när CSS-kodavsnittet har aktiverats måste vi lägga till lite HTML-kod i WordPress-redigeraren för att markera texten på webbplatsen.

Öppna först ett befintligt eller nytt inlägg i WordPress blockredigerare.

Härifrån klickar du på ikonen 'Alternativ' i blockverktygsfältet högst upp. Detta öppnar en ny rullgardinsmeny där du måste välja alternativet 'Redigera som HTML'.

Du kommer nu att se blockinnehållet i HTML-format.

Här, slå bara in texten du vill markera inom <mark> </mark> taggarna så här:

<mark>highlighted-text</mark>

Detta kommer att markera texten i hexfärgen som du valde i ditt WPCode-utdrag.

Därefter klickar du på alternativet 'Redigera visuellt' i blockets verktygsfält för att växla tillbaka till den visuella redigeraren.

När du är klar, klicka på knappen 'Uppdatera' eller 'Publicera' för att spara dina ändringar.

Nu kan du besöka din webbplats för att se den markerade texten i aktion.

Bonus: Använd SeedProd för att markera viktiga sidor på din webbplats

Förutom att markera text i dina blogginlägg kanske du också vill markera viktiga sektioner på din WordPress-webbplats, som kontaktformuläret eller en presentkupong.

Till exempel, om du har en onlinebutik och precis har lanserat en säsongsbunden rea, kanske du vill markera det erbjudandet på din webbplats.

Du kan markera dessa sektioner genom att skapa landningssidor för dem. Dessa är fristående sidor på din webbplats som är utformade för att generera leads.

För att skapa visuellt tilltalande landningssidor för din webbplats rekommenderar vi att du använder SeedProd. Det är den bästa WordPress-landningssidbyggaren på marknaden som kommer med en dra-och-släpp-byggare, 350+ färdiga mallar och 90+ block.

Flera av våra partner varumärken har skapat hela sina webbplatser med det, och de har haft fantastiska upplevelser. För detaljer, se vår SeedProd-recension.

Pluginet gör det enkelt att skapa attraktiva landningssidor som lyfter fram viktiga sektioner på din webbplats, som ett kontaktformulär, rekommendationsmeddelanden, tävlingar, kundrecensioner, optin-formulär, inloggningssidor och mer.

Utöver det kan du också använda SeedProd för att skapa anpassade teman, kommande sidor, underhållssidor och mycket mer.

För detaljer kan du se vår handledning om hur man skapar en landningssida i WordPress.

Vi hoppas att den här guiden hjälpte dig att lära dig hur du markerar text i WordPress. Du kanske också vill se vår steg-för-steg-guide om hur du anpassar färger i WordPress för att göra din webbplats mer estetiskt tilltalande och vår jämförelse av de bästa AI-webbplatsbyggare för WordPress.

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