Läs mer-knappen – lägga till en och bästa praxis

Vad är en Läs mer-knapp och varför är den användbar?

Läs mer-knappen som ett webbplatselement som låter dig trunkera innehåll så att bara en del av innehållet visas. Den används också för att växla mellan att visa och dölja innehåll, till exempel när en webbplats har en betalvägg på vissa innehållssidor.

Den kan även användas på FAQ-sidor där endast en del av svaret visas och läsaren måste klicka på “läs mer” för att se resten av svaret, eller i sökmotorresultat där endast en del av metabeskrivningen visas.

När en knapp används på detta sätt kallas den för dragspel.

Exempel på dolt innehåll. Källa: https://hbr.org/

Ett exempel på ett dragspel:

Knappen Läs mer används också i e-postmeddelanden som visas i följande bild:

Bildkälla: PostPlanner

Knappen Läs mer representeras vanligtvis som en knapp, ikon, pil eller hyperlänk. Ibland kan det vara en kombination av en knapp/ikon och en hyperlänk.

Den här knappen kan också gå till en annan sida, så att läsaren kan interagera med webbplatsen och dess innehåll.

Läs mer Bästa metoder för knappar

Din läs mer-knapp måste sticka ut från resten av ditt innehåll. Det måste också vara i linje med ditt varumärke. Här är de bästa metoderna att följa när du skapar läs fler-knappar:

Textens läsbarhet

Se till att texten på din knapp är läsbar och tillräckligt stor, eftersom det gör den mer synlig. Textstorleken bör vara lagom stor så att användarna kan läsa knappen.

Men gå inte överbord, för text som är för stor kommer att se konstig ut och användaren kanske inte ens vill klicka på den.

Bildkälla: GoSquared

Användning av kontrast

Din Läs mer-knapp måste sticka ut, och kontrast är ett säkert sätt att uppnå detta. Den här webbplatsen använder en “Fortsätt läsa”-knapp istället för en “läs mer”-knapp för att guida sina användare genom nästa steg.

Den här knappen sticker ut från resten av innehållet. Den har en lila kant som gör det lätt att upptäcka användaren. Den har också mycket vitt utrymme runt sig.

Källa: CopyBlogger

Ord som fungerar

Även om det inte är något fel i sig med att använda ordet “läs mer”, rekommenderas det att använda ord som inspirerar till omedelbar handling eftersom de är brådskande. Du kan använda mer brådskande och trigga ord som “Läs mer för att förbättra din SEO” osv.

Här är exempel på påståenden du kan använda i en “Läs mer”-knapp:

• Läs nu
• läs obegränsat med artiklar bara idag
• Läs obegränsat med artiklar medan erbjudandet gäller
• Dra nytta av dagens obegränsade innehållserbjudande

Ord som hänvisar till exklusivitet är också användbara. Exempel på detta är “exklusiv”, “prenumerantlista” och “medlemmar”. Ett exempel på en uppmaning kan vara “gå med i exklusiva medlemmar för att läsa mer”.

Lägger till förmåner

Att lägga till en förmån uppmuntrar också användaren att vidta åtgärder. Du kan till exempel ta med en förmån som “läs mer och få en gratis e-bok”.

Detta kommer att uppmuntra dina läsare att faktiskt klicka på knappen Läs mer och läsa vidare för att dra nytta av fördelarna, särskilt om de redan njuter av innehållet de redan har interagerat med.

Håll det kort och gott

Vi nämnde att att lägga till en förmån kommer att inspirera dina läsare att vidta åtgärder, men att använda några få ord är idealiskt. Håll texten på knappen “Läs mer” mellan 2 och 5 ord.

Ett sätt att förkorta knapptexten är att använda “klicktriggers”. Låt oss titta på dessa härnäst.

Använd klicktriggers

Det här är ytterligare knapptext som hjälper dig att kommunicera fördelarna. Din huvudknappstext kan vara “läs mer” och din klicktrigger “skaffa din gratis e-bok”.

Texten på huvudknappen måste vara större och mer läsbar. Klickavtryckaren är mycket mindre.

Mobilen först

När du designar en “Läs mer”-knapp är det viktigt att först designa för mobilen. Google började använda mobil-först indexeringFrån 1 juli 2019. Det betyder att din Läs mer-knapp måste se bra ut på en mobil enhet.

Det måste också vara lätt att använda, med tanke på att användare på skärmar “rör” skärmen och inte använder möss eller bärbara pekplattor. Knappen måste vara tillräckligt stor för att de kan “röra” den utan att behöva nypa skärmen för att förstora den.

En storlek på minst 48 x 48 dp (densitetsoberoende pixlar) är idealisk för mobila enheter. Avståndet mellan knapparna måste vara minst 8 dp. Mer information: design för mobilgränssnitt i den här artikeln.

Anpassa

När knapptexten är mer unik är det mer sannolikt att användarna klickar. Du kan till exempel använda “läs mer”-text som “få en gratis e-bok” istället för det vanliga “läs mer”.

Detta är inte bara användbart, utan mer personligt. Det kan uppnå en högre klickfrekvens än “få en gratis e-bok”.

Stanna i Flow

Din läs mer-knapp bör hålla sig inom användarens naturliga läsflöde. Användare läser uppifrån och ner och från vänster till höger. Placera en “läs mer”-knapp till höger eller längst ned i ett specifikt utdrag.

Det viktigaste är att placera knappen där den är lätt att hitta. Läsarna behöver inte scrolla för långt för att hitta den.

Hur man lägger till “Läs mer”-knappar i WordPress

WordPress 5.0 har en ny funktion som låter dig enkelt lägga till knappar i WordPress. Den nya blockredigeraren (Gutenberg) har ett inbyggt knappblock som gör det enkelt att skapa en “läs mer”-knapp. Gör det här:

• Logga in på din instrumentpanel
• Gå till meddelanden
• Du kan också redigera ett befintligt meddelande

• Lägg till ett Gutenberg-block där du vill visa en “Läs mer”-knapp
• Klicka på plusikonen för att lägga till ett nytt element

• Under layoutelementen väljer du knappblocket som visas i följande bild:

• Knappen läggs till i ditt meddelande enligt följande:

• Redigera texten “läs mer”
• Klistra in länken du vill att knappen ska lösa

• Designa knappen ytterligare genom att välja dess justering, färg och stil.

Så här kommer knappen se ut till slut:

Om du inte har Gutenberg

Du kan fortfarande lägga till en “läs mer”-hyperlänk för att fungera som en knapp. Gör det här:

• Logga in på din instrumentpanel
• Gå till meddelanden
• Skapa sedan ett nytt meddelande
• Du kan också redigera ett befintligt meddelande
• Placera muspekaren där du vill ha läs mer-knappen
• Klicka på redigerarens visuella alternativ och välj följande ikon:

• Ditt meddelande kommer att delas upp enligt följande: orden MER kommer att visas, följt av texten som ska döljas.

• Standardtexten är “fortsätt läsa”, men du kan ändra den till “läs mer”.

Alternativt

• När du har tillgång till ett befintligt inlägg eller har börjat skapa ett nytt kan du välja HTML-alternativet i editorn enligt följande:

• Placera markören där du vill att avsnittet “läs mer” ska visas så småningom
• Välj Mer i HTML-redigeraren
• Det skapar en tagg så här:
• Redigera den “läs mer”
• Se till att den här taggen placeras utanför andra HTML-taggar för att undvika formateringsproblem

Notera:

• När du använder Read More-taggen i WP måste du upprepa proceduren ovan för vart och ett av dina inlägg eller sidor.
• Knappen visas bara på huvudsidor, som startsidan eller meddelandesidan, inte på ett enskilt meddelande, som:

Andra alternativ

• Använda och styla HTML med CSS
• Använd korta koder
• Användning av tillägg

Vi kommer att undersöka de två sista.

Använder korta koder

Du kan använda ett plugin som Max knappar för att generera kortkoder för din WordPress-webbplats. Gör det här:

• Få åtkomst till din WordPress-instrumentpanel
• Gå till tillägg
• Sök efter MaxButtons och ladda ner den
• Aktivera tillägget
• Välj “Lägg till nytt” från plugin-instrumentpanelen.
• Detta tar dig till knappredigeraren.

• Du kan sedan lägga till “läs mer”-texten och länken du vill att den ska lösas till.
• Designa knappen som du vill
• Du kan förhandsgranska ändringar i liveförhandsgranskningsknappen när du gör dem.

• Spara-knappen
• Gå tillbaka till MaxButton-instrumentpanelen och du kommer att se den genererade kortkoden.

• Kopiera och klistra in kortkoden var du vill i ditt meddelande eller sida
• Du bör se knappen på ditt inlägg eller sida när det har publicerats.

Nackdelen med den här metoden är att om du vill lägga till en knapp med en annan stil än den du precis angav, måste du redigera varje specifik knapp.

Använder plugins

Plugin som Glöm kortkoden knappar är användbara eftersom du inte behöver använda kortkoder.

• Installera och aktivera tillägget
• Skapa en ny sida eller artikel
• I den visuella redigeraren väljer du knappen Lägg till

• Lägg till knapptexten och webbadressen som du vill att knappen ska mappas till
• Designa dina knappar som du vill. Välj ikon, färg, storlek och justering
• Lägg upp ditt nya eller uppdaterade inlägg

En exempelknapp kan se ut så här:

Effekten av “läs mer”-knappen på sökmotoroptimering

Knappen “läs mer” är viktig för både användare och SEO. Här är flera anledningar:

Resultat för enklare webbplatsnavigering

När din läsare trycker på “Läs mer”-knappen har de redan läst ett utdrag eller en sammanfattning av ditt innehåll, vilket väcker deras nyfikenhet. Den här knappen gör det lättare för dem att ta nästa steg.

Användaren vill veta vad som händer härnäst, och knappen “Läs mer” leder dem till “andra sidan av historien” där användarens nyfikenhet tillfredsställs.

Resultatet är en högre ranking i SERP:erna

“Läs mer”-knappar kan användas för att uppmuntra användare att använda mer av ditt innehåll och tillbringa mer tid på din webbplats.

Google är också medvetet om hur mycket tid som spenderas på webbplatsen på grund av avvisningsfrekvensen, så detta kan indirekt hjälpa din webbplats att rankas högre och till och med förbättra din ranking.

Resultatet är en mer visuellt tilltalande webbplats

Att använda en “läs mer”-knapp kommer att göra din webbplats mer attraktiv. Istället för att behöva inkludera all information på en sida kan du bara visa det som är viktigt och styra användaren att komma åt mer innehåll.

Källa: AVG

Påverkar klickfrekvensen

Knappen “läs mer” påverkar klickfrekvensen (klickfrekvensen). Användare får möjlighet att interagera med ditt innehåll och erbjudande och är fortfarande redo att vidta ytterligare åtgärder, som att registrera sig eller göra ett köp.

“Läs mer” fungerar som förebådaren för “den bästa uppmaningen till handling”. Till exempel, om ditt mål är att få folk att begära en offert, kommer en “Läs mer”-knapp att hjälpa dina användare till mer innehåll som i slutändan leder till slutmålet.

Komprimerad

Vi har tittat på knappen “Läs mer”, dess betydelse och bästa praxis för att implementera den effektivt på din webbplats. Trots att du tittar på de bästa metoderna ovan måste du hela tiden testa vad som fungerar för ditt varumärke och vad som inte gör det. Så småningom kommer du att få rätt mix för dig.