7 wesentliche Tipps zur Verwendung von Shortcodes in WordPress

Egal, ob Sie ein erfahrener WordPress-Benutzer oder ein absoluter Anfänger sind, die Verwendung von Shortcodes kann neue Wege zur Anpassung Ihrer Website eröffnen, ohne dass Programmierkenntnisse erforderlich sind.

Shortcodes ermöglichen es Ihnen, verschiedene Funktionen zu Beiträgen, Seiten und Widgets hinzuzufügen, ohne tatsächlich Code schreiben zu müssen. Viele WordPress-Plugins und -Themes verwenden ebenfalls Shortcodes, um verschiedene Elemente wie Preisgitter und Veranstaltungskalender hinzuzufügen.

Bei WPBeginner haben wir durchweg Shortcodes und Shortcode-Plugins verwendet, wenn wir WordPress-Websites für unsere Kunden erstellt oder sie für unsere Leser getestet haben. Dabei haben wir einige Wege gelernt, um die Verwendung von Shortcodes einfacher und effektiver zu gestalten.

In diesem Artikel teilen wir einige wichtige Tipps zur Verwendung von Shortcodes in WordPress.

Was sind Shortcodes in WordPress?

In WordPress sind Kurzbefehle kleine Code-Schnipsel, die in eckige Klammern eingeschlossen sind und es Ihnen ermöglichen, dynamische Inhalte oder Funktionen zu Ihren Beiträgen, Seiten oder Widgets hinzuzufügen.

Hier ist ein Beispiel:

[example_shortcode]

Wenn Sie Inhalte zu einer WordPress-Website hinzufügen, durchlaufen diese automatisch Sicherheitsprüfungen und Filter, um sicherzustellen, dass kein schädlicher Code in Beiträge, Seiten oder Kommentare gelangt. Das bedeutet, dass Sie in diesen Bereichen keinen Code direkt schreiben können.

Es gibt jedoch Zeiten, in denen Sie möglicherweise spezifischen Code zu diesen Abschnitten hinzufügen müssen. Kurzbefehle bieten eine Möglichkeit, dies zu tun.

Sie fungieren als Abkürzungen, um erweiterte Funktionen wie schöne responsive Slider, Kontaktformulare, Bildergalerien oder eingebettete Videos auf einfache und benutzerfreundliche Weise hinzuzufügen.

Anstatt beispielsweise manuell einen komplexen HTML- oder JavaScript-Snippet einzubetten, können Sie einen Shortcode verwenden, um dasselbe Ergebnis mit nur einer Textzeile zu erzielen. Dies macht Shortcodes für Anfänger und Experten gleichermaßen unglaublich nützlich.

Doch selbst wenn Shortcodes einfach zu verwenden sind, kann das Wissen um die besten Methoden zum Hinzufügen und Verwalten Ihnen Zeit sparen, Ihren Workflow verbessern und Probleme verhindern.

Dennoch werfen wir einen Blick auf einige Tipps zur Verwendung von Shortcodes in WordPress. Sie können auf die folgenden Links klicken, um zu einem beliebigen Tipp zu springen:

• Wissen, wann man keine Shortcodes verwenden sollte
• Machen Sie Ihre Shortcodes zukunftssicher
• So suchen Sie nach Shortcodes in Ihrem WordPress-Theme
• Shortcodes in Widgets verwenden
• Tipp 5: Shortcode in Theme-Dateien hinzufügen
• Tipp 6: Einen defekten Kurzbefehl ausblenden
• Tipp 7: Kurzbefehle finden, die in Beiträgen verwendet werden
• Bonus: Häufige Shortcode-Fehler, die Sie vermeiden sollten

Tipp 1: Wissen, wann man Shortcodes nicht verwenden sollte

Shortcodes können unglaublich nützlich sein, aber es ist nicht immer die beste Idee, sich für jeden Beitrag oder jede Seite auf sie zu verlassen. Viele WordPress-Themes behaupten, über 200 Shortcodes zu verfügen, aber die Verwendung von zu vielen davon kann auf lange Sicht Probleme verursachen.

Zum Beispiel, wenn Sie einen Shortcode eines Themes verwenden, um Call-to-Action (CTA)-Buttons in Ihren Beiträgen zu erstellen, binden Sie sich an dieses Theme. Wenn Sie jemals das Theme wechseln, funktionieren diese Shortcodes möglicherweise nicht mehr und hinterlassen kaputte oder unleserliche Inhalte.

Wenn Sie nach einer Möglichkeit suchen, CTA-Buttons zu Ihren Beiträgen hinzuzufügen, sollten Sie unseren Leitfaden zum Hinzufügen von CSS-Buttons in WordPress ohne die Verwendung von Shortcodes lesen.

Sie können auch den integrierten WordPress-Button-Block verwenden, um Call-to-Action-Buttons ohne Code zu erstellen.

Ähnlich verhält es sich, wenn Sie Shortcodes für sich wiederholende Elemente wie Bannerwerbung oder Signaturtext am Ende Ihrer Beiträge verwenden. In diesem Fall empfehlen wir, einen anderen Ansatz zu wählen. Sie könnten ein WordPress-Plugin verwenden oder mit einem Entwickler zusammenarbeiten, um diese Elemente zu Ihrem Blog hinzuzufügen.

Diese Methode gewährleistet ein konsistentes Styling und erleichtert die zukünftige Aktualisierung oder Entfernung von Elementen.

Denken Sie schließlich daran, dass Kurzbefehle, die über Beiträge verstreut sind, mühsam zu entfernen sein können, wenn Sie sich entscheiden, sie nicht mehr zu verwenden. Jeder Beitrag manuell zu bearbeiten ist zeitaufwendig.

Deshalb ist es wichtig, vorsichtig zu sein, wie und wo Sie Shortcodes verwenden. Beschränken Sie sich darauf, sie nur dort hinzuzufügen, wo sie notwendig sind, da eine übermäßige Verwendung später größere Probleme verursachen kann.

Tipp 2: Zukunftsfähige Shortcodes

Shortcodes sind großartig, aber wenn Ihr Theme sie bereitstellt, sollten Sie es sich zweimal überlegen, sie exzessiv zu verwenden.

Das liegt daran, dass Ihr neues Theme wahrscheinlich nicht denselben Shortcode unterstützt, wenn Sie jemals das Theme wechseln, was zu fehlerhaften Inhalten führt.

Um dieses Problem zu vermeiden, können Sie zu einem standortspezifischen Plugin wechseln. Auf diese Weise bleiben Ihre Shortcodes unabhängig und funktionieren unabhängig davon, welches Theme Sie verwenden.

Um dies zu tun, können Sie den Shortcode-Snippet einfach in der functions.php-Datei Ihres Themes lokalisieren und kopieren. Fügen Sie ihn dann in ein sitespezifisches Plugin ein, um sicherzustellen, dass er funktionsfähig bleibt.

Die direkte Bearbeitung der functions.php-Datei ist jedoch nicht ideal, da ein kleiner Fehler Ihre gesamte Website zum Absturz bringen kann.

Hier kommt WPCode ins Spiel. Unserer Meinung nach bietet es die einfachste Möglichkeit, ein Shortcode-Snippet zu Ihrem Theme hinzuzufügen.

Es ermöglicht Ihnen, mit nur wenigen Klicks benutzerdefinierten Code hinzuzufügen und hebt sogar Fehler in Ihren Code-Snippets hervor.

Wir haben das Plugin auf unserer Website gründlich getestet und festgestellt, dass es sehr anfängerfreundlich ist. Weitere Informationen finden Sie in unserem WPCode-Testbericht.

Außerdem stürzt Ihre Website nicht ab, wenn Sie versehentlich falschen Code hinzufügen, was ihn zu einer zuverlässigen Option für jedermann macht.

Weitere Informationen finden Sie in unserem Leitfaden zum einfachen Hinzufügen von benutzerdefiniertem Code in WordPress.

Tipp 3: So suchen Sie nach Shortcodes in Ihrem WordPress-Theme

Um sicherzustellen, dass Ihre Shortcodes funktionsfähig bleiben, ist es wichtig zu wissen, wie sie aussehen und wie Sie sie in Ihrem Theme finden.

Zuerst müssen Sie den Ordner Ihres Themes öffnen, der sich normalerweise unter /wp-content/themes/ihr-theme-name/ befindet.

Sie werden ihn in der functions.php-Datei suchen wollen, oder wenn das Theme einen „includes“-Ordner hat, dann dort.

Sobald Sie die Datei gefunden haben, öffnen Sie sie und suchen Sie nach dem Begriff ‚add_shortcode‘. Dies hilft Ihnen, alle Shortcodes zu finden, die derzeit von Ihrem WordPress-Theme verwendet werden.

Hier ist ein Beispiel dafür, wie ein Shortcode-Snippet aussieht:

function my_shortcode_function() { 
$i = '<p>Hello World!</p>';
return $i;
} 
add_shortcode('my-shortcode', 'my_shortcode_function');

Dieser Code erstellt einen Shortcode „my-shortcode“, der eine einfache Textbegrüßung zurückgibt und wie folgt in einen WordPress-Beitrag oder eine Seite eingebettet werden kann:

[my-shortcode]

Für weitere Details finden Sie unsere Anleitung zum Hinzufügen eines Shortcodes in WordPress.

Tipp 4: Shortcodes in Widgets verwenden

Viele Benutzer denken, Shortcodes seien nur für Beiträge und Seiten, aber das ist nicht der Fall.

Sie können sie auch in WordPress-Widgets verwenden, was Ihnen noch mehr Flexibilität beim Hinzufügen dynamischer Inhalte zu Seitenleisten, Fußzeilen und anderen Widget-fähigen Bereichen bietet.

Besuchen Sie dazu die Seite Darstellung » Widgets im WordPress-Dashboard und klicken Sie auf die Schaltfläche „Block hinzufügen“ (+). Dies öffnet das Blockmenü, aus dem Sie den Block „Shortcode“ hinzufügen müssen.

Um dies zu tun, müssen Sie zum richtigen Editor für Ihr Theme navigieren. Wenn Sie ein klassisches Theme verwenden, gehen Sie im WordPress-Dashboard zu Darstellung » Widgets. Wenn Sie ein Block-Theme verwenden, gehen Sie stattdessen zu Darstellung » Editor.

Sobald Sie sich im richtigen Editor befinden, klicken Sie einfach auf die Schaltfläche „Block hinzufügen“ (+), um das Blockmenü zu öffnen. Suchen und fügen Sie von dort den Block „Shortcode“ zu Ihrer Seitenleiste oder einem anderen Widget-Bereich hinzu.

Beachten Sie, dass die obige Methode nur funktioniert, wenn Sie ein klassisches Theme wie Hestia verwenden.

Wenn Sie jedoch ein Block-Theme verwenden, können Sie mit dem Full Site Editor einen Shortcode in jeden Widget-Bereich einfügen.

Für weitere Details siehe unser Tutorial zum Verwenden von Shortcodes in Ihren WordPress-Sidebar-Widgets.

Tipp 5: Shortcode in Theme-Dateien hinzufügen

Müssen Sie einen Shortcode außerhalb von Beiträgen, Seiten oder Widgets hinzufügen?

Wenn Sie einen Shortcode zu einer benutzerdefinierten Theme-Datei oder einem bestimmten Abschnitt Ihres Themes hinzufügen möchten, können Sie dies ganz einfach tun, indem Sie den Shortcode direkt in den Code Ihres Themes einfügen.

Zum Beispiel, nehmen wir an, Sie haben eine benutzerdefinierte Seiten-Vorlage erstellt und möchten einen responsiven Slider mit einem Shortcode einfügen.

Anstatt den Shortcode manuell in den Inhaltsbereich einzufügen, können Sie ihn direkt im Theme ausgeben. Fügen Sie einfach Ihren Shortcode wie folgt hinzu:

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

Diese Technik ist nützlich, wenn Sie Shortcodes in Bereichen wie benutzerdefinierten Seiten, Kopfzeilen, Fußzeilen oder anderen Teilen Ihres Themes einbetten möchten, die nicht an den typischen Inhaltseditor gebunden sind.

Wenn Sie Hilfe benötigen, sehen Sie sich bitte unseren Leitfaden zum Einfügen von Snippets aus dem Web in WordPress an.

Tipp 6: Einen defekten Kurzbefehl ausblenden

Oft ändern Benutzer ihre Themes, ohne zu erkennen, dass ihre alten Shortcodes nicht funktionieren. Manchmal erfahren sie es nach Monaten, wenn ein Benutzer ihren alten Beitrag besucht und dort seltsamen Text findet.

Nun, Sie haben zwei Möglichkeiten, dies zu beheben. Sie können entweder den defekten Shortcode manuell aus jedem Beitrag entfernen oder ihn ausblenden. Wir empfehlen, ihn auszublenden, da dies eine schnellere Lösung ist.

Dazu müssen Sie das WPCode Plugin installieren und aktivieren. Nach der Aktivierung besuchen Sie die Seite Code Snippets » + Snippet hinzufügen und wählen Sie die Option „Neuen benutzerdefinierten Code hinzufügen (Neues Snippet)“.

Dies führt Sie zur Seite „Benutzerdefinierten Ausschnitt erstellen“, auf der Sie aus dem Dropdown-Menü die Option „PHP-Ausschnitt“ auswählen müssen.

Fügen Sie dann den folgenden Code in das Feld „Code-Vorschau“ ein und schalten Sie den Schalter „Inaktiv“ auf „Aktiv“.

add_shortcode( 'shortcodetag', '__return_false' );

Vergessen Sie nicht, shortcodetag durch Ihren Shortcode-Namen zu ersetzen. Klicken Sie abschließend auf die Schaltfläche „Snippet speichern“, um Ihre Einstellungen zu speichern.

Dieser Code fügt nun den verwaisten Kurzbefehl ohne Ausgabe wieder hinzu.

Tipp 7: Kurzbefehle finden, die in Beiträgen verwendet werden

Wenn Sie den Hack in Tipp 6 nicht verwenden möchten und alle Shortcodes manuell entfernen möchten, besteht der erste Schritt darin, alle Beiträge zu finden, die den Shortcode verwenden.

Fügen Sie dazu den folgenden Code in die functions.php-Datei Ihres Themes oder in WPCode ein:

function wpb_find_shortcode($atts, $content=null) {
ob_start();
extract( shortcode_atts( array(
		'find' => '',
	), $atts ) );

$string = $atts['find'];

$args = array(
	's' => $string,
	);

$the_query = new WP_Query( $args );

if ( $the_query->have_posts() ) {
        echo '<ul>';
	while ( $the_query->have_posts() ) {
	$the_query->the_post(); ?>
	<li><a href="<?php  the_permalink() ?>"><?php the_title(); ?></a></li>
	<?php
	}
        echo '</ul>';
} else {
        echo "Sorry no posts found";
}

wp_reset_postdata();
return ob_get_clean();
}
add_shortcode('shortcodefinder', 'wpb_find_shortcode');

Dieser Code erstellt einfach einen Shortcode namens shortcodefinder. Er führt eine WordPress-Abfrage aus und listet Beiträge mit einem bestimmten Shortcode-Tag auf.

Wenn Sie zum Beispiel alle Beiträge finden möchten, die den Shortcode [contact-form] enthalten, geben Sie einfach [shortcodefinder find=’contact-form’] in eine WordPress-Seite ein und speichern Sie sie. Wenn Sie die Seite nun in der Vorschau anzeigen, können Sie alle Beiträge sehen, die den Shortcode enthalten.

Für detailliertere Anweisungen lesen Sie unseren Leitfaden, wie Sie ungenutzte Shortcodes in WordPress finden und ausblenden.

Bonus: Häufige Shortcode-Fehler, die Sie vermeiden sollten

Obwohl Shortcodes für viele Websites nützlich und notwendig sind, machen Benutzer oft einige häufige Fehler, wenn sie mit ihnen arbeiten.

Diese Fehler können zu fehlerhafter Funktionalität, unübersichtlichem Code oder schlechter Website-Performance führen. Hier sind fünf wichtige Fehler, auf die Sie achten sollten und wie Sie diese vermeiden können:

• Überladung von Seiten mit zu vielen Shortcodes: Die Verwendung von zu vielen Shortcodes auf einer einzigen Seite kann zu langsamen Ladezeiten und einem unübersichtlichen Design führen. Deshalb empfehlen wir, die Verwendung von Shortcodes auf wesentliche Elemente zu beschränken.
• Verschachtelte Shortcodes falsch anwenden: Verschachtelte Shortcodes (die Verwendung eines Shortcodes innerhalb eines anderen) können knifflig sein und Probleme verursachen, wie z. B. dass ein Shortcode nicht funktioniert oder eine Seite falsche Inhalte anzeigt. Wenn Sie Shortcodes verschachteln müssen, testen Sie sie zuerst, um sicherzustellen, dass sie wie erwartet angezeigt werden.
• Shortcodes nicht richtig schließen: Manchmal vergessen Benutzer, Shortcodes zu schließen, was das Layout eines Beitrags oder einer Seite beschädigen kann. Deshalb müssen Sie immer sicherstellen, dass Ihr Shortcode ordnungsgemäß mit Klammern geöffnet und geschlossen wird. Stellen Sie bei Shortcodes, die nur einmal verwendet werden, sicher, dass Sie keine zusätzlichen Leerzeichen oder Symbole hinterlassen.
• Verwendung von Kurzcodes in nicht unterstützten Bereichen: Bestimmte Bereiche von WordPress unterstützen Kurzcodes möglicherweise nicht standardmäßig. Der Versuch, einen Kurzcode dort zu verwenden, kann zu fehlerhaften oder unsichtbaren Inhalten führen. Überprüfen Sie, ob Widgets oder benutzerdefinierte Felder Kurzcodes unterstützen, bevor Sie sie einfügen. Sie können oft ein Plugin verwenden, um Kurzcodes in nicht unterstützten Bereichen zu aktivieren.
• Shortcodes nicht auf Mobilgeräten testen: Viele Benutzer vergessen zu überprüfen, wie Elemente, die mit Shortcodes erstellt wurden, auf Mobilgeräten aussehen. Was auf einem Desktop großartig aussieht, kann auf mobilen Bildschirmen fehlerhaft oder schlecht dargestellt werden. Vorschau Ihrer Seiten und Beiträge immer auf verschiedenen Geräten, um sicherzustellen, dass die Ausgabe des Shortcodes responsiv ist.

Indem Sie diese häufigen Fehler vermeiden und diese Tipps befolgen, können Sie eine reibungslosere Erfahrung bei der Verwendung von Shortcodes auf Ihrer WordPress-Website erzielen.

Wir hoffen, diese Tipps haben Ihnen geholfen zu lernen, wie man Shortcodes verwendet und das Beste daraus in WordPress macht. Möglicherweise möchten Sie auch unseren Leitfaden für Anfänger zum Thema Kopieren und Einfügen in WordPress ohne Formatierungsprobleme und unsere Expertentipps zum Meistern des WordPress-Inhaltseditors sehen.

Wenn Ihnen dieser Artikel gefallen hat, abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Video-Tutorials. Sie finden uns auch auf Twitter und Facebook.