So erstellen Sie WordPress-Shortcodes und arbeiten mit ihnen

WordPress-Shortcodes sind kleine Tags, die als Shortcuts zum Ausführen bestimmter Funktionen in Beiträgen und Seiten verwendet werden. Sie erkennen Shortcodes an eckigen Klammern, die ein einfaches Wort oder einen Satz umgeben. Sie wurden in Version 2.5 mit der Mission eingeführt, Menschen zu helfen, Funktionen auf einfache Weise auszuführen.

Wie Sie vielleicht bereits wissen, verwendet WordPress die Programmiersprache PHP, um sich selbst zu starten. Wenn Sie also Posts und Seiten eine bestimmte Funktion direkt hinzufügen möchten, müssen Sie den Code im Texteditor schreiben. Stattdessen ermöglichen Shortcodes Benutzern, den gesamten Codeblock durch einen einfachen Begriff zu ersetzen und ihn auszuführen, indem sie einfach einen Beitrag veröffentlichen. Erstaunlich, nicht wahr?

So verwenden Sie WordPress-Shortcodes

Um Shortcodes zu verwenden, muss man nicht wissen, wie man codiert oder wie sie im Backend funktionieren. WordPress selbst sowie die meisten WordPress-Themes und -Plugins verwenden verschiedene Shortcodes, um die Verwendung vieler erweiterter Funktionen zu ermöglichen.

Um beispielsweise die gesamte Bildergalerie anzuzeigen, müssen Sie nur den Shortcode [Galerie] verwenden , der mit WordPress installiert wird. Die meisten Shortcodes können in ihrer Grundform wie im vorherigen Beispiel verwendet werden.

Shortcode-Parameter

In den meisten Fällen können Shortcodes zusätzliche Parameter haben . Durch Hinzufügen zusätzlicher Informationen können Sie die Ausgabe anpassen und ändern. Während beispielsweise der triviale Shortcode [Galerie] alle Bilder anzeigt, die an den Beitrag angehängt sind, ist es möglich, dies zu ändern. Mit dem Galerie-Shortcode können Sie Bilder anhand ihrer ID angeben, sodass Sie nur die bestimmten Bilder anzeigen oder sogar Bilder einschließen können, die nicht Teil dieses bestimmten Beitrags sind.

Außerdem ist es möglich, eine Größe der Galerie und viele andere Dinge zu definieren, indem zusätzliche Parameter bereitgestellt werden. Hier ist ein Beispiel:

Die Galerie aus diesem Beispiel würde nur Bilder mit bestimmten ID-Nummern anzeigen. In diesem Fall würde die Größe automatisch auf mittel geändert. Und das alles mit einem einfachen Shortcode. Stellen Sie sich nun vor, wie das Ganze aussehen würde, wenn Sie den PHP-Code manuell hinzufügen würden, der Dutzende, wenn nicht Hunderte von Zeilen hätte. Danke, Shortcodes!

Start- und End-Tags

Ein Google Maps-Plugin kann es Ihnen beispielsweise ermöglichen, über den Shortcode einen Standort auf den Karten anzuzeigen. Die meisten dieser Plugins haben Start- und End-Tags, während die Adresse dazwischen geschrieben werden sollte. Hier ist ein Beispiel:

[[maps]]New York, USA[[/maps]]

Wie Sie am Beispiel sehen können, beginnt das End-Tag immer mit einem Schrägstrich „/“. Durch beide Tags kann WordPress die Teile von Shortcodes leichter identifizieren.

Im Texteditor arbeiten

Obwohl sie nur Abkürzungen zu Funktionen sind, sind Shortcodes eigentlich WordPress-spezifische Kryptogramme. Wenn Sie also versuchen, einen Shortcode im visuellen Editor zu schreiben, zeigt WordPress Ihnen sofort die Ausgabe (oder nur den Platzhalter) dieses Shortcodes. Wenn Sie dem Galerie-Beispiel gefolgt sind und den Shortcode im Visual Editor geschrieben haben, würden Sie sehen, dass WordPress sofort seinen Inhalt anzeigt (siehe das erste Bild in diesem Beitrag, um zu sehen, wie das funktioniert).

Standard-WordPress-Shortcodes

Shortcodes werden normalerweise von Themes und Plugins verwaltet. Jeder Entwickler kann Shortcodes selbst registrieren, sodass jeder anders ist. Was ein Shortcode macht, welche Parameter und Funktionen er hat, hängt ausschließlich von dem spezifischen Plugin und Theme ab, das Sie verwenden.

Zum Beispiel kann ein Plugin, das Ihnen hilft, einen Standort auf Google Maps anzuzeigen, [[maps]]-Shortcode haben, eines, das Abonnementformulare anzeigt, verwendet [[form]] und so weiter.

WordPress wird jedoch mit einer Reihe von Standard-Shortcodes geliefert, die Sie verwenden können, ohne zusätzliche Erweiterungen zu installieren. Standardmäßig sind dies Shortcodes, mit denen Sie arbeiten können:

Escaping Shortcodes (Text der Shortcodes anzeigen, ohne ihn auszuführen)

Manchmal möchten Sie möglicherweise Text anzeigen, der einen Shortcode darstellt, anstatt ihn auszuführen. Wenn Sie versuchten, sowohl dem Text- als auch dem visuellen Editor einen Shortcode hinzuzufügen, stellten Sie fest, dass er bei beiden Gelegenheiten ausgeführt wurde.

Wenn Sie einen Shortcode mit Start- und End-Tags anzeigen möchten, verwenden Sie nur die erste und die letzte doppelte Klammer: [[maps]New York, USA[/maps]]

Beim Arbeiten im Texteditor können Sie eckige Klammern auch durch ihre Codes ersetzen. Anstelle von „[“ können Sie also „[“ verwenden und stattdessen „]“ verwenden Sie „]“. Beispiel: [Kurzwahlnummer&#93 ; zeigt auch den Shortcode an, ohne ihn auszuführen.

So erstellen Sie einen einfachen Shortcode

Wenn Sie täglich Artikel in WordPress schreiben, gibt es Zeiten, in denen Sie sich wiederholen und immer wieder etwas eingeben müssen. Es spielt keine Rolle, ob es sich um eine Website-URL, einen langen Satz oder vielleicht ein Stück HTML-Code handelt, den Sie ständig neu schreiben, Sie sollten in Betracht ziehen, einen Shortcode dafür zu schreiben.

Und mit dieser einfachen Funktion müssen Sie kein Programmierer sein, oder Sie werden nicht einmal einen einstellen, der es Ihnen leicht macht. Folgen Sie den nächsten Schritten und erstellen Sie sich einen benutzerdefinierten Shortcode:

1. Öffnen Sie die Datei function.php im Menü Darstellung -> Editor
2. Fügen Sie den folgenden Code am Ende der Datei ein:

 Funktion fsg_shortURL() {
 'http://www.firstsiteguide.com' zurückgeben;
 }
 add_shortcode('fsg', 'fsg_shortURL');

3. Gehen Sie zum Texteditor und geben Sie [fsg] ein , um die URL anstelle des Shortcodes zu erhalten

Es war nicht so schwer, oder?

Fortgeschritteneres Beispiel: Bild-Shortcode hinzufügen

Durch Platzieren des folgenden Codes in der functions.php können Sie den Shortcode zum Platzieren eines Bildes mit benutzerdefinierten Breiten- und Höhenattributen erstellen:

1. Gehen Sie zur Datei functions.php
2. Fügen Sie den folgenden Code ein:

 Funktion img_shortcode( $atts , $content = null ) {

	extrahieren( shortcode_atts(
		Array (
			'Breite' => '',
			'Höhe' => '',
		), $atts )
	);
Rückkehr '';
}
add_shortcode( 'img', 'img_shortcode');

3. Texteditor öffnen:

Hier können Sie [img width='x' height='y'] http://… [/img] Shortcode verwenden, wobei „x“ und „y“ Zahlen sind, die Breite und Höhe in Pixeln darstellen.

Sie können bei Bedarf problemlos weitere Bildattribute hinzufügen. Sehen Sie sich die Liste aller Bildattribute auf W3 Schools an.

So verwenden Sie Shortcodes im Text-Widget

Shortcodes können verschiedene Funktionen enthalten, die Sie zu Ihrer WordPress-Website hinzufügen können. Egal, ob Sie eines für sich selbst erstellt haben oder es mit einem Thema oder einem gerade installierten Plugin geliefert wurde, Sie werden wahrscheinlich die ganze Zeit Shortcodes verwenden. Da Sie wirklich Zeit sparen und davon profitieren können, gibt es keinen Grund, keine Shortcodes zu verwenden.

Wenn Sie gerade mit dem Erstellen Ihrer WordPress-Website begonnen haben, haben Sie möglicherweise nur Shortcodes im Post-Editor verwendet. Aber die Wahrheit ist, dass Sie Shortcodes praktisch überall verwenden können .

Wenn Sie beispielsweise das 5sec Google Maps PRO-Plugin verwenden, mit dem Sie mühelos Karten mit unzähligen Pins erstellen können, möchten Sie die Karte möglicherweise per Shortcode direkt in Ihr Text-Widget einfügen und Ihren Standort in der Seitenleiste anstelle einer einzelnen anzeigen Post. Wenn Ihr Theme jedoch keine Shortcodes in Widgets unterstützt, müssen Sie die Funktion selbst aktivieren, und das werden wir in diesem Artikel zeigen.

Wenn Sie in Ihren PHP-Dateien einen Shortcode verwenden müssen (z. B. wenn Sie den Code in Ihrer header.php-Datei ausführen und den Shortcode überall dort ausführen möchten, wo der Header vorhanden ist), können Sie dies einfach tun, indem Sie den Code darum wickeln . Aber wenn Sie versucht haben, einen Shortcode in Ihrem Text-Widget zu verwenden, wie in dem oben erwähnten Beispiel, sind Sie enttäuscht, weil das einfach nicht funktioniert und das Widget den Shortcode anstelle seines Inhalts anzeigt. Sofern Ihr Theme die Funktion nicht bereits registriert hat, müssen Sie sie selbst aktivieren.

Wenn Sie also einen Shortcode in ein Text-Widget einfügen und ausführen möchten, machen Sie sich keine Sorgen; Sie können es in Sekundenschnelle erledigen:

1. Öffnen Sie die Funktionen.php
2. Kopieren Sie die folgenden zwei Zeilen und fügen Sie sie ein:

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

3. Änderungen speichern

Während es eigentlich ausreicht, nur die zweite Zeile zu verwenden, damit der Shortcode funktioniert, möchten Sie die erste Zeile, um das automatische Einfügen von Absatz- und Umbruch-Tags durch WordPress zu vermeiden, bei denen Sie unbewusst Zeilenumbrüche erstellen, indem Sie den Text in einem Widget formatieren . Nur für den Fall, dass Sie einen Shortcode in eine separate Zeile einfügen , entfernt unautop diese Absatz-Tags und der Shortcode funktioniert wie ein Zauber.

Jetzt können Sie zu Darstellung -> Widgets navigieren und das Text-Widget an die gewünschte Stelle ziehen. Wenn Sie einen Shortcode direkt in Ihr Text-Widget schreiben (das natürlich auf Ihrer Site registriert ist), wird es so ausgeführt, wie es in den Post-Editor eingegeben wurde.

Ebenso können Sie PHP-Code von Ihrem Text-Widget ausführen. Es war einfach genug, nicht wahr? Genießen Sie Ihre Shortcodes.

Shortcodes sind überall

Wenn Sie gerade erst einen WordPress-Blog starten, erscheinen Shortcodes möglicherweise überflüssig und schwer zu verstehen. Meistens wird es möglich sein, Shortcodes zu vermeiden, indem man eine benutzerfreundliche Oberfläche verwendet, die von einem Plugin bereitgestellt wird. Aber wenn Sie sich mehr mit dem Blog beschäftigen und mehr Plugins verwenden, werden Sie die wahre Macht von Shortcodes verstehen.

Ihre Verwendung wird zur Routine, und Sie werden sich schnell daran gewöhnen, in jedem neuen Beitrag, den Sie erstellen, eckige Klammern zu schreiben. Nehmen Sie sich also ein paar Minuten Zeit und verwenden Sie diesen Artikel, um die Grundlagen zu erlernen.