Hur man lägger till en teckenstorleksändrare i WordPress för tillgänglighet

Vi har lärt oss att de bästa webbplatserna är de som anpassar sig till sina användare, inte tvärtom. Ett av de mest effektiva sätten att göra detta är att lägga till en teckenstorleksjusterare som låter besökare anpassa textstorleken efter sin bekvämlighetsnivå.

Font-tillgänglighet gynnar alla – från användare med synnedsättning till personer som läser på olika enheter eller under olika ljusförhållanden.

När besökare enkelt kan anpassa textstorleken stannar de längre, läser mer och är mer benägna att engagera sig i ditt innehåll och vidta åtgärder på din webbplats.

I den här guiden visar vi dig exakt hur du lägger till en teckensnittstorleksändrare på din WordPress-webbplats. Vi har testat flera metoder och plugins för att hitta de mest pålitliga alternativen som fungerar med alla teman och inte saktar ner din webbplats.

Varför är det viktigt att lägga till text som kan ändras i storlek på din webbplats? 🤔

Om textstorleken är för liten på din webbplats, kommer folk att ha svårt att läsa dina artiklar och så småningom överge din webbplats.

Ett enkelt sätt att förbättra läsbarheten är att erbjuda besökare möjligheten att ändra storleken på huvudtexten på din webbplats. Detta gör att användare kan justera textstorleken efter eget tycke och spendera mer tid på din webbplats.

Även om du kan använda webbläsarens inbyggda zoomfunktion genom att trycka på tangenterna 'CTRL och +', ökar detta storleken på alla WordPress designelement på sidan, inte bara texten. Detta kan bryta webbplatsens layout och inte ge en bra användarupplevelse.

Med det sagt, låt oss se hur du enkelt kan lägga till skalbar text för dina besökare i WordPress. Du kan använda snabblänkarna nedan för att hoppa till en specifik metod:

• Metod 1: Lägg till WordPress Font Resizer med plugin och kod
• Metod 2: Använd WordPress tillgänglighetsplugin
• Gör din WordPress-webbplats ännu enklare att använda med dessa tips
• Videohandledning

Metod 1: Lägg till WordPress Font Resizer med plugin och kod

Ett enkelt sätt att låta användare ändra textstorleken på din webbplats är att använda ett WordPress-plugin för teckenstorleksändring för tillgänglighet som Accessibility Widget.

Det är ett gratis WordPress-plugin som låter dig lägga till ett alternativ i din webbplats sidopanel för att ändra textstorleken. Pluginet är lättviktigt och mycket enkelt att använda.

Det första du behöver göra är att installera och aktivera pluginet Accessibility Widget på din webbplats. Om du behöver hjälp, se vår guide om hur man installerar ett WordPress-plugin.

Efter aktivering går du helt enkelt till Utseende » Widget från WordPress adminpanel. Därefter kan du klicka på '+' -knappen och lägga till blocket 'Accessibility Widget' i din sidofält.

Därefter kan du ange en titel för widgeten, som 'Ändra textstorlek' eller 'Ändra textstorlek'.

Därefter måste du välja vilka HTML-element eller CSS-klasser som påverkas av widgeten. Standardalternativen är body, paragraph, list items och table cells. Dessa alternativ bör fungera för de flesta webbplatser.

Widgeten tillåter upp till fyra storleksändringsalternativ. Standardalternativen är 90%, 100%, 110% och 120%. Du kan öka eller minska teckensnittsstorlekarna genom att ange siffrorna i fältet 'Ange till dessa storlekar'.

Den sista widgetinställningen är kontrollertext, och detta är den text som användarna kommer att se. Du kan behålla standardprocenten för textstorleken eller använda en bokstav för att visa olika teckensnittsstorlekar.

När du är klar klickar du bara på knappen 'Uppdatera' för att spara dina widgetinställningar.

Du kan nu besöka din webbplats för att se widgeten i aktion. Så här ska widgeten visas i sidofältet på din webbplats:

Om du tycker att kontrolltexten inte är märkbar kan du ändra det med CSS.

För att göra detta, gå bara till din WordPress-admin och välj Utseende » Anpassa.

Du bör nu se några alternativ för att anpassa ditt klassiska tema.

Välj här 'Ytterligare CSS'.

Nu kan du lägga till lite CSS-kod för att styla widgeten.

Här är vad vi lade till:

.widget_accesstxt a {
border: 2px solid #000;
padding: 2px;
font-weight: bold;
}

Denna CSS kommer att lägga till en kantlinje runt kontrolltexten, göra den fetstil och lägga till lite stoppning. När du är nöjd med hur widgeten ser ut, klickar du bara på 'Publicera'.

För mer information, se vår guide om hur man lägger till anpassad CSS i WordPress.

Metod 2: Använd WordPress tillgänglighetsplugin

Ett annat enkelt sätt att låta användare ändra storlek på texten på din webbplats är att använda WP Accessibility. Detta plugin låter dig lägga till en verktygsfält på din webbplats för att ändra textstorleken, oavsett vilket tema du använder.

Det första du behöver göra är att installera och aktivera WP Accessibility-pluginet på din webbplats. Du kan se vår guide om hur man installerar ett WordPress-plugin om du behöver hjälp.

Efter aktivering, gå helt enkelt till sidan WP Accessibility från WordPress adminpanel.

I avsnittet 'Tillgänglighetsverktygsfält' klickar du på alternativet 'Aktivera tillgänglighetsverktygsfält' och väljer 'Teckenstorlek'. Detta lägger till en teckenstorleksjusterare i verktygsfältet.

Vid behov kan du även aktivera alternativen Kontrast och Gråskala.

Dessutom kan du ändra teckensnittsstorleken på innehållet när verktygsfältet klickas på. Du kan också bara välja 'Standardstorlek' i rullgardinsmenyn om du är osäker på vad du ska välja.

Utöver det rekommenderar vi att aktivera alternativet 'Använd alternativ stilmall för teckensnittsstorleksändring'. När detta alternativ är aktiverat kan användare enkelt växla mellan standardteckensnittsstorlekar och en större, mer läsbar version av texten.

Aktivera gärna andra inställningar i pluginet.

När du är klar klickar du bara på knappen 'Uppdatera verktygsfältets inställningar'.

Det var allt!

Här är hur vårt verktygsfält för teckenstorleksändring ser ut på frontend:

För mer information kan du läsa vår guide om hur du förbättrar din WordPress-webbplats tillgänglighet.

Gör din WordPress-webbplats ännu enklare att använda med dessa tips

Vill du göra din webbplats enklare att använda och snyggare? Kolla in dessa hjälpsamma guider:

• Hur man lägger till piltangentsnavigering i WordPress – Gör det enklare för folk att navigera på din webbplats.
• Hur man anpassar färger på din WordPress-webbplats – Välj rätt färger för att få din webbplats att se bra ut och vara lätt att läsa.
• Hur man lägger till en förladdningsanimation till WordPress (steg för steg) – Lägg till en cool laddningsskärm till din webbplats.
• Hur man enkelt lägger till mörkt läge på din WordPress-webbplats – Låt användare växla till ett mörkare tema om de föredrar det.
• Sätt att skapa en mobilvänlig WordPress-webbplats – Se till att din webbplats fungerar bra på telefoner och surfplattor.
• Hur du får feedback på webbplatsdesign i WordPress (steg för steg) – Lär dig hur du frågar folk vad de tycker om din webbplats design.
• Hur man markerar text i WordPress (nybörjarguide) – Lär dig att få viktiga ord att sticka ut på dina sidor.

Videohandledning

Vi hoppas att den här artikeln hjälpte dig att lägga till skalbar text på din WordPress-webbplats. Du kanske också vill kolla in våra experters val av bästa dra-och-släpp-sidbyggare för WordPress och vår kompletta guide till uppdateringar av WordPress-teman.

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.