WordPress kortkoder används för att 1) minska mängden kod du behöver skriva; 2) förenkla användningen av WordPress plugins, teman och andra funktioner. De beter sig som makron, när du sätter in en kortkod ersätts den med ett kodstycke. Det kan vara vad som helst.

WordPress kommer med några fördefinierade kortkoder, som och , och de ingår också med många populära plugins och teman. Du kan också skapa egna anpassade kortkoder för att göra saker som att skapa kolumner på din WordPress-webbplats.

i det här inlägget tar vi dig steg för steg genom processen att skapa och använda dina egna anpassade kortkoder. Vi går igenom hela processen med att skapa en ny kortkod och visar hur du ändrar och kontrollerar kortkodattributen och funktionerna.

Observera att detta är ett mer avancerat inlägg som kommer att gå in på detaljer om hur man skapar kortkoder. Om du arbetar med kod är bortom din tekniska expertis, och du bara vill ha det enklaste sättet att komma igång med att skapa och använda kortkoder kanske du vill börja med en kortkod plugin.

När du skapar dina egna kortkoder finns det två saker du behöver göra:

1. skapa kortkodshanteringsfunktionen. En kortkodsfunktion är en funktion som tar valfria parametrar (attribut) och returnerar ett resultat.
2. registrera kortkodshanteringsfunktionen. Använd den inbyggda WordPressadd_shortcut – funktionen för att registrera anpassade kortkoder.

förbereda WordPress för anpassade kortkoder

även om det inte är nödvändigt, är det bra att hålla dina anpassade kortkoder i sin egen fil. Alternativt kan du lägga till dem i ditt temas functions.php – fil.

Skapa först en ny fil med namnet custom-shortcodes.php och spara den i samma mapp som ditt tema functions.php fil.

lägg sedan till följande kodblock i den nyskapade filen:

<?php ?>

Öppna sedanfunctions.php – filen och Lägg till följande kodrad:

include('custom-shortcodes.php');

Du är nu redo att börja lägga till dina egna kortkoder.

grundläggande kortkoder

i det här första exemplet kommer vi att skapa en grundläggande WordPress-kortkod som infogar dagen för Indie avatar bilden nedan.

skapa kortkoden

det första steget är att skapa kortkodsfunktionen. Inuti filencustom-shortcodes.php lägger du till följande kodblock:

function dotiavatar_function() { return '<img src="http://dayoftheindie.com/wp-content/uploads/avatar-simple.png" alt="doti-avatar" width="96" height="96" class="left-align" />';}

i kodexemplet ovan returnerar funktionendotiavatar_function en förutbestämd bild med namnetavatar-simple.png.

nästa steg är att registrera kortkoden med WordPress med den inbyggda funktionen add_shortcode. Fortfarande inuti custom-shortcodes.php, Lägg till följande rad kod:

add_shortcode('dotiavatar', 'dotiavatar_function');

När du registrerar en kortkod med funktionen add_shortcode passerar du i kortkodstaggen ($tag) och motsvarande funktion ($func) / krok som kommer att utföras när genvägen används.

i detta fall är genvägstaggen dotiavatar och kroken är dotiavatar_function.

Obs: När du namnger taggar, använd endast små bokstäver och använd inte bindestreck; understreck är acceptabla.

använda kortkoden

Nu när du har kortkoden skapad och registrerad är det dags att prova det! När du vill att DOTI-avataren ska visas i postinnehållet kan du istället använda kortkoden:

kortkoder med parametrar (attribut)

i föregående exempel fanns det inte mycket utrymme att ändra saker. Låt oss säga, istället för att trycka på en enda bild, skulle vi vilja kunna ställa in vilken bild som ska användas med en parameter. Du kan göra det genom att lägga till några attribut ($atts).

återigen, inuti custom-shortcodes.php, Lägg till en annan funktion, så här:

function dotirating_function( $atts = array() ) { // set up default parameters extract(shortcode_atts(array( 'rating' => '5' ), $atts)); return "<img src=\"http://dayoftheindie.com/wp-content/uploads/$rating-star.png\" alt=\"doti-rating\" width=\"130\" height=\"188\" class=\"left-align\" />";}

funktionen ovan accepterar en enda parameter: rating. Om ett rating – värde inte skickas använder det ett standardsträngsvärde på 5. Det gör detta genom att packa upp matrisen med attribut med den inbyggda funktionen shortcode_atts och kombinera standardvärdena med värden som kan ha överförts till funktionen.

glöm inte att registrera kortkoden:

add_shortcode('dotirating', 'dotirating_function');

med kortkodfunktionen skapad och kroken tillagd är kortkoden nu redo att användas i ditt inlägg innehåll:

Alternativt kan du utelämna rating, och bara gå med standardvärdet:

och det är det! Du vet nu hur man skapar självstängande WordPress-kortkoder. Men det finns en annan typ du kan skapa.

omslutande kortkoder

hittills har vi arbetat med självstängande kortkoder. Men det finns en annan typ av kortkod: omslutande kortkoder.

omslutande kortkoder kan du använda en BBCode – stil format. Det vill säga en stil som ser ut så här:

content

omslutande kortkoder är användbara för när du behöver manipulera det bifogade innehållet. Låt oss till exempel säga att du har en viss typ av knapp som du använder din webbplats; du kan använda HTML-koden för att generera den knappen/stilen varje gång du behöver använda den, eller så kan du ställa in en anpassad omslutande kortkod istället.

genom att använda en bifogad kortkod kan du hålla fokus på innehållet snarare än på koden.

skapa kortkoden

återigen, inuti filencustom-shortcodes.php, Lägg till följande kodblock:

function dotifollow_function( $atts, $content = null ) { return '<a href="https://twitter.com/DayOfTheIndie" target="blank" class="doti-follow">' . $content . '</a>';}

i kodblocket ovan används$content = null för att identifiera denna funktion som en omslutande kortkod. Och inuti den funktionen packar du in ditt innehåll ($content) I HTML-koden.

OK, nu är det dags att registrera kortkoden:

add_shortcode('dotifollow', 'dotifollow_function');

och det är det! Din kortkod är redo att användas.

använda kortkoden

använda en omslutande kortkod är inte mycket annorlunda än att använda en självstängande en. Liksom HTML behöver du bara se till att du har en öppning och ett avslutande uttalande:

Follow us on Twitter!

naturligtvis är detta bara ett grundläggande exempel. Du kan också lägga till parametrar till en omslutande kortkod, som du gör med en självstängande kortkod.

inuti custom-shortcodes.php, Lägg till ytterligare en funktion:

function dotibutton_function( $atts = array(), $content = null ) { // set up default parameters extract(shortcode_atts(array( 'link' => '#' ), $atts)); return '<a href="'. $link .'" target="blank" class="doti-button">' . $content . '</a>';}

och registrera sedan kortkoden:

add_shortcode('dotibutton', 'dotibutton_function');

den här nya funktionen låter dig ställa in en länk för knappen med följande syntax:

Shop Now!

med omslutande kortkoder kan du göra mycket med väldigt lite kod.

ett ord om Widgets

som standard stöds kortkoder endast i inlägg, sidor eller anpassade posttyper; de stöds inte i sidofältets widgets. För att lägga till stöd för widgets måste du lägga till följande kod tillfunctions.php fil:

add_filter( 'widget_text', 'shortcode_unautop' );add_filter( 'widget_text', 'do_shortcode' );

När du gör det kan du använda kortkoder i widgets – precis som du gör i inlägg/sidor.

att packa upp saker

att lägga till egna kortkoder tar inte mycket ansträngning – särskilt när du förstår hur de implementeras. Om du vill lära dig mer, kolla in WordPress codex.