Den Ultimative Guide til WordPress-shortcoder (med Eksempler til Oprettelse af dine Egne)

WordPress shortcodes er en kraftfuld funktion til at lave fede ting med lidt indsats. Du kan stort set gøre alt med dem. Med shortcoder er det lige så let at integrere interaktive elementer eller oprette komplekse sidelayout, som at indsætte en enkelt kodelinie.

Hvis du vil tilføje et galleri, skal du blot indtaste følgende kode:

[gallery ids="47 ,86, 92, 64, 48, 75, 89, 80" columns="4" size="medium"]

Dette udsender et galleri med de nævnte billed-id’er. Det har 4 kolonner, og deres maksimale størrelse vil være ‘medium’ (som defineret af WordPress).

Der er ingen grund til at benytte grim HTML-kode.

Shortcoder fjerner behovet for komplicerede scripts. Selv hvis du har ringe eller ingen programmeringsfærdigheder, kan du nemt tilføje dynamisk indhold med deres hjælp.

De er meget populære hos WordPress-udviklere, da de hjælper enormt med automatisering af indhold og design. Genvejskoder er til WordPress-udviklere hvad makroer er til dataanalytikere eller tastaturgenveje til professionelle grafiske designere.

I denne vejledning lærer du alt, hvad der er at vide om shortcoder. Du finder ud af, hvordan du arbejder med Shortcode API ved at oprette dine helt egne shortcoder. I sidste ende vil vi diskutere fremtiden for shortcoder, og hvor de passer ind med WordPress ‘nye Block Editor.

Begejstret? Lad os komme igang!

Hvad er en Shortcode?

Kort sag, shortcode = Shortcut + code.

shortcoder bruger typisk firkantede parentesetags [] til at definere, hvordan de er brugt. Hver shortcode udfører en bestemt funktion på et sted. Det kan være så simpelt som formatering af indholdet eller så komplekst som at definere hele webstedets struktur.

For eksempel kan du bruge shortcoder til at indlejre slidere, formularer eller pricing tables. Du kan endda bruge dem til at oprette genanvendelige skabeloner til sidedesign.

En kort Historie med Shortcoder

Shortcoder blev først gjort populære af en online forum-software kaldet Ultimate Bulletin Board (UBB). I 1998 introducerede de BBCode (Bulletin Board Code), en samling brugervenlige tags til brugere til let at formatere deres indlæg.

Som et lightweight markup language fungerer BBCode efter de samme principper som HTML, bortset fra at det er en meget enklere måde.

Brug af foruddefinerede tags er også meget sikrere, da brugere ikke kan indsætte HTML-kode og introducere sikkerhedssårbarheder. For eksempel kan en bruger med ondsindet hensigt bruge <script> -tagget til at udføre JavaScript-kode og ødelægge webstedets funktionalitet.

Kort efter tilføjede andre online forum software som phpBB, XMB Forum og vBulletin BBCode-funktionalitet i deres opslagstavler.

Shortcodes bemyndigede administratorer til at have større kontrol over, hvad deres brugere kan og ikke kan gøre. Desuden tillod de brugere at formatere deres indhold gennem enkle tags.

På grund af de samme sikkerhedsmæssige årsager forhindrer WordPress, at PHP-kode kører på webstedsindhold. For at overvinde denne begrænsning introducerede WordPress 2.5 shortcode-funktionaliteten i 2008 med frigivelsen af ​​Shortcode API. Det har vist sig at være en af ​​de mest anvendte funktioner fra mange WordPress plugins og temaudviklere.

Hvad er WordPress-shortcoder?

WordPress-shortcoder er firkantede bracket strings ([ ]), der magisk omdannes til noget fascinerende på fronten. De giver brugerne en nem måde at oprette og ændre kompliceret indhold uden at bekymre sig om komplekse HTML- eller embedkoder.

De 2 typer shortcoder

Der er primært to typer shortcoder i WordPress.

• Selvlukkende shortcoder: Disse behøver ikke et lukningskode.

Eksempel: Galleri shortcoden behøver ikke et lukningskode. Vi tilføjer alt det behov med forskellige attributter.

• Lukning af shortcoder: Disse har brug for et lukningskode. Afslutning af shortcoder manipulerer generelt indholdet mellem åbnings- og lukningskoder.

Eksempel: Caption shortcoden bruges til at vikle en billedtekst omkring ethvert indhold. Det bruges hovedsageligt til at tilføje en billedtekst til billeder, men det fungerer med ethvert HTML-element.

Nogle shortcoder fungerer med eller uden attributter. Det afhænger af, hvordan de er defineret.

Standard WordPress-shortcoder

WordPress leveres med 6 standardshortcoder:

• audio: Integrer lydfiler på dit websted. Det inkluderer enkle afspilningskontroller som Play & Pause.
• caption: Pakkede billedtekster omkring dit indhold med det. Det bruges mest til at tilføje billedtekst, men du kan bruge det til ethvert HTML-element.
• embed: Udvid funktionen standard oEmbed. Denne shortcode giver dig mulighed for at indstille forskellige attributter til dine integrationer, som at indstille deres maksimale dimensioner.
• galleri: Indsæt et simpelt billedgalleri på dit websted. Du kan bruge attributter til at definere, hvilke billeder der bruges og tilpasse, hvordan galleriet ser ud.
• playlist: Vis en samling lyd- eller videofiler med denne selvomslutende shortcode. Du kan give den en cool ‘mørk’ tilstand med dens stilattribut.
• video: Integrer en videofil og afspil den ved hjælp af en simpel videoafspiller. Denne shortcode understøtter indlejring af videoer med disse formater: mp4, webm, m4v, webm, ogv, wmv, flv.

For flere detaljer om, hvordan du kan bruge standardshortcoder og hvilke attributter de understøtter, kan du henvise til de tilknyttede Codex-dokumenter.

Sådan bruges WordPress-shortcoder

Brug af shortcoder i WordPress er en ligetil proces. Men det afhænger af, hvor du vil tilføje dem på dit websted. Sørg for at læse shortcode-dokumentationen for at forstå, hvordan den fungerer. Lær de attributter, den understøtter, så du kan få præcist det, du ønsker.

Brug af WordPress-shortcoder i Sider og Indlæg

Gå først til side / indlægseditoren, hvor du vil indsætte shortcoden.

Hvis du bruger Gutenberg-editoren, kan du tilføje shortcode tag i den uafhængige shortcodeblokke. Vi kan finde det i afsnittet Widgets.

Bruger du stadig Classic Editor (eller plugin)? Du kan indtaste dine shortcode-tags på den klassiske måde. Et par shortcoder kan endda have en knap i redigeringsskærmen for let at indsætte dem.

Brug af WordPress Shortcodes i Sidebar Widgets

Shortcoder kan også indsættes i sidebar-widgets. For at tilføje dem skal du gå til Udseende » Widgets og tilføje en tekst widget til det afsnit, hvor du vil tilføje genvejen.

Indsæt shortcoden inde i tekst widget og gem den. Du kan besøge dit websteds frontend og se din shortcodes output i din sidebar.

Bemærk: WordPress 4.8 og nyere versioner understøtter ikke shortcoder i sidebar-widgets. Læs Widget Improvements in WordPress 4.9 opdateringen for mere.

Brug af WordPress Shortcodes i Header og Footer

WordPress-shortcodes er generelt beregnet til sider, indlæg og widgets. Men du har en nem måde at indsætte shortcodes overalt på dit websted.

Lad os sige, at du vil tilføje en call to action-knap i din footer eller i alle dine indlæg før kommentarsektionen. Funktionen do_shortcode() callback er praktisk her.

Du skal tilføje følgende kode til dit temas header.php, footer.php eller en af ​​dets skabelonfiler:

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

Dette udsender shortcoden på det sted, hvor du indsatte koden.

Du skal inkludere de firkantede parenteser mellem anførselstegnene for at gentage shortcoden. Bare det at inkludere dets navn fungerer ikke.

Ligeledes kan du bruge do_shortcod () callback funktionen til at aktivere shortcoder overalt i WordPress, som i kommentarfeltet.

En Hurtig Introduktion til Shortcode API

WordPress Shortcode API definerer, hvordan du kan bruge shortcoder til at tilpasse og udvide dit websteds funktionalitet. Det gør det muligt for udviklere at oprette unikt indhold (f.eks. formularer, karruseller, sliders osv.), Som brugerne kan tilføje på deres websteder ved at indsætte den relevante shortcode.

Du kan tilføje næsten enhver funktion, du kan forestille dig til dit websted ved hjælp af shortcoder.

API understøtter både selvlukkende og lukkede shortcoder. Det håndterer al den vanskelige parsing og inkluderer hjælperfunktioner til at indstille og hente standardattributter.

Takket være API’en kan du dykke direkte i at udvikle og tilpasse shortcoder i stedet for at spilde dyrebar tid på at definere regelmæssige udtryk for hver shortcode, du laver.

At Forstå det Grundlæggende ved Shortcode API

Hver gang du åbner en side eller et indlæg i WordPress, ser det efter registrerede shortcoder, mens du behandler websteds indhold.

Hvis der findes en registreret shortcode, overtager Shortcode API og returnerer output fra shortcoderne. Den returnerede outputstreng erstatter shortcodekoden på det sted, den blev tilføjet.

Du registrerer en shortcode i WordPress med funktionen add_shortcode(). Sådan gøres det:

add_shortcode( 'shortcode_name', 'shortcode_handler_function' );

• • • shortcode_name: Mærket WordPress vil kigge efter, mens indlægsindhold analyseres. Shortcode API anbefaler, at du kun bruger små bogstaver, tal og understregninger til at definere dens værdi (undgå bindestreger).
    • shortcode_handler_function: Den tilbagekaldsfunktion, der udføres efter WordPress, bekræfter tilstedeværelsen af ​​en registreret shortcode.

Funktionen til shortcoder er defineret som sådan:

function shortcode_handler_function( $atts, $content, $tag ){ }

• • • $atts: En tilknyttet række af attributter (dvs. en matrix af key-value pairs). Hvis du definerer ingen attributter, vil den som standard være en tom streng.
    • $content: Det vedlagte indhold, hvis du definerer en vedhæftet shortcode. Det er håndtererfunktionens ansvar at sikre, at $ indholdsværdien returneres til output.
    • $tag: shortcodens tagværdi (shortcodenavn i ovenstående eksempel). Hvis to eller flere shortcoder deler den samme callback unktion (som er gyldig), hjælper $ -tageværdien dig med at bestemme, hvilken shortcode udløste behandlingsfunktionen.

API analyserer shortcodens tag, attributter og lukkede indhold (hvis nogen) ved at omgå værdierne til handlerfunktionen, der behandler dem og returnerer en outputstreng.

Denne outputstreng erstatter shortcodemakroen på dit websteds frontend. Hvad du i sidste ende ser i browseren er denne output.

Hvor kan du Tilføje dine Tilpassede Shortcodeskripts?

Du kan tilføje dine brugerdefinerede shortcodeskripts til temas functions.php-fil eller inkludere dem i et plugin.

Hvis du tilføjer den til en temafil, kan du køre funktionen add_shortcode() som den er.

Men hvis du tilføjer det til et plugin, anbefaler jeg dig at initialisere det først, når WordPress er indlæst fuldstændigt. Du kan sikre dig, at funktionen add_shortcode() indpakkes i en anden funktion. Dette kaldes en indpakningsfunktion:

function shortcodes_init(){
 add_shortcode( 'shortcode_name', 'shortcode_handler_function' );
}
add_action('init', 'shortcodes_init');

The add_action() function hooks the shortcodes_init function to fire only after WordPress has finished loading (it’s called the ‘init’ hook).

Sådan Opretter du en Tilpasset Shortcode i WordPress (begynderniveau)

Nu hvor vi har dækket det grundlæggende, er det tid til at oprette en brugerdefineret shortcode.

For at følge nedenstående trin skal du kendskab til at arbejde med PHP-kode og redigere dine WordPress-temafiler. Når du er færdig med selvstudiet, har du din første tilpassede WordPress-shortcode, som er klar til at affyre!

Vi starter med den mest enkle shortcode og går derefter mod mere komplekse. Nyd dine korte milepæle på din vej til shortcoder mestring!

Eksempel 1: Shortcode ved Hjælp af [current_year]

Lad os oprette en shortcode kaldet current_year], der udsender det aktuelle år på din hjemmeside.

Denne shortcode er nyttig, hvis du tilføjer indhold til dit websted, der skal opdateres hvert år. For eksempel at tilføje en copyright-meddelelse til sidens sidefod.

Jeg bruger et barebones-plugin til at tilføje mine shortcode-funktioner. Du kan tilføje det til dit temas functions.php-fil og få de samme resultater, men jeg anbefaler det ikke. Det er dog OK at teste og lære!

Lad os komme i gang ved at oprette et plugin. Opret en ny mappe i dit /wp-content/plugins/ bibliotek.

Jeg navngiver mit plugin “salcodes”, men du kan navngive det, hvad du vil.

Opret en PHP-fil med det samme navn i salcodes plugin-biblioteket (salcodes.php). Når det er gjort, skal du tilføje følgende header til din plugins fil:

<?php

/*
Plugin Name:  Salcodes
Version: 1.0
Description: Output the current year in your WordPress site.
Author: Salman Ravoof
Author URI: https://www.salmanravoof.com/
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: salcodes
*/

Denne enkle plugin-header er god nok til vores formål. Du kan lære mere om krav til plugin-header i WordPress Codex. Gem denne fil, og gå derefter til dit WordPress-dashboard for at aktivere pluginet.

Lad os registrere shortcoden og dens behandlingsfunktion. For at gøre det, tilføj følgende kode til din plugin-fil:

/**
 * [current_year] returns the Current Year as a 4-digit string.
 * @return string Current Year
*/

add_shortcode( 'current_year', 'salcodes_year' );
function salcodes_init(){
 function salcodes_year() {
 return getdate()['year'];
 }
}
add_action('init', 'salcodes_init');

/** Always end your PHP files with this closing tag */
?>

• • • @return-tag i PHP-kommentaren definerer typen af ​​returneret output. Den efterfølges af en kort beskrivelse af det samme.
    • current_year er shortcodekoden eller navnet. Dette definerer det selvlukkende tag, du har brug for at tilføje i dit indhold, som i dette tilfælde ville være [actual_year].
    • salcodes_year er navnet på shortcode handler function, der returnerer outputstrengen. Vi definerer denne callback funktion på de næste linjer. Da vi opretter en simpel selvlukkende shortcode, behøver du ikke videregive den nogle variable værdier som $ attributter, $ indhold eller $ tag.
    • salcodes_init er den indpakningsfunktion, der er koblet til ‘init’ for at sikre, at shortcoden er registreret og køres først, når WordPress er færdig med indlæsning. WordPress ‘indbyggede add_action() -funktion gør dette muligt.
    • getdate() er en PHP-funktion, der returnerer en matrix med datooplysninger om det aktuelle tidsstempel. Årsnøglen har det aktuelle års værdi (som en 4-cifret streng). Så getdate()[‘year’] returnerer det aktuelle år. Denne output er nøjagtigt, hvad vi ønsker.

Gem din plugin-fil. Det er nu tid til at teste, om shortcoden fungerer som tilsigtet.

Tilføj shortcoden overalt på dit websted (side, indlæg, sidebar-widget osv.). Jeg tilføjer det til mit websteds sidebar tekst-widget.

Og som forventet fungerer det perfekt.

Tillykke med at nå din første milepæl!

Den shortcode, du lige har oprettet, har ikke nogen $attributs eller $content variabler tilknyttet den. Du lærer, hvordan du bruger dem i de følgende eksempler.

Eksempel 2: Shortcode til en CTA-knap

Lad os oprette en tilpasset CTA-knap-kode. Denne lukker også selv (beklager $content, du skal holde igen til næste gang).

Jeg ønsker, at brugere skal kunne tilpasse CTA-knappens størrelse og farve med shortcode-attributterne.

Da den endelige output er et knap-element, kan dets HTML-attributter som href, id, class, target & label bruges til at tilpasse det med lethed.

Du kan bruge id- og class attributterne til at style knappen, da de begge er almindelige CSS-vælgere.

Jeg indpakker ikke min handler funktionen her for at holde tingene lette at forklare.

/**
 * [cta_button] returns the HTML code for a CTA Button.
 * @return string Button HTML Code
*/

add_shortcode( 'cta_button', 'salcodes_cta' );

function salcodes_cta( $atts ) {
 $a = shortcode_atts( array(
 'link' => '#',
 'id' => 'salcodes',
 'color' => 'blue',
 'size' => '',
 'label' => 'Button',
 'target' => '_self'
 ), $atts );
 $output = '<p><a href="' . esc_url( $a['link'] ) . '" id="' . esc_attr( $a['id'] ) . '" class="button ' . esc_attr( $a['color'] ) . ' ' . esc_attr( $a['size'] ) . '" target="' . esc_attr($a['target']) . '">' . esc_attr( $a['label'] ) . '</a></p>';
 return $output;
}

Woah, der er meget at pakke ud her. Jeg får forklare det linje for linje, så du kan forstå, hvordan det fungerer.

• Vi har dækket funktionen add_shortcode(), og hvordan den fungerer i det foregående afsnit.
• shortcode_atts() er en WordPress-funktion, der kombinerer brugerens shortcode-attributter med kendte attributter. Det udfylder standardværdier efter behov (som du også kan indstille dig selv). Resultatet vil være en matrix, der indeholder hver nøgle fra de kendte attributter, flettet med værdier fra brugerdefinerede shortcodeattributter.
• Inde i shortcode handler-funktionen definerer vi en variabel ($a) og tildeler den til den matrix, der er returneret af shortcode_atts(). Vi tildeler attributterne deres standardværdier med syntaks: ‘attribute’ =>default-valuei’. I ovenstående kode indstiller vi for eksempel standardværdien for attribut-etiketten til knap med syntaksen ‘label’ => ‘button’.
• Vi kan udtrække værdierne for hver attribut-nøgle med PHP-syntax for arrays: $a[‘attribut’].
• Variablen $output gemmer HTML-koden for knapelementet (<a> tag med ‘button’-klassen). Det er den streng, der endelig er returneret af funktionen.
• Hvis du vil indstille standardlinket til at være webstedets hjemmeside-URL, kan du gøre brug af home_url() WordPress-funktionen.

Lad os prøve at bruge shortcoden som den er, uden attributter defineret, og se, hvad der er angivet.

Hvis du undrer dig over, hvad de dobbelte firkantede parenteser er beregnet til ([[cta_button]]), kaldes de en escaping shortcode. De hjælper dig med at udskrive enhver registreret shortcode på dit websted som almindelig tekst, som på billedet herunder.

Brugere kan tilpasse størrelsen og farven på knappen med shortcoden. Vi indstiller allerede deres standardværdier i behandlingsfunktionen, men vi er nødt til at registrere og indstille stylesheet til listen over tilgængelige ressourcer. Dette stylesheet skal have alle klasser defineret i shortcoden.

Du kan også indstille disse klasser i dit temas globale stylesheet, men det anbefales at indlæse dem separat. Dette sikrer, at selv hvis du ændrer eller opdaterer dit WordPress-tema, indlæses disse klasser stadig sammen med shortcoden.

/** Enqueuing the Stylesheet for the CTA Button */

function salcodes_enqueue_scripts() {
 global $post;
 if( is_a( $post, 'WP_Post' ) && has_shortcode( $post->post_content, 'cta_button') ) {
 wp_register_style( 'salcodes-stylesheet',  plugin_dir_url( __FILE__ ) . 'css/style.css' );
     wp_enqueue_style( 'salcodes-stylesheet' );
 }
}
add_action( 'wp_enqueue_scripts', 'salcodes_enqueue_scripts');

Funktionen salcodes_enqueue_scripts() definerer den globale variabel $post og bekræfter derefter to betingelser via:

• is_a(): kontrollerer, om $post er en forekomst af WP_Post objektet. Det henviser til alle posttyper i WordPress.
• has_shortcode(): kontrollerer, om indholdet af indlægget indeholder [cta_button] shortcode.

Hvis begge betingelser er rigtige, registrerer og udskriver funktionen style.css stylesheet, der er inkluderet i CSS-mappen. Funktionen plugin_dir_url($ fil) gør det nemt at få URL’en til plugin-biblioteket.

Jeg vil ikke vise dig CSS-koden her, men du kan finde den i kildekoden, der er knyttet til slutningen af dette afsnit.

Lad os til sidst teste [cta_button] -koden ved at tilføje den til indholdet af indlægget:

Billedet herunder viser, hvordan CTA-knappen ser ud på fronten:

Nu, hvor du har lært, hvordan du definerer tilpassede attributter og inkluderer stylesheets, kan du føje forskellige andre funktionaliteter til din CTA-knapkode. For eksempel kan du give dine brugere muligheden for at tilføje animationer, hover-effekter og forskellige andre knapformater.

Eksempel 3: Shortcode ved Hjælp af $content

For vores sidste eksempel, lad os opbygge en lukkende shortcode kaldet [boxed], der udsender alt indhold mellem dets tags i en boks med farverige titler.

Lad os komme i gang ved at registrere shortcoden og definere dens handler funktion.

/**
 * [boxed] returns the HTML code for a content box with colored titles.
 * @return string HTML code for boxed content
*/

add_shortcode( 'boxed', 'salcodes_boxed' );

function salcodes_boxed( $atts, $content = null, $tag = '' ) {
 $a = shortcode_atts( array(
 'title' => 'Title',
 'title_color' => 'white',
 'color' => 'blue',
 ), $atts );
 
 $output = '<div class="salcodes-boxed" style="border:2px solid ' . esc_attr( $a['color'] ) . ';">'.'<div class="salcodes-boxed-title" style="background-color:' . esc_attr( $a['color'] ) . ';"><h3 style="color:' . esc_attr( $a['title_color'] ) . ';">' . esc_attr( $a['title'] ) . '</h3></div>'.'<div class="salcodes-boxed-content"><p>' . esc_attr( $content ) . '</p></div>'.'</div>';
 
 return $output;
}

• • • content = null: dette registrerer shortcoden som en lukkende type. Du kan bruge variablen $content i din handle-rfunktion til at ændre din output, som du ønsker.
    • $tag = ”: dette definerer shortcodens $tag-variabel. Det er ikke nødvendigt i dette eksempel, men det er en god praksis at medtage det.

I dette eksempel ændrer vi indholdet ved hjælp af inline CSS-stylesheets.

Styles for alle klasser, der er brugt inden for shortcoden, registreres og indvindes, som vi gjorde i det forrige shortcodeksempel.

Men at have to shortcoder bruge det samme stylesheet betyder, at du skal indlæse det, hvis en af dem bruges. Så lad os opdatere funktionen salcodes_enqueue_scripts():

/** Enqueuing the Stylesheet for Salcodes */

function salcodes_enqueue_scripts() {
 global $post;
 $has_shortcode = has_shortcode( $post->post_content, 'cta_button' ) || has_shortcode( $post->post_content, 'boxed' );
 if( is_a( $post, 'WP_Post' ) && $has_shortcode ) {
 wp_register_style( 'salcodes-stylesheet',  plugin_dir_url( __FILE__ ) . 'css/style.css' );
     wp_enqueue_style( 'salcodes-stylesheet' );
 }
}
add_action( 'wp_enqueue_scripts', 'salcodes_enqueue_scripts');

• • • $has_shortcode: en brugerdefineret variabel, der kontrollerer, om en af shortcoderne findes på siden / indlægget. || (ELLER operatør) gør det muligt.

Lad os tage vores [boxed] shortcode ud på en tur.

Skærmbillede nedenfor viser den output, vi får.

Nu, hvor du har lært, hvordan du opretter dine egne shortcoder, kan du tænke ud af [boksen] og give dem dit eget spin. Glem ikke at dele dine kreationer med os!

Hvis du vil, kan du downloade kildekoden Shortcode Plugin herfra.

WordPress-shortcoder: Fordele imod Ulemper

Fordelene

• • • Shortcoder forenkler tilføjelsen af ​​komplekse funktioner på WordPress-websteder. Du kan tilføje næsten alt ved at skrive en enkelt kodelinie.
    • Shortcoder automatiserer udviklingsarbejdsgangen. De eliminerer behovet for at skrive komplekse scripts, hver gang du vil indsætte en bestemt funktion.
    • Shortcoder er mere brugervenlige end at tilføje HTML-kode eller PHP-scripts.
    • Shortcoder kan pakkes ind i plugins. Selv hvis du opdaterer WordPress eller ændrer / opdaterer dit tema, vil shortcoderne stadig være gyldige og fortsætte med at arbejde som de gjorde før.
    • Bundling af shortcoder inde i plugins gør dem nemme at bruge på flere WordPress-websteder. Hvis du er en udvikler, der håndterer mange websteder, er det en livredder at have alle dine tilpassede shortcoder klar til at køre.
    • Da shortcoder også accepterer attributter, kan brugerne ændre, hvordan den samme shortcode opfører sig ved blot at ændre dens attributindstillinger.

Ulemperne

• • • Shortcoder er ikke intuitive til brug for slutbrugeren, især hvis mange af dem bruges på en side. I sådanne tilfælde er de mere velegnede til udviklere.
    • Det er svært at fortælle, hvad en shortcode gør bare ved at se på den. WordPress-kerneteamet har med rette navngivet dem “mystery meat embed codes” af denne nøjagtige grund.
    • Shortcoder, der leveres sammen med temaer, stopper med at fungere, hvis du ændrer dit tema.
    • Shortcoder er tvetydige med hensyn til deres syntaks. For eksempel understøtter nogle af dem valgfri lukning, så du kan bruge dem som enten selvlukkende eller lukkende eller endda begge dele, hvis de er indlejret. Du kan gætte, hvordan det kan blive super forvirrende super hurtigt.
    • Shortcoder kan ødelægge HTML på grund af modstridende tags eller interoperabilitets-problemer. Det er aldrig et godt syn at se dem på ethvert websteds frontend.
    • Shortcoder tilføjer en ekstra belastning på din server. Efterhånden som antallet af shortcoder på din side / indlæg øges, indlæses dette også. For mange shortcoder kan bringe dit websted til en gennemgang (f.eks. Output fra de fleste page builders).

Shortcodes og Gutenberg Blocks

Introduktion af Gutenberg reducerede ønsket om shortcoder. Brugere kan nu tilføje blokke direkte fra redigeringsgrænsefladen i stedet for at håndtere shortcodemarkeringer, uanset hvor enkelt det er.

Og hvis du vil tilføje kortnumre, kommer Gutenberg endda med en dedikeret blok til at tilføje shortcoder. Blokke er de nye shortcoder.

“Hvis du kunne gøre det med shortcoder, kan du gøre det som en blok.” – James Huff, lykkeingeniør hos Automattic

Det forklarer, hvorfor alle de populære shortcodes konverteres til blokke. Mange WordPress-udviklere er skiftet hen imod at få deres produkter og tjenester udelukkende til at arbejde sammen med blokeditoren (Gutenberg).

Men det betyder ikke, det er verdens ende for shortcoder. WordPress-kerneteamet har lovet mange forbedringer af blokeditoren, som du kunne se i Twenty Twenty, men indtil da er shortcoder her for at blive!

Resumé

Det er nemt at tilføje kompleks funktionalitet overalt til dit WordPress-sted med shortcoder. De giver brugerne easy-to-type tags, der kan bruges uden at bekymre sig om at rode med komplekse koder.

Selvom der muligvis ikke er nogen genveje i livet, er der bestemt mange genveje, du kan bruge i WordPress. Mine favoritter er Shortcodes Ultimate og Shortcodes af Angie Makes.

Og hvis du ikke kan finde den, du leder efter, kan du oprette en selv.

Du kan endda tage en genvej for at oprette din brugerdefinerede genvej ved hjælp af Shortcoder-plugin. Det tager sig af alle de vigtigste ting for dig. Og husk: livet er kort, brug shortcoder!