Så här lägger du till en knapp i WordPress editor [tutorial]

Varför är WordPress knappblock så viktigt?

Navigationen på webbplatsen är viktig för besökare och kunder. Vi vill skicka dem från en undersida vidare. Guida dem genom hela shoppingprocessen. Det är därför det är viktigt att infoga viktiga länkar på rätt sätt i sidinnehållet.

I grund och botten har vi 2 alternativ. Använd standardlänk eller knapp. Åsikterna om när man ska använda det första och det senare alternativet är olika. Det är vanligt att det finns flera möjliga åtgärder på en sida. Vi måste se till vilken som är primär och vilken som är sekundär. Vi rekommenderar att du endast använder knappen för den primära åtgärden. På så sätt uppnår du större synlighet för denna primära åtgärd. Du kommer att fokusera besökarnas uppmärksamhet på denna åtgärd. Vi kan också kalla det call-to-action-knappen. Skapa inte för många knappar på en undersida.

Vilka är huvudknapparnas funktioner?

• Knappar kan fånga besökarnas uppmärksamhet - call to action
• De separerar innehållet på en sida eller i ett inlägg och gör det mer läsbart
• Hjälp med orientering på sidan. Många besökare läser bara av sidan visuellt med ögonen
• Navigera besökare till andra sidor med hjälp av hyperlänkar

Det finns många parametrar som avgör hur framgångsrik en knapp är. Viktigt är till exempel storlek, placering eller knappens färg. Det är nödvändigt att följa standard UI och UX principer. Grön färg används för knappar med positiva åtgärder, t.ex. för att köpa något. Röd färg används för negativa åtgärder, t.ex. för att avregistrera sig från nyhetsbrev. Korrekt utformade knappar på det sättet påverkar direkt besökarens handlingar.

Lägga till en knapp på en sida eller ett inlägg i WordPress

Situationen före WordPress 5

Att lägga till knappar var en ganska komplicerad process innan WordPress Block editor uppfanns. Eftersom den här funktionen inte var naturlig i WordPress. Du kan använda tema med Page Builder eller plugin från tredje part. Kortkoder skapar knappar i det här fallet.

I våra äldre WordPress-teman kan du lägga till knappar med hjälp av kortkoder i den visuella redigeraren. Efter att ha klickat på Insert Shortcode -> Button kan du ställa in olika inställningar i modalfönstret. Text, textfärg, knappfärg, url, justering och så vidare. Tack vare dessa avancerade inställningar kan du lägga till en knapp ganska enkelt och snabbt utan någon programmering.

Hur använder man knappblock i WordPress editor?

Tack vare WordPress 5 finns det ett annat sätt. Mycket enklare. WordPress visuella redigerare ger många användbara block. För att skapa en knapp på webbplatsen kan du nu använda WordPress Button-blocket i redigeraren.

Steg-för-steg-guide för hur du lägger till en knapp i WordPress-redigeraren

1. Först måste du bestämma dig för var du vill placera knappen
2. Knappblocket kan läggas till på olika sätt:
- genom att klicka på "+" i det övre fältet eller var som helst i blockredigeraren där du väljer Button-block

- du kan också hitta något block med hjälp av sökfältet, skriv bara "knapp"

- genom att skriva "/" som ger dig tillgång till alla tillgängliga block

3. Skapat knappblock kan konfigureras ytterligare

Lägg till knapptext och URL-adress

Så snart WordPress Block-knappen är skapad kan du skriva in text i den. Kom ihåg att det är bättre att använda kort text med ett tydligt budskap för en uppmaningsknapp. Du kan ställa in att texten ska vara fet, kursiv eller understruken. Alla dessa ändringar kan göras genom att klicka i verktygsfältet. Du kan också justera knappen till sidan eller centrera den.

Knappen pekar vanligtvis på en annan sida eller en extern webbplats. Av den anledningen finns det en ingång för att lägga till URL-adress precis under den. Fördelen är att det inte krävs att du väljer text för att lägga till URL.

Ändra knappens färg

Med den nya redigeraren kan du ändra WordPress-knappblock på några sekunder. Använd bara inställningarna i sidofältet på höger sida. Du kan ändra knappens bakgrundsfärg eller textfärgen inuti knappen. Det finns grundläggande fördefinierade färger eller så kan du välja dina egna. Alla ändringar syns direkt så att du kan se om färgkombinationen är rätt.

En bra funktion är att om du väljer fel kombinationer, t.ex. grå bakgrund och vit textfärg, kommer WordPress blockredigerare att varna dig för att knappen inte kan läsas på din webbplats.

Hitta din egen knappstil

För att skapa eller ändra knappen mycket snabbt och utan ansträngning kan du använda en av de förberedda stilarna. Knappen kan på så sätt ändras till t.ex. rundad, kantad eller rektangulär. Experimentera med vad som passar bäst med din webbplats stil eller design.

Redigera knapp med anpassad CSS

Ännu större anpassning kan uppnås med hjälp av anpassade CSS-klasser. På så sätt kan du lägga till dina egna CSS-stilar och utforma knappen i WordPress-redigeraren exakt som du vill.

Som vi kan se finns det ett mycket enklare sätt än att använda knappkortkod. WordPress Button-blocket kan användas i alla teman som är kompatibla med WordPress Block Editor. Läs mer om vårt helt nya WordPress-tema Citadela. Det är speciellt utformat och utvecklat för WordPress Block Editor.

Extra tips i slutet

Glöm inte att övervaka ditt WordPress-knappblock och själva knappframgången. Om du använder Google Analytics kan du skapa en unik webbadress. För att spåra besökarnas klick kan du lägga till Google UTM-parameter. URL kan skapas med hjälp av URL-byggaren. Genom att lägga till parametrar kan du identifiera källan till besöket. Det är mycket användbart om du vill veta varifrån besökarna kom till din shoppingsida.

Vad är det största problemet som du för närvarande har med WordPress knappblock? Låt oss diskutera i kommentarerna nedan. Dela med dig av dina erfarenheter av att använda knappar på webbplatsen.