Hur lägger jag till en kortkod i WordPress? (Nybörjarguide)

Kortkoder är ett enkelt sätt att lägga till dynamiskt innehåll i dina WordPress-inlägg, sidor och sidofält.


Många WordPress-plugins och teman använder kortkoder för att lägga till specialiserat innehåll som kontaktformer, bildgallerier, reglage och mer.

I den här artikeln kommer vi att visa dig hur du enkelt lägger till en kortkod i WordPress. Vi kommer också att visa dig hur du skapar dina egna egna kortkoder i WordPress.

Lägga till en kortkod i WordPress

Vad är kortkoder?

Kortkoder i WordPress är kodgenvägar som hjälper dig att lägga till dynamiskt innehåll i WordPress-inlägg, sidor och sidofältwidgets. De visas i fyrkantiga parenteser så här:

[Myshortcode]

För att bättre förstå kortkoder, låt oss titta på bakgrunden till varför de lades till i första hand.

WordPress filtrerar allt innehåll för att se till att ingen använder inlägg och sidinnehåll för att infoga skadlig kod i databasen. Detta innebär att du kan skriva grundläggande HTML i dina inlägg, men du kan inte skriva PHP-kod.

Men tänk om du ville köra en anpassad kod i dina inlägg för att visa relaterade inlägg, bannerannonser, kontaktformulär, gallerier osv?

Det är här Shortcode API kommer in.

I grunden tillåter det utvecklare att lägga till sin kod i en funktion och sedan registrera den funktionen med WordPress som en kortkod, så användare kan enkelt använda den utan att ha någon kodningskunskap.

När WordPress hittar kortkoden kör den automatiskt koden som är kopplad till den.

Låt oss se hur du enkelt lägger till kortkoder i dina WordPress-inlägg och sidor.

Lägga till en kortkod i WordPress-inlägg och sidor

Först måste du redigera inlägget och sidan där du vill lägga till kortkoden. Efter det måste du klicka på knappen Lägg till block för att infoga ett kortkodblock.

Lägga till kortkodblock i WordPress

När du har lagt till kortkodblocket kan du helt enkelt ange kortkoden i blockinställningarna. Kortkoden kommer att tillhandahållas av olika WordPress-plugins som du kanske använder, till exempel WPForms för kontaktformulär, OptinMonster för e-postmarknadsföringsformulär, WP Call-knapp för att sätta in en klicka för att ringa-knappen, etc..

Sätt in kortkod i blockredigeraren

För mer information om användning av block, se vår Gutenberg-handledning för mer information.

Du kan nu spara ditt inlägg eller sida och förhandsgranska dina ändringar för att se kortkoden i aktion.

Lägga till en kortkod i WordPress Sidfältwidgets

Du kan också använda kortkoder i WordPress-sidfältwidgets. Besök bara Utseende »Widgets och lägg till widgeten ‘Text’ i en sidofält.

Nu kan du klistra in din kortkod i textområdet i widgeten.

Lägga till kortnummer i sidofältets widget

Glöm inte att klicka på knappen “Spara” för att lagra dina widgetinställningar.

Efter det kan du besöka din WordPress-webbplats för att se direktförhandsvisning av kortkoden i sidofältets widget.

Lägga till en kortkod i Old WordPress Classic Editor

Om du fortfarande använder den gamla klassiska redaktören i WordPress, så här kan du lägga till kortkoder till dina WordPress-inlägg och sidor.

Redigera helt enkelt inlägget och sidan där du vill lägga till kortkoden. Du kan klistra in kortkoden var som helst i innehållsredigeraren där du vill att den ska visas. Se bara till att kortkoden finns i sin egen rad.

Kortkod klassisk redaktör

Glöm inte att spara dina ändringar. Efter det kan du förhandsgranska ditt inlägg och din sida för att se kortkoden i aktion.

Hur man lägger till en kortkod i WordPress-temafiler

Kortkoder är avsedda att användas i WordPress-inlägg, sidor och widgets. Ibland kanske du vill använda en kortkod i en WordPress-temafil.

WordPress gör det enkelt att göra det, men du måste redigera dina WordPress-temafiler. Om du inte har gjort det tidigare, se vår guide om hur du kopierar och klistrar in kod i WordPress.

I grund och botten kan du lägga till en kortkod till valfri WordPress-temamall genom att helt enkelt lägga till följande kod.

<?php echo do_shortcode ("[Your_shortcode]"); ?>

WordPress letar nu efter kortkoden och visar dess utgång i din temamall.

Hur du skapar din egen anpassade kortkod i WordPress

Kortkoder kan vara riktigt användbara när du vill lägga till dynamiskt innehåll eller anpassad kod i WordPress-inlägget och sidorna. Men om du vill skapa en anpassad kortkod kräver det lite kodningsupplevelse.

Om du är bekväm med att skriva PHP-kod är här en exempelkod som du kan använda som mall.

// -funktion som körs när kortnummer anropas
funktion wpb_demo_shortcode () {

// Saker som du vill göra.
$ meddelande = ‘Hej värld!’;

// Output måste returneras
returnera $ meddelande;
}
// registrera kortkod
add_shortcode (‘hälsning’, ‘wpb_demo_shortcode’);

I den här koden skapade vi först en funktion som kör viss kod och returnerar utdata. Efter det skapade vi en ny kortkod som heter “hälsning” och sa till WordPress att köra funktionen vi skapade.

Du kan nu använda lägga till denna kortkod till dina inlägg, sidor och widgets med följande kod:

[hälsning]

Den kör funktionen du skapade och visar önskad utgång.

Låt oss nu titta på en mer praktisk användning av en kortkod. I det här exemplet kommer vi att visa ett Google AdSense-banner i en kortkod.

// Kortkodsfunktionen
funktion wpb_demo_shortcode_2 () {

// Annonskod klistras in i en variabel
$ string. = ‘

(adsbygoogle = windows.adsbygoogle || []). push ({});
‘;

// Annonskoden returneras
returnera $ sträng;

}
// Registrera kortkod
add_shortcode (‘my_ad_code’, ‘wpb_demo_shortcode_2’);

Glöm inte att byta ut annonskoden med din egen annonskod.

Du kan nu använda [my_ad_code] -kodkoden i dina WordPress-inlägg, sidor och sidfältwidgets. WordPress kör automatiskt funktionen som är associerad med kortkoden och visar annonskoden.

Shortcodes vs Gutenberg Block

Vi blir ofta frågade av användare om skillnaderna mellan kortkod kontra de nya Gutenberg-blocken.

I grund och botten, om du tycker att kortnummer är användbara, kommer du att älska WordPress-redigeringsblock. Block låter dig göra samma sak men på ett mer användarvänligt sätt.

I stället för att kräva att användare lägger till en kortkod för visning av dynamiskt innehåll tillåter block att lägga till dynamiskt innehåll i inlägg / sidor med ett mer intuitivt användargränssnitt. Många populära WordPress-plugins byter till att använda Gutenberg-block istället för kortkoder eftersom de är mer nybörjare.

Vi har satt upp en lista över de mest användbara Gutenberg block-plugins för WordPress som du kanske vill prova.

Om du vill skapa dina egna Gutenberg-block kan du följa vår stegvisa handledning om hur du skapar anpassade Gutenberg-block i WordPress.

Vi hoppas att den här artikeln hjälpte dig att lära dig hur du lägger till en kortkod i WordPress. Du kanske också vill se vår guide om bästa drag & släpp WordPress-sidbyggare-plugins, och hur man skapar ett anpassat WordPress-tema utan att skriva någon kod.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me