• 9 min read
• WordPress,Essentials,Shortcodes,Techniques (WP)
• Zum Offline-Lesen gespeichert
• Share on Twitter, LinkedIn

WordPress Shortcodes können dies und mehr und werden definitiv Ihr Blogging-Leben einfacher machen. In diesem Artikel zeigen wir Ihnen, wie Sie Shortcodes erstellen und verwenden, und stellen einige gebrauchsfertige WordPress-Shortcodes bereit, die Ihr Blogging-Erlebnis verbessern.

Vielleicht möchten Sie sich auch die folgenden verwandten Beiträge ansehen:

• WordPress-Shortcodes: Eine vollständige Anleitung
• Widgets mit Shortcodes einfügen
• 10 nützliche WordPress-Loop-Hacks

Was sind Shortcodes?

Die Verwendung von Shortcodes ist sehr einfach. Um einen zu verwenden, erstellen Sie einen neuen Beitrag (oder bearbeiten Sie einen vorhandenen), schalten Sie den Editor in den HTML-Modus und geben Sie einen Shortcode in Klammern ein, wie zum Beispiel:

Es ist auch möglich, Attribute mit Shortcodes zu verwenden. Ein Shortcode mit Attributen würde ungefähr so aussehen:

Shortcodes können auch Inhalte einbetten, wie hier gezeigt:

Smashing Magazine

Shortcodes werden von einer Reihe von Funktionen verwaltet, die in WordPress 2.5 eingeführt wurden und als Shortcode-API bezeichnet werden. Wenn ein Beitrag gespeichert wird, wird sein Inhalt analysiert, und die Shortcode-API transformiert die Shortcodes automatisch, um die Funktion auszuführen, die sie ausführen sollen.

Erstellen eines einfachen Shortcodes

Bei Shortcodes ist zu beachten, dass sie sehr einfach zu erstellen sind. Wenn Sie wissen, wie man eine grundlegende PHP-Funktion schreibt, wissen Sie bereits, wie Sie einen WordPress-Shortcode erstellen. Für unsere erste erstellen wir die bekannte „Hallo, Welt“ -Nachricht.

1. Öffnen Sie die Funktionen.PHP-Datei in Ihrem Thema. Wenn die Datei nicht existiert, erstellen Sie sie.

2. Zuerst müssen wir eine Funktion erstellen, um die Zeichenfolge „Hello World“ zurückzugeben. Fügen Sie dies in Ihre Funktionen ein.php-Datei:

   function hello() { return 'Hello, World!';}

3. Nun, da wir eine Funktion haben, müssen wir sie in einen Shortcode umwandeln. Dank der add_shortcode() -Funktion ist dies sehr einfach. Fügen Sie diese Zeile nach unserer hello() -Funktion ein, speichern und schließen Sie die Funktionen.php-Datei:

   add_shortcode('hw', 'hello');

   Der erste Parameter ist der Shortcode-Name und der zweite ist die aufzurufende Funktion.

4. Nachdem der Shortcode erstellt wurde, können wir ihn in Blogposts und auf Seiten verwenden. Um es zu verwenden, schalten Sie einfach den Editor in den HTML-Modus und geben Sie Folgendes ein:

   Fertig! Natürlich ist dies ein sehr einfacher Shortcode, aber es ist ein gutes Beispiel dafür, wie einfach es ist, einen zu erstellen.

Erweiterte Shortcodes erstellen

Wie bereits erwähnt, können Shortcodes mit Attributen verwendet werden, die beispielsweise sehr nützlich sind, um Argumente an Funktionen zu übergeben. In diesem Beispiel zeigen wir Ihnen, wie Sie einen Shortcode erstellen, um eine URL anzuzeigen, genau wie Sie es mit den BBCodes tun würden, die man in Foren wie VBulletin und PHPBB verwendet.

1. Öffnen Sie Ihre Funktionen.PHP-Datei. Fügen Sie die folgende Funktion ein:

   function myUrl($atts, $content = null) { extract(shortcode_atts(array( "href" => 'http://' ), $atts)); return '<a href="'.$href.'">'.$content.'</a>';}

2. Verwandeln wir die Funktion in einen Shortcode:

   add_shortcode("url", "myUrl");

3. Der Shortcode wird nun erstellt. Sie können es auf Ihren Posts und Seiten verwenden:

   WordPress recipes

   Wenn Sie einen Beitrag speichern, zeigt der Shortcode einen Link mit dem Titel „WordPress recipes“ an, der auf http://www.wprecipes.com .

Erklärung des Codes. Um ordnungsgemäß zu funktionieren, muss unsere Shortcode-Funktion zwei Parameter verarbeiten: $atts und $content$atts ist das/die Shortcode-Attribut(e). In diesem Beispiel heißt das Attribut href und enthält einen Link zu einer URL. $content ist der Inhalt des Shortcodes, eingebettet zwischen der Domäne und dem Unterverzeichnis (dh zwischen „www.example.com “ und „/Unterverzeichnis“). Wie Sie dem Code entnehmen können, haben wir Standardwerte für $content und $atts .

Nun, da wir wissen, wie man Shortcodes erstellt und verwendet, schauen wir uns einige Killer ready-to-use Shortcodes an!

Erstellen Sie einen Shortcode „An Twitter senden“

Das Problem. Scheint, dass viele von euch meinen „An Twitter senden“ -Hack genossen haben. Ich habe diesen Hack auch sehr genossen, aber er hat einen Nachteil: Wenn Sie den Code in Ihre Single einfügen.PHP-Datei, der Link „An Twitter senden“ ist in jedem Beitrag sichtbar, den Sie möglicherweise nicht möchten. Es wäre besser, diesen Hack zu kontrollieren und angeben zu können, wann er zu einem Beitrag hinzugefügt werden soll. Die Lösung ist einfach: ein Shortcode!

Die Lösung. Dieser Shortcode ist einfach zu erstellen. Grundsätzlich holen wir uns einfach den Code aus dem Hack „An Twitter senden“ und verwandeln ihn in eine PHP-Funktion. Fügen Sie den folgenden Code in die Funktionen ein.PHP-Datei in Ihrem Thema:

function twitt() { return '<div><a href="http://twitter.com/home?status=Currently reading '.get_permalink($post->ID).'" title="Click to send this page to Twitter!" target="_blank">Share on Twitter</a></div>';}add_shortcode('twitter', 'twitt');

Um diesen Shortcode zu verwenden, schalten Sie einfach den Editor in den HTML-Modus und geben Sie dann Folgendes ein:

und ein Link „An Twitter senden“ wird dort angezeigt, wo Sie den Shortcode platziert haben.

• Gewusst wie: Erstellen Sie eine Schaltfläche „An Twitter senden“
• Twitter-Tools

Erstellen Sie einen Shortcode „RSS abonnieren“

Das Problem. Sie wissen bereits, dass eine sehr gute Möglichkeit, RSS-Abonnenten zu gewinnen, darin besteht, ein gut aussehendes Feld mit der Aufschrift „Abonnieren Sie den RSS-Feed.“ Aber noch einmal, wir wollen nicht wirklich etwas in unser Thema codieren und die Kontrolle über die Art und Weise verlieren, wie es erscheint. In diesem Hack erstellen wir einen Shortcode „RSS abonnieren“. Zeigen Sie es an einigen Stellen an und nicht an anderen, in Beiträgen oder auf Seiten, über oder unter dem Hauptinhalt.

Die Lösung. Wie üblich erstellen wir eine Funktion und verwandeln sie dann in einen Shortcode. Dieser Code geht in Ihre Funktionen ein.PHP-Datei. Vergessen Sie nicht, die Beispiel-Feed-URL durch Ihre eigene zu ersetzen!

function subscribeRss() { return '<div class="rss-box"><a href="http://feeds.feedburner.com/wprecipes">Enjoyed this post? Subscribe to my RSS feeds!</a></div>';}add_shortcode('subscribe', 'subscribeRss');

Formatieren Sie die Box. Sie haben wahrscheinlich die rss-box -Klasse bemerkt, die dem div-Element hinzugefügt wurde, das den Link enthält. Auf diese Weise können Sie die Box so gestalten, wie Sie möchten. Hier ist ein Beispiel für einige CSS-Stile, die Sie auf Ihr Feld „RSS abonnieren“ anwenden können. Fügen Sie es einfach in den Stil ein.CSS-Datei in Ihrem Thema:

.rss-box{ background:#F2F8F2; border:2px #D5E9D5 solid; font-weight:bold; padding:10px;}

Fügen Sie Google AdSense überall ein

Das Problem. Die meisten Blogger verwenden Google AdSense. Es ist sehr einfach, AdSense-Code in eine Themendatei wie die Seitenleiste aufzunehmen.PHP. Erfolgreiche Online-Vermarkter wissen jedoch, dass die Nutzer mehr auf Anzeigen klicken, die in den Inhalt selbst eingebettet sind.

Die Lösung. Um AdSense überall in Ihre Beiträge oder Seiten einzubetten, erstellen Sie einen Shortcode:

1. Öffnen Sie die Funktionen.PHP-Datei in Ihrem Thema und fügen Sie den folgenden Code ein. Vergessen Sie nicht, den JavaScript-Code mit Ihrem eigenen AdSense-Code zu ändern!

   function showads() { return '<div><script type="text/javascript"><!-- google_ad_client = "pub-XXXXXXXXXXXXXX"; google_ad_slot = "4668915978"; google_ad_width = 468; google_ad_height = 60; //--></script><script type="text/javascript"src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script></div>';}add_shortcode('adsense', 'showads');

2. Sobald Sie Funktionen gespeichert haben.php, Sie können den folgenden Shortcode verwenden, um AdSense überall auf Ihren Posts und Seiten anzuzeigen:

   Beachten Sie, dass unser AdSense-Code mit einem adsense div-Element umschlossen ist.CSS-Datei.

Erklärung des Codes. Der obige Code wird einfach verwendet, um AdSense-Anzeigen anzuzeigen. Wenn der Shortcode in einen Beitrag eingefügt wird, wird eine AdSense-Anzeige zurückgegeben. Es ist ziemlich einfach, aber auch, Sie werden mir zustimmen, eine echte Zeitersparnis!

Quellen:

• Wie: Einbetten von AdSense überall auf Ihre Beiträge

Einbetten eines RSS-Readers

Das Problem. Viele Leser schienen auch den kürzlich im Smashing Magazine veröffentlichten Beitrag „8 RSS Hacks for WordPress“ zu genießen. Lassen Sie uns nun unser Wissen über RSS und Shortcodes nutzen, um einen RSS-Reader direkt in unsere Beiträge und Seiten einzubetten.

Die Lösung. Um diesen Hack anzuwenden, fügen Sie wie üblich einfach den folgenden Code in die Funktion Ihres Themas ein.PHP-Datei.

//This file is needed to be able to use the wp_rss() function.include_once(ABSPATH.WPINC.'/rss.php');function readRss($atts) { extract(shortcode_atts(array( "feed" => 'http://', "num" => '1', ), $atts)); return wp_rss($feed, $num);}add_shortcode('rss', 'readRss');

Um den Shortcode zu verwenden, geben Sie Folgendes ein:

Das feed Attribut ist die einzubettende Feed-URL und num ist die Anzahl der anzuzeigenden Elemente.

Holen Sie sich Beiträge aus der WordPress-Datenbank mit einem Shortcode

Das Problem. Haben Sie sich jemals gewünscht, Sie könnten eine Liste verwandter Beiträge direkt im WordPress-Editor aufrufen? Sicher, das Plug-In „Verwandte Beiträge“ kann verwandte Beiträge für Sie abrufen, aber mit einem Shortcode können Sie ganz einfach eine Liste mit einer beliebigen Anzahl von Beiträgen aus einer bestimmten Kategorie abrufen.

Die Lösung. Fügen Sie diesen Code wie gewohnt in Ihre Funktionen ein.PHP-Datei.

function sc_liste($atts, $content = null) { extract(shortcode_atts(array( "num" => '5', "cat" => ’ ), $atts)); global $post; $myposts = get_posts('numberposts='.$num.'&order=DESC&orderby=post_date&category='.$cat); $retour='<ul>'; foreach($myposts as $post) : setup_postdata($post); $retour.='<li><a href="'.get_permalink().'">'.the_title("","",false).'</a></li>'; endforeach; $retour.='</ul> '; return $retour;}add_shortcode("list", "sc_liste");

Um es zu verwenden, fügen Sie einfach Folgendes in den WordPress-Editor ein, nachdem Sie in den HTML-Modus gewechselt haben:

Dies zeigt eine Liste von drei Beiträgen aus der Kategorie mit der ID 1 an. Wenn Sie nicht wissen, wie Sie die ID einer bestimmten Kategorie erhalten, wird hier ein einfacher Weg erklärt.

Erklärung des Codes. Nachdem die Argumente extrahiert und die globale Variable $posts erstellt wurde, verwendet die Funktion sc_liste() die Funktion get_posts() mit der Funktion numberpostsorderorderby und category Parameter, um die X neuesten Beiträge aus der Kategorie Y zu erhalten. Anschließend werden die Beiträge in eine ungeordnete HTML-Liste eingebettet und an Sie zurückgegeben.

Quelle:

1. WordPress: Création de shortcode avancé

Holen Sie sich das letzte Bild an einen Beitrag angehängt

Das Problem. In WordPress sind Bilder recht einfach zu bearbeiten. Aber warum es nicht noch einfacher machen? Schauen wir uns einen komplexeren Shortcode an, bei dem automatisch das neueste Bild an einen Beitrag angehängt wird.

Die Lösung. Öffnen Sie die Funktionen.PHP-Datei und fügen Sie den folgenden Code ein:

function sc_postimage($atts, $content = null) { extract(shortcode_atts(array( "size" => 'thumbnail', "float" => 'none' ), $atts)); $images =& get_children( 'post_type=attachment&post_mime_type=image&post_parent=' . get_the_id() ); foreach( $images as $imageID => $imagePost ) $fullimage = wp_get_attachment_image($imageID, $size, false); $imagedata = wp_get_attachment_image_src($imageID, $size, false); $width = ($imagedata+2); $height = ($imagedata+2); return '<div class="postimage" style="width: '.$width.'px; height: '.$height.'px; float: '.$float.';">'.$fullimage.'</div>';}add_shortcode("postimage", "sc_postimage");

Um den Shortcode zu verwenden, geben Sie im HTML-Modus einfach Folgendes in den Editor ein:

Code-Erklärung. Die sc_postimage() -Funktion extrahiert zuerst die Shortcode-Attribute. Anschließend wird das Bild mithilfe der WordPress-Funktionen get_children()wp_get_attachment_image() und wp_get_attachment_image_src() abgerufen. Sobald dies erledigt ist, wird das Bild zurückgegeben und in den Post-Inhalt eingefügt.

Quellen:

1. WordPress Shortcode: zeigen Sie einfach das letzte an den Beitrag angehängte Bild an

Das Problem. Selbst wenn Ihnen dieser Artikel gefallen hat, waren Sie möglicherweise etwas frustriert, da WordPress standardmäßig nicht zulässt, dass Shortcode in Sidebar-Widgets eingefügt wird. Zum Glück gibt es hier einen kleinen Trick, um die WordPress-Funktionalität zu verbessern und die Verwendung von Shortcodes in Sidebar-Widgets zu ermöglichen.

Die Lösung. Ein weiteres Stück Code zum Einfügen in Ihre Funktionen.php-Datei:

add_filter('widget_text', 'do_shortcode');

Das ist alles, was Sie brauchen, um Shortcodes in Sidebar-Widgets zuzulassen!

Erklärung des Codes. Was wir hier gemacht haben, ist ganz einfach: Wir haben der widget_text() -Funktion einen Filter hinzugefügt, um die do_shortcode() -Funktion auszuführen, die die API zum Ausführen des Shortcodes verwendet. Daher sind Shortcodes jetzt in Sidebar-Widgets aktiviert.

(al)