So verschieben Sie JavaScripts in WordPress in die Fuß- oder Fußzeile

Kürzlich hat uns einer unserer Leser gefragt, wie er JavaScripts in WordPress nach unten verschieben kann, um den Geschwindigkeits-Score von Google zu erhöhen. Wir sind froh, dass sie gefragt haben, weil wir ehrlich gesagt darüber schreiben wollten. Zuvor haben wir darüber gesprochen, wie Sie JavaScripts und CSS-Stile ordnungsgemäß in WordPress hinzufügen. In diesem Artikel zeigen wir Ihnen, wie Sie JavaScripts in WordPress ganz nach unten verschieben. So können Sie die Ladezeit Ihrer Website und die Geschwindigkeit Ihrer Google-Seitengeschwindigkeit verbessern.

Vorteile des Verschiebens von JavaScripts nach unten

JavaScript ist eine clientseitige Programmiersprache. Sie wird vom Webbrowser eines Benutzers ausgeführt und ausgeführt und nicht von Ihrem Webserver. Wenn Sie JavaScript an die oberste Stelle setzen, können Browser das JavaScript ausführen oder verarbeiten, bevor Sie den Rest Ihrer Seite laden. Wenn JavaScripts nach unten verschoben wird, rendert der Webserver die Seite schnell und der Browser des Benutzers führt dann JavaScripts aus. Da das serverseitige Rendering bereits abgeschlossen ist, wird das JavaScript im Hintergrund geladen, wodurch die Gesamtladung schneller wird.

Dadurch wird Ihr Geschwindigkeitswert verbessert, wenn Sie mit Google Page Speed ​​oder Yslow testen. Google und andere Suchmaschinen betrachten jetzt die Seitengeschwindigkeit als eine der Leistungsmatrizen, wenn Suchergebnisse angezeigt werden. Dies bedeutet, dass Websites, die schneller geladen werden, in den Suchergebnissen stärker hervorgehoben werden.

Die richtige Art, Skripte in WordPress hinzuzufügen

WordPress verfügt über ein leistungsfähiges Warteschlangensystem, mit dem Entwickler von Designs und Plugins ihre Skripts in die Warteschlange einfügen und bei Bedarf laden können. Wenn Sie Skripts und Stile ordnungsgemäß in die Warteschlange stellen, kann dies die Geschwindigkeit beim Laden Ihrer Seite erheblich verbessern.

Um Ihnen ein einfaches Beispiel zu zeigen, fügen wir ein kleines JavaScript in ein WordPress-Design ein. Speichern Sie Ihr JavaScript in einem .js Datei und platziere das .js Datei in Ihrem Thema js Verzeichnis. Wenn Ihr Design kein Verzeichnis für JavaScripts hat, erstellen Sie ein Verzeichnis. Nachdem Sie Ihre Skriptdatei platziert haben, bearbeiten Sie das Thema Functions.php Datei und fügen Sie diesen Code hinzu:

 Funktion wpb_adding_scripts () wp_register_script ('my-amazing-script', get_template_directory_uri (). '/js/my-amazing-script.js',", '1.1', true); wp_enqueue_script ('my-amazing-script') ; add_action ('wp_enqueue_scripts', 'wpb_adding_scripts'); 

In diesem Code haben wir die Funktion wp_register_script () verwendet. Diese Funktion hat folgende Parameter:

Um das Skript in die Fußzeile oder in den unteren Bereich einer WordPress-Seite einzufügen, müssen Sie lediglich das festlegen $ in_footer Parameter zu wahr.

Wir haben auch eine andere Funktion verwendet get_template_directory_uri () die gibt die URL für das Vorlagenverzeichnis zurück. Diese Funktion sollte zum Einreihen und Registrieren von Skripten und Stilen in WordPress-Designs verwendet werden. Für Plugins werden wir verwenden plugins_url () Funktion.

Das Problem:

Das Problem ist, dass WordPress-Plugins manchmal Seiten innerhalb oder innerhalb des Seitenhauptteils eigenes JavaScript hinzufügen. Um diese Skripts nach unten zu verschieben, müssen Sie Ihre Plugin-Dateien bearbeiten und die Skripts ordnungsgemäß nach unten verschieben.

Die JavaScript-Quelle finden

Öffnen Sie Ihre Site im Webbrowser und zeigen Sie den Quellcode an. Sie sehen den Link zur JavaScript-Datei, der den Ort und den Ursprung der Datei angibt. Der folgende Screenshot zeigt beispielsweise, dass unser Skript zu einem Plugin mit dem Namen 'test-plugin101' gehört. Die Skriptdatei befindet sich in der js Verzeichnis.

Manchmal wird JavaScript direkt auf der Seite angezeigt und nicht durch eine separate .js-Datei verknüpft. In diesem Fall müssen Sie alle Plugins nacheinander deaktivieren. Aktualisieren Sie die Seite nach dem Deaktivieren jedes Plugins, bis Sie das Skript finden, das den Seiten hinzugefügt wird. Wenn das JavaScript auch nach dem Deaktivieren aller Plugins nicht verschwindet, versuchen Sie, zu einem anderen Design zu wechseln, um zu sehen, ob das JavaScript von Ihrem Design hinzugefügt wird.

Registrieren und Enqueue-Skripte

Wenn Sie das Plugin oder Design gefunden haben, das JavaScript im Kopfzeilenabschnitt hinzufügt, müssen Sie im nächsten Schritt herausfinden, wo das Plugin einen Aufruf für die Datei hat. In einer der PHP-Dateien Ihres Designs oder Plugins sehen Sie einen Aufruf für diese bestimmte Datei .js Datei.

Wenn das Plugin oder Design bereits eine Enqueuing-Datei zum Hinzufügen von JavaScript-Dateien verwendet, müssen Sie lediglich die Funktion wp_register_script in Ihrem Plugin oder Design ändern und den Parameter $ in_footer mit true ergänzen. So was:

 wp_register_script ('script-handle', plugins_url ('js / script.js', __FILE__), ", '1.0', true); 

Nehmen wir an, Ihr Plugin oder Design fügt reines JavaScript in den Header oder zwischen den Inhalt ein. Suchen Sie den rohen JavaScript-Code in den Plugin- oder Designdateien, kopieren Sie das JavaScript und speichern Sie es in einem .js Datei. Dann benutze wp_register_script () Funktion wie oben gezeigt, um JavaScript nach unten zu verschieben.

Anmerkung des Editors: Es ist wichtig zu verstehen, dass Ihre Änderungen nicht überschrieben werden, wenn Sie Änderungen an den Kerndateien vornehmen und das Plugin aktualisieren. Ein besserer Weg, dies zu tun, wäre das Aufheben der Registrierung des Skripts und die erneute Registrierung in der Datei functions.php Ihres Themas. Sehen Sie sich dieses Tutorial an.

Neben dem Verschieben der Skripts in die Fußzeile sollten Sie auch ein schnelleres Plug-In für Social Media und Lazy Load-Bilder in Betracht ziehen. Außerdem sollten Sie W3 Total Cache und MaxCDN verwenden, um die Geschwindigkeit Ihrer Website zu verbessern.

Wir hoffen, dass dieser Artikel Ihnen dabei geholfen hat, JavaScripts in WordPress ganz nach unten zu verschieben und die Seitengeschwindigkeit zu verbessern. Für Fragen und Feedback hinterlassen Sie bitte einen Kommentar.