So verschieben Sie das JavaScript des WordPress-Themes für eine bessere Leistung in die Fußzeile

Ab und zu hört man vielleicht die Beschwerde über die schlechte Seitenladezeit. Die meisten WordPress-Benutzer stehen vor diesem Problem.

Auch nach Anwendung der allgemeinen Tipps und Tricks verbessert sich die Website-Geschwindigkeit nicht. Das liegt daran, dass die Nicht-Technik-Leute keine Ahnung davon haben, was im Hintergrund geladen wird.
Wenn Sie sich für ein WordPress-Theme entscheiden, sollten Sie es immer in einer lokalen Umgebung testen. Das liegt daran, dass nicht jedes Theme auf Geschwindigkeit optimiert ist.

Wenn Sie Programmierer sind, wissen Sie vielleicht, dass JavaScript eine Skriptsprache und für eine WordPress-Website eine clientseitige Sprache ist.

In diesem Tutorial erfahren Sie, wie Sie die JavaScript-Dateien Ihres WordPress-Themes in die Fußzeile der Website verschieben.

Jetzt fragen Sie sich vielleicht, was der Vorteil sein wird. Nun, wenn die Benutzer eine Website laden, beginnt der Browser mit dem Laden der Bilder, CSS-Dateien, JavaScript-Dateien und vielem mehr.

Wenn Sie JavaScript jedoch in die Fußzeile verschieben, wird der Benutzer nichts davon bemerken, da die meisten von JavaScript verarbeiteten Dinge bereits verwendet werden, sobald die Website vollständig geöffnet ist.

Die JavaScript-Dateien werden also im Hintergrund geladen und die Benutzer sehen Ihre Website früher als sonst.

Es hilft Ihnen direkt, die Geschwindigkeit der Website zu erhöhen. Das Benutzererlebnis steht immer an erster Stelle, und Sie wissen, dass niemand gerne darauf wartet, dass eine Website geladen wird, wenn sie langsam ist.

Deshalb werde ich Sie heute durch einen einfachen Prozess führen, der Ihnen helfen kann.

Verstehen Sie das Konzept des JavaScript-WordPress-Theme-Codex

Um Änderungen vorzunehmen, sollten Sie zunächst wissen, welcher Code diese Datei steuert und wo Sie sie finden können.

Wenn Sie sich ein wenig mit WordPress-Themes auskennen, wissen Sie vielleicht bereits, dass die Datei „functions.php“ eine der wichtigsten Dateien ist.

Auch wenn Sie kein Technikfreak sind, haben Sie vielleicht schon von dieser Datei gehört. Wenn nicht, machen Sie sich keine Sorgen, ich helfe Ihnen, es zu finden.

Folge diesen Schritten.

Schritt 1

Melden Sie sich bei Ihrem WordPress-Administrationsbereich an und gehen Sie zu Erscheinungsbild>>Editor .

image2 31 1

Schritt 2

Es öffnet sich eine neue Seite, auf der Sie die Codes sehen. Sie müssen jedoch die Datei „functions.php“ finden. Schauen Sie sich einfach das Menü auf der rechten Seite an.

Suchen Sie nach Theme Functions (functions.php) und klicken Sie darauf.

image1 37

Schritt 3: – Sobald Sie das getan haben, werden Sie viele Funktionen sehen können, die die Funktionsweise Ihres WordPress-Themes steuern, oder Sie können die Funktionen Ihrer Website sagen.

Sie müssen eine Funktion finden, die zum Hinzufügen der Skriptdateien verwendet wird.

Suchen Sie nach „wp_enqueue_script“ .

Jetzt ist es an der Zeit, diesen Kodex zu erklären. Hierzu können viele Parameter übergeben werden.

Klartext
In die Zwischenablage kopieren
Code in neuem Fenster öffnen
EnlighterJS 3 Syntax-Highlighter
wp_enqueue_script ( $handle, $src, $deps, $ver, $in_footer ) ;
wp_enqueue_script ( $handle, $src, $deps, $ver, $in_footer );
wp_enqueue_script ( $handle, $src, $deps, $ver, $in_footer );
  • $handle :- Es ist der Name der Datei.
  • $src :- Adresse oder Pfad der Datei.
  • $deps: – Es ist ein Array zur Verarbeitung des Skripts.
  • $ver :- Es ist die Version der Datei.
  • $in_footer: – Standardmäßig ist es auf „False“ gesetzt.

Wenn Sie also den letzten Parameter auf „True“ ändern , wird die JavaScript-Datei in die Fußzeile verschoben.

Ist das nicht einfach?

Möglicherweise hat der Theme-Entwickler viele JavaScript-Dateien in die Warteschlange gestellt.

Hinweis: Nehmen Sie keine Änderungen vor, wenn Sie den Theme-Codex nicht kennen.

Lassen Sie mich Ihnen ein Beispiel der vollständigen Funktionen zeigen.

Klartext
In die Zwischenablage kopieren
Code in neuem Fenster öffnen
EnlighterJS 3 Syntax-Highlighter
Funktion the_script_file () {
wp_enqueue_script ( ‘script’ , get_template_directory_uri () . ‘/Js/script.js’ , « , ‘1.0’ , true ) ;
}
add_filter ( ‘wp_enqueue_scripts’ , ‘the_script_file’ ) ;
function the_script_file() { wp_enqueue_script ( ‘script’, get_template_directory_uri() . ‘/Js/script.js’ ,  » , ‘1.0’, true ); } add_filter ( ‘wp_enqueue_scripts’, ‘the_script_file’ );
Funktion the_script_file() {
wp_enqueue_script ( 'script', get_template_directory_uri() . '/Js/script.js' , " , '1.0', true );
}
add_filter ('wp_enqueue_scripts', 'the_script_file');

Jeder WordPress-Theme-Entwickler hat einen anderen Codierungsstil, daher sind die Funktionen unterschiedlich.

Wichtig ist, den Codex „wp_enqueue_script“ zu finden und den Wert von $in_footer auf „True“ zu setzen .

 

Anschließend speichern Sie die Datei und können den Quellcode Ihrer Website überprüfen.

Die JavaScript-Datei wird in ihre Fußzeile verschoben.

 

Ich hoffe, Sie können die Datei „functions.php“ finden

Wenn Sie die Editor-Option in Ihrem WordPress-Dashboard nicht sehen, müssen Sie über das cPanel Ihrer Website auf diese Datei zugreifen.

Können Sie den erforderlichen Code in Ihrem WordPress-Admin-Panel ändern?

Ich habe den einfachsten Weg erwähnt, die Datei „functions.php“ zu bearbeiten. Sogar ein Anfänger kann dies tun. Sie müssen nur den Skript-WordPress-Codex finden und den Parameter ändern.

Ich weiß, Sie fragen sich vielleicht, was der einfachste Weg ist. Nun, wenn Sie Angst haben, diese Änderung vorzunehmen, können Sie Ihren technikbegeisterten Freund bitten, dies für Sie zu tun.

Hinweis: Ich möchte erwähnen, dass Sie Ihre Website und ihre Datenbank sichern sollten, bevor Sie Änderungen vornehmen.

Die meisten Leute vergessen es und machen ihre Website kaputt. Sie sollten keinerlei Risiko eingehen. Wie ich bereits erwähnt habe, ist die Datei „functions.php“ eine der wichtigsten Dateien und sollte daher mit Vorsicht behandelt werden.

Wenn Sie etwas anderes hinzufügen, werden einige Funktionen Ihrer Website gestoppt. Dadurch wird das Layout der Website beschädigt. Vorsicht ist die Mutter der Porzelankiste.

Abschluss

Das Endziel besteht darin, das Laden der JavaScript-Datei zu verzögern, damit der Browser den Benutzern die Website schnell anzeigen kann.

Wenn Sie die Skriptdateien im Header behalten, benötigt der Browser sehr viel Zeit, um alle Dateien zu laden und die Website anzuzeigen.

Deshalb habe ich Ihnen einen einfachen Trick gezeigt, wie Sie die JavaScript-Datei in die Fußzeile der Website verschieben können. Es trägt dazu bei, die Ladezeit der Website-Seiten zu verbessern.

 

Schauen Sie sich diese Top 3 WordPress-Hosting-Dienste an:

A2-Hosting
4.7

1.886 Nutzerbewertungen

2,99 $ /Monat
Startpreis

Besuchen Sie A2 Hosting

Bewertung basierend auf Expertenbewertung
  • Benutzerfreundlich
    4.5
  • Unterstützung
    4,0
  • Merkmale
    4.5
  • Zuverlässigkeit
    4.8
  • Preisgestaltung
    4,0
Hostinger
4.6

2.435 Nutzerbewertungen

2,99 $ /Monat
Startpreis

Besuchen Sie Hostinger

Bewertung basierend auf Expertenbewertung
  • Benutzerfreundlich
    4.7
  • Unterstützung
    4.7
  • Merkmale
    4.8
  • Zuverlässigkeit
    4.8
  • Preisgestaltung
    4.7
HostArmada
5,0

716 Benutzerbewertungen

2,49 $ /Monat
Startpreis

Besuchen Sie HostArmada

Bewertung basierend auf Expertenbewertung
  • Benutzerfreundlich
    4.5
  • Unterstützung
    4.5
  • Merkmale
    4.5
  • Zuverlässigkeit
    4.5
  • Preisgestaltung
    4,0
  • Benötigen Sie das beste WordPress-Hosting ? Schauen Sie sich unsere Empfehlungen an, indem Sie hier klicken.