Was sind Shortcodes in WordPress?

Was genau sind Shortcodes? Was machen Sie? Wie arbeiten Sie? Wenn Sie neu bei WordPress sind, haben Sie wahrscheinlich schon davon gehört, aber ihre genaue Bedeutung könnte immer noch ein Rätsel sein.

Das Wort „Shortcode“ wird in WordPress-Tutorials, in Listen mit WordPress-Themenfunktionen, in Foren usw. verwendet. Es ist überall. Shortcodes gehören zu WordPress und sind eines der Dinge, die die Plattform so funktional und benutzerfreundlich machen. Darüber hinaus werden alle Premium-WordPress-Themes mit einer Auswahl an benutzerdefinierten Shortcodes geliefert, die den Wert und die Benutzerfreundlichkeit des Themes erhöhen.

Aber selbst wenn Sie selbst Shortcodes verwendet haben, sind Sie sich wahrscheinlich immer noch nicht ganz sicher, was sie sind. Heute werden wir das beheben und eine einfache, aber gründliche Erklärung dieser praktischen Funktion anbieten.

Was sind Shortcodes?

Shortcodes sind im Wesentlichen genau das, was ihr Name vermuten lässt. Sie sind verkürzte, abgeschnittene Versionen von längerem Code, eine bestimmte Funktion ausführen. Im Backend sind sie durch Klammern gekennzeichnet und sehen in etwa so aus: [I am shortcode].

Shortcodes werden nicht in deinem Frontend angezeigt. Das tun sie, aber nicht in dieser Form. Je nachdem, wofür sie erstellt wurden, können sie wie eine Bildergalerie, ein Audioplayer usw. aussehen – unabhängig von ihrer Funktion.

Die Bedeutung von Shortcodes liegt in ihrem Anpassungspotential. WordPress ist Open Source, d. h. Sie können jeden beliebigen Code hinzufügen, damit eine Website so aussieht und funktioniert, wie Sie es möchten. Wenn Sie jedoch kein Entwickler sind, ist dies nicht gerade eine Option.

Hier kommen Shortcodes ins Spiel. Sie ermöglichen es „normalen“ WordPress-Benutzern, ihrer Website Funktionalitäten und Funktionen hinzuzufügen, ohne tatsächlich Code dafür schreiben zu müssen.

Schauen wir uns ein Beispiel für die gängige Verwendung von Shortcodes an. Dies ist eine grundlegende WordPress-Galerie, die wir erstellt, die Anzahl der Spalten festgelegt und unserer Seite hinzugefügt haben.

Unten sehen Sie die Galerie, die mit dem Visual Editor hinzugefügt wurde. Da es sich um einen WYSIWYG-Editor (What You See Is What You Get) handelt, wird der eigentliche Code umgangen. Aber es lässt nicht viel Raum für Anpassungen und macht es nicht einfacher, denselben oder ähnlichen Inhalt auf einer anderen Seite zu replizieren.

Wenn wir dieselbe Bildergalerie auf derselben Seite betrachten, diesmal jedoch mit dem Texteditor, sieht unsere Galerie so aus:

Wie Sie sehen, gibt es hier keine Bilder zur direkten Vorschau, sondern nur Code in eckigen Klammern – den Shortcode. Genauer gesagt der Galerie-Shortcode.

Sie fragen sich vielleicht, warum jemand lieber Shortcodes und den Texteditor verwendet, anstatt nur Bilder mit dem visuellen Editor hinzuzufügen. Schließlich ist es einfacher, wenn Sie genau sehen, wie Ihre Galerie aussehen wird.

Shortcodes ermöglichen jedoch zusätzliche Anpassungen direkt im Editor, und Sie können (per Kopieren/Einfügen) überall auf Ihrer Site platziert werden.

So verwenden Sie Shortcodes

Um Ihrer Site Shortcodes hinzuzufügen, gibt es drei Möglichkeiten.

Wenn Sie eines der Designs von Qode Interactive verwenden, ist das Hinzufügen von Shortcodes noch einfacher. Dies geschieht über das WPBakery Drag-and-Drop-Plugin zum Erstellen von Seiten, das mit den meisten unserer Designs kostenlos geliefert wird. Und du bekommst ein große Auswahl an benutzerdefinierten Shortcodes zur Auswahl, aber darüber werden wir gleich noch ausführlicher sprechen.

WordPress wird mit einigen vordefinierten Standard-Shortcodes geliefert, die Sie auf allen Ihren Seiten und Beiträgen verwenden und zu Widget-Bereichen hinzufügen können.

In unserem Beispiel von vorhin haben wir auf einer unserer Seiten einen Galerie-Shortcode platziert.

Jedes der in die Medienbibliothek hochgeladenen Bilder hat eine eindeutige ID. Der Shortcode ruft die zuvor erstellte Galerie mithilfe von Bild-IDs ab und zeigt sie auf Ihrer Seite an.

Der Shortcode kann zusätzliche Optionen enthalten, wie die Anzahl der Spalten (Spalten = ”X”), wobei X für die Anzahl der Spalten oder die Bildgröße (size=“Miniaturansicht“).

Der Shortcode für eine Galerie mit drei Spalten und kleinen Bildern wäre:

Was das Hinzufügen von Shortcodes in Ihrem Editor betrifft, können Sie dies sowohl im visuellen als auch im Texteditor tun. Im Texteditor sieht der Shortcode zum Hinzufügen eines Audioplayers (der einer der Standardplayer ist) so aus:

Wenn Sie zum Visual Editor wechseln, verwandelt sich Ihr Shortcode automatisch in ein neues Feld, das Sie nach Belieben bearbeiten und anpassen können:

In Ergänzung, Shortcodes können einem Widget-Bereich Ihrer Wahl hinzugefügt werden. Wenn Sie beispielsweise Ihrer Blog-Sidebar eine Galerie hinzufügen möchten, ziehen Sie einfach das Text-Widget in den Widget-Bereich der Blog-Sidebar. Es öffnet sich ein Feld, in das Sie Ihren Galerie-Shortcode eingeben oder einfügen können. Wenn Sie auf Speichern klicken, wird die Galerie in Ihrer Blog-Sidebar angezeigt.

Die gängigsten Shortcodes

Wie bereits erwähnt, enthält WordPress bereits einige Standard-Shortcodes. Einige der gängigsten Shortcodes sind:

Zusätzliche Shortcodes

Zusätzlich zu den Standard-Shortcodes, die mit Ihrer grundlegenden WordPress-Installation geliefert werden, gibt es Hunderte anderer, die Sie entweder verwenden können über Plugins hinzufügen oder die in deinem Theme enthalten sind.

Plugins

Viele Plugins führen ihre beabsichtigten Funktionen mit genauen Shortcodes aus. Zum Beispiel ein Plugin zum Hinzufügen einer Autorenbox zu Ihren Beiträgen, genannt Einfache Autorenbox, bietet einen Shortcode, den Sie überall in Ihrem Inhalt kopieren und einfügen können, um das Autorenfeld anzuzeigen.

Darüber hinaus gibt es Plugins, die ganze Sammlungen von Shortcodes für verschiedene Zwecke enthalten. Einer von ihnen ist Shortcodes Ultimate, das über 50 Shortcodes für visuelle und funktionale Elemente enthält, von Registerkarten, Schaltflächen und Trennwänden, Akkordeons und Karussells bis hin zu Post- und Benutzerdaten, Metadaten und mehr.

Interaktive Qode-Kurzcodes

Alle interaktiven Qode-Themen werden mit einer großen Auswahl an Shortcodes für verschiedene Zwecke geliefert. Shortcodes können einfach überall eingefügt werden, dank der WPBakery Page Builder-Plugin das kommt gebündelt mit unseren Themen.

Um die verfügbaren Shortcodes anzuzeigen und einen (oder mehrere) zu Ihrer Seite oder Ihrem Beitrag hinzuzufügen, klicken Sie einfach auf das Pluszeichen (Element hinzufügen) in der Backend-Version des Builders. Es öffnet sich eine Liste der verfügbaren Shortcodes, in denen Sie sie einfach hinzufügen können, indem Sie darauf klicken oder in der Suchleiste in der oberen rechten Ecke nach Namen suchen.

Um auf benutzerdefinierte Shortcodes zuzugreifen, die von Qode Interactive entwickelt und in Ihrem Theme enthalten sind, klicken Sie einfach auf die Registerkarte mit dem Namen „von…“, gefolgt vom Namen des Autors des Themes (Qode, Elated, Edge, Select, Mikado) oder dem Namen des Themes selbst . In unserem Beispiel verwenden wir unser Sahel-Theme, daher steht auf der Registerkarte „von SAHEL“.

Sobald Sie auf den Shortcode Ihrer Wahl klicken, sehen Sie alle allgemeinen und Gestaltungsoptionen, die Sie anpassen können.

Wenn Sie mit der Einrichtung fertig sind, klicken Sie auf Änderungen speichern und überprüfen Sie Ihre Live-Seite, um zu sehen, ob der Shortcode tut, was er soll.

Abschließende Gedanken

Shortcodes sind eines der Dinge, die WordPress so schön und mächtig machen. Das Beste an ihnen ist, dass sie sowohl für Entwickler als auch für Anfänger nützlich sind. Entwickler können ihre eigenen Shortcodes erstellen, wenn sie möchten, und einfache und fortgeschrittene Benutzer können Funktionen hinzufügen, das Design optimieren und die Site anpassen, ohne sich mit dem tatsächlichen Code zu beschäftigen.

Alles ist einfacher zu bedienen, wenn Sie wissen, wie es funktioniert. Hoffentlich ist es uns gelungen, Shortcodes und ihre Verwendung für Sie aufzuschlüsseln, damit Sie sie optimal nutzen und das Design und die Funktionalität Ihrer Website verbessern können.