Der Leitfaden zum Erstellen benutzerdefinierter Shortcodes in WordPress

Die einfachste Art, Shortcodes darzustellen, besteht darin, sie als eine einfache Möglichkeit zu definieren, dynamische Inhalte in Ihre WordPress-Beiträge, -Seiten und -Seitenleisten einzufügen. Viele WordPress-Plugins und -Designs verfügen über Shortcodes, um spezielle Inhalte wie Kontaktformulare, Bildergalerien, Schieberegler und mehr hinzuzufügen. Der einfachste Weg, mit dem Erstellen und Verwenden von Shortcodes zu beginnen, ist ein Shortcode-Plugin. Wenn Sie jedoch daran interessiert sind, benutzerdefinierte Shortcodes in WordPress zu erstellen, schnallen Sie sich an, denn dieser Leitfaden ist für Sie. Wohlgemerkt, dies erfordert ein gewisses technisches Know-how im Programmieren, das wissen Sie wahrscheinlich bereits.

Es gibt also zwei Möglichkeiten, wie Sie WordPress-Shortcodes finden können, die für Sie von Nutzen sind:

1. sie können die Menge an Code reduzieren, die Sie schreiben müssen,
2. Sie vereinfachen die Nutzung von WordPress-Plugins, Themes und anderen Funktionen.

Der Prozess der Vorbereitung von WordPress für benutzerdefinierte Shortcodes

Obwohl es keineswegs eine Notwendigkeit ist, ist es im Allgemeinen eine gute Idee, Ihre benutzerdefinierten Shortcodes in einer eigenen Datei zu speichern. Andernfalls können Sie sie der Datei functions.php Ihres Themes hinzufügen. Beginnen Sie mit dem Erstellen einer neuen Datei mit dem Namen „custom-shortcodes.php“ und speichern Sie sie im selben Ordner wie die Datei functions.php Ihres Themes. Dann würden Sie in der neu erstellten Datei den folgenden Codeblock hinzufügen:
<?php
?>
Anschließend möchten Sie die Datei functions.php öffnen und die folgende Codezeile hinzufügen:
include('custom-shortcodes.php');
Glückwünsche! Sie können jetzt mit der Erstellung benutzerdefinierter Shortcodes in WordPress beginnen.

Erstellen grundlegender Shortcodes in WordPress

Wir erklären den Prozess der Erstellung eines einfachen WordPress-Shortcodes anhand eines Beispiels für das Einfügen eines einfachen Avatar-Bildes. Der erste Schritt ist das Erstellen der Shortcode-Funktion. In der Datei custom-shortcodes.php fügen Sie Folgendes hinzu:

Funktion simpleavatar_function() {
return '<img src="https://simpleavatar.com/wp-content/uploads/avatar-simple.png"
alt=”doti-avatar” width=”96″ height=”96″ class=”linksbündig” />':
}

Im obigen Codebeispiel gibt die simpleavatar_function ein vordefiniertes Bild mit dem Namen avatar-simple.png zurück. Der nächste Schritt wäre, den Shortcode mit der eingebauten Funktion add_shortcode bei WordPress zu registrieren . Stellen Sie immer noch in custom-shortcodes.php sicher, dass Sie die folgende Codezeile hinzufügen:

add_shortcode('simpleavatar', 'simpleavatar_function');

Nachdem Sie einen Shortcode mit der Funktion add_shortcode registriert haben, übergeben Sie das Shortcode-Tag ($tag) und die entsprechende Funktion ($func)/den Haken, der ausgeführt wird, wenn dieser Shortcode verwendet wird. In diesem speziellen Fall ist das Shortcut-Tag simpleavatar und der Hook dotiavatar_function.
Achten Sie darauf, dass Sie bei der Benennung von Tags nur Kleinbuchstaben verwenden und die Bindestriche weglassen. Unterstriche sind jedoch zulässig.
Nachdem Sie also den Shortcode erstellt und registriert haben, wäre es großartig, wenn Sie ihn ausprobieren würden. Wann immer Sie möchten, dass der einfache Avatar im Inhalt des Beitrags erscheint, verwenden Sie stattdessen einfach den Shortcode: [simpleavatar]

Erstellen von benutzerdefinierten Shortcodes in WordPress mit Parametern (Attributen)

Im vorherigen Beispiel hatten Sie nicht viel Platz, um Dinge zu ändern. Und nehmen wir an, dass Sie, anstatt ein einzelnes Bild zu pushen, in der Lage sein möchten, mit einem Parameter festzulegen, welches Bild verwendet werden soll. Eine gute Möglichkeit, dies zu tun, ist das Hinzufügen einiger Attribute ($atts). Fügen Sie also wie zuvor in custom-shortcodes.php eine weitere Funktion hinzu:

Funktion simplerating_function( $att=array() ) {

// Standardparameter einrichten

extrahieren(shortcode_atts(array(

'Bewertung' => '5'

), $atts));

gebe „<img src=\“http://simpleavatar.com/wp-content/uploads/$raing-star.png\“ zurück

alt=\"einfache Bewertung\" width=\"130\" height=\"190\" class=\"left-align\" />";

}

Was Sie oben geschrieben haben, akzeptiert einen einzigen Parameter: Bewertung. Wenn kein Bewertungswert übergeben wird, verwendet es einen Standard-String-Wert von 5. Dazu wird das Array von Attributen mit der integrierten Funktion shortcode_atts entpackt und dann die Standardwerte mit Werten kombiniert, die möglicherweise an die Funktion übergeben wurden . Vergessen Sie nicht, den Code zu registrieren :
add_shortcode('simplerating', 'simplerating_function');

Mit der erstellten Shortcode-Funktion und dem hinzugefügten Hook ist der Shortcode bereit, seinen Platz in Ihrem Beitragsinhalt zu finden:

[vereinfachende Bewertung=3]

Das wäre der Kern der Erstellung von selbstschließenden WordPress-Shortcodes. Es gibt jedoch noch eine andere Art, die Sie erstellen können.

Eine weitere Art von Shortcodes, die Sie erstellen können: einschließende Shortcodes

Bisher haben wir die in sich geschlossenen Shortcodes erklärt. Es gibt jedoch noch eine andere Art von Shortcode, die wir Ihnen vorstellen möchten: Einschließende Shortcodes.

Diese ermöglichen es Ihnen, ein Format im BBCode-Stil zu verwenden. Ein solcher Stil würde wie folgt aussehen:

[Shortcode]Inhalt[/Shortcode]

Das Einschließen von Shortcodes ist nützlich, wenn Sie den eingeschlossenen Inhalt manipulieren müssen. Nehmen wir zur weiteren Veranschaulichung an, dass Sie einen bestimmten Schaltflächenstil für Ihre Website verwenden. Sie können den HTML-Code verwenden, um diese Schaltfläche/diesen Stil jedes Mal zu generieren, wenn Sie ihn verwenden müssen. Sie können jedoch auch einen benutzerdefinierten umschließenden Shortcode einrichten, der dies für Sie erledigt.

Durch die Verwendung eines umschließenden Shortcodes können Sie den Fokus auf den Inhalt und nicht auf den Code richten.

Erstellen der umschließenden Shortcodes

Sie würden noch einmal zur Datei custom-shortcodes.php und fügen Sie Folgendes hinzu:

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

return '<a href="https://twitter.com/simpleavatar/" target="blank" class="doti-follow">' . $inhalt . '</a>';

}

In diesem Codeblock oben wird $content = null verwendet, um diese Funktion als einschließenden Shortcode zu identifizieren. Innerhalb dieser Funktion packen Sie Ihren Inhalt in den HTML-Code ein. Sie können wahrscheinlich den folgenden Schritt erraten – die Registrierung des Shortcodes:

add_shortcode('simplefollow', 'simplefollow_function');

Voila! Der Shortcode ist einsatzbereit.

Worauf es ankommt

Sobald Sie verstanden haben, wie das Erstellen benutzerdefinierter Shortcodes in WordPress funktioniert, werden Sie feststellen, dass der Prozess selbst einfach und mühelos ist. Wenn Ihnen dies jedoch zu groß erscheint, denken Sie daran, dass Sie den Prozess vollständig umgehen und sich für Plugins, Designs und andere Funktionen entscheiden können, mit denen Sie die Website nach Ihren Wünschen gestalten können.