WordPress-Hooks: Wie man sie verwendet, um SEO zu verbessern

Verwendet Ihre Website WordPress als CMS? Verbessere deine technische SEO mit WordPress Action Hooks und Filtern.

WordPress ist mit einem Marktanteil von mehr als 60% das beliebteste Content Management System (CMS) der Welt.

Eine große Support-Community und eine Reihe verfügbarer kostenloser Plugins machen das Erstellen einer Website mit WordPress (WP) erschwinglich und es spielt eine Schlüsselrolle dabei, warum sein Marktanteil so groß ist.

Wie Sie jedoch wissen, ist die Installation von Plugins mit Kosten verbunden.

Sie können oft Ihre Kernwerte für Web Vitals verschlechtern; Zum Beispiel können sie unnötige CSS- oder JS-Dateien auf jeder Seite laden, auf der sie nicht benötigt werden.

Um das zu beheben, müssen Sie einen Programmierer einstellen, der es für Sie erledigt, ein Premium-Plugin kaufen oder vielleicht einen kleinen Lernpfad einschlagen und es selbst tun.

Sie können auch hybrid vorgehen und einige Teile Ihrer Probleme durch benutzerdefinierte Codierung und andere Teile mithilfe von Plugins lösen.

Dieser Artikel soll Ihnen auf Ihrem Lernpfad helfen, und wir werden die am meisten benötigten WordPress-Hooks behandeln, um Ihnen bei der Verbesserung der technischen SEO Ihrer Website zu helfen.

Contents

1 Was ist ein WordPress-Hook?
- 1.1 Was ist ein Filterhaken?
- 1.2 Was ist ein Aktions-Hook?
2 wp_enqueue_scripts
3 wp_head
4 script_loader_tag
5 template_redirect
6 wp_headers
7 Fazit

Was ist ein WordPress-Hook?

WordPress-Hooks sind Schlüsselfunktionen in WP, mit denen Entwickler die Funktionalität des CMS erweitern können, ohne dass WP-Kerndateien geändert werden müssen. Dies erleichtert das Aktualisieren von Themes oder Plugins, ohne benutzerdefinierte Änderungen zu ändern.

Sie bieten Entwicklern eine leistungsstarke Möglichkeit, die Funktionalität von WordPress zu erweitern und benutzerdefinierte Änderungen an ihren Websites vorzunehmen.

Was ist ein Filterhaken?

Die Hook-Filterfunktion wird verwendet, um die Ausgabe der Funktion zu ändern, bevor sie zurückgegeben wird. Sie können beispielsweise Seitentitel mit Ihrem Blognamen versehen, indem Sie den Filterhaken wp_title verwenden.

Was ist ein Aktions-Hook?

Aktions-Hooks ermöglichen es Programmierern, bestimmte Aktionen an einem bestimmten Punkt in der Ausführung von WP Core, Plugins oder Themes auszuführen, z. B. wenn ein Beitrag veröffentlicht oder JS- und CSS-Dateien geladen werden.

Durch das Erlernen einiger grundlegender Aktions-Hooks oder -Filter können Sie eine Vielzahl von Aufgaben ausführen, ohne Entwickler einstellen zu müssen.

Wir werden die folgenden Hooks durchgehen:

wp_enqueue_scripts
wp_head
script_loader_tag
template_redirect
wp_headers

wp_enqueue_scripts

Dies ist genau der Aktions-Hook, den Sie verwenden würden, um schließen Sie redundante CSS- oder JS-Dateien vom Laden auf Seiten aus, auf denen sie nicht benötigt werden.

Zum Beispiel lädt das beliebte kostenlose Kontaktformular 7-Plugin, das über 5 Millionen Installationen hat, CSS- und JS-Dateien auf allen Seiten, während man es nur dort laden muss, wo das Kontaktformular existiert.

Um CF7-CSS- und JS-Dateien auf anderen Seiten als der Kontaktseite auszuschließen, können Sie den folgenden Codeausschnitt verwenden.

funktion my_dequeue_script(){ //Überprüfen Sie, ob der Seiten-Slug nicht unsere Kontaktseite ist. Alternativ können Sie is_page(25) mit Seiten-ID verwenden oder ob es sich um eine Beitragsseite handelt is_single(‚my-post‘) if ( !is_page(‚Kontakt‘) ) { wp_dequeue_script(‚google-recaptcha‘); wp_dequeue_script(‚wpcf7-recaptcha‘); wp_dequeue_script(‚Kontaktformular-7‘); wp_dequeue_style(‚contact-form-7‘); } } add_action(‚wp_enqueue_scripts‘, ‚my_dequeue_script‘, 99 );

Es gibt ein paar wichtige Punkte; Die Aktions-Hook-Priorität ist auf 99 gesetzt, um sicherzustellen, dass unsere Änderung zuletzt in der Warteschlange ausgeführt wird.

Wenn Sie es beispielsweise auf 10 setzen, funktioniert es nicht, da die CF7-Warteschlangenfunktion die Priorität 20 verwendet. Um sicherzustellen, dass Ihre zuletzt ausgeführt wird und Wirkung zeigt, legen Sie eine Priorität fest, die groß genug ist.

Außerdem haben wir im Code als Funktionsargumentkennung „contact-form-7“; verwendet. Sie fragen sich vielleicht, wie ich das gefunden habe.

Es ist ziemlich einfach und intuitiv. Verwenden Sie einfach das inspect Element-Tool Ihres Browsers und suchen Sie nach dem ID-Attribut von Link- oder Skript-Tags.

Screenshot vom Autor, Februar 2023

Sie können den Quellcode Ihrer Website mit inspect element überprüfen und alle JS- oder CSS-Dateien aus der Warteschlange entfernen, wenn sie nicht benötigt werden.

wp_head

Dieser Aktions-Hook wird verwendet, um Ressourcen-JS, CSS-Dateien oder Meta-Tags im Abschnitt der Webseite hinzuzufügen.

Mit diesem Haken können Sie Ressourcen vor dem Laden über dem Falten im Head-Bereich laden, wodurch Ihre LCP-Ergebnisse verbessert werden können.

Zum Beispiel wird das Vorladen von Schriftarten, eine der Empfehlungen von Google, oder das Logo und die vorgestellten Bilder auf Artikelseiten immer über dem Falz geladen – und Sie müssen sie vorladen, um LCP zu verbessern.

Verwenden Sie dazu den folgenden Codeausschnitt.

Funktion my_preload() { ?>