Optimierung des Kontaktformulars 7 für eine bessere Leistung

Kontaktformular 7 ist eines der am häufigsten verwendeten freien Kontaktformular-Plugins. Zum Zeitpunkt dieses Artikels gibt es mehr als 16 Millionen Downloads. Ich halte es für richtig, es als das am häufigsten verwendete Kontaktformular-Plugin zu betrachten.

Bei dieser großen Zielgruppe scheint die Optimierung der Verwendung von Contact Form 7 einer erheblichen Anzahl von WordPress-Benutzern zu entsprechen. Wenn Sie es noch nicht kennen, enthält Contact Form 7 auf jeder Seite Ihrer Site seine CSS- und JavaScripts-Dateien.  

Diese redundante und verschwenderische Einbeziehung sollte angegangen werden. 

Warum machen wir das?

Eine zusätzliche CSS- und / oder JavaScript-Datei auf jeder Seite wird wie zusätzliches Gepäck sein, das Sie nicht zu Fuß abholen möchten. Zwei extra HTTP Anforderungen können die Ladezeit Ihrer Website negativ beeinflussen. 

Wenn Sie meinen Anfängerleitfaden für WordPress SEO von Yoast gelesen haben, wissen Sie, dass Google die Websites mit Seitenladezeiten unter 1s gerne bewertet. Die ersten 14 KB sind die kritischen.

Möglicherweise möchten Sie diese CSS- und JavaScript-Dateien nur auf den Seiten laden, auf denen Sie das Contact Form 7-Plugin zum Erstellen eines Formulars verwenden. Ihre Website wird durch das Laden zusätzlicher Dateien auf jeder Seite gespeichert. Diese Dateien werden nur auf den Seiten mit Kontaktformularen geladen.

Laut dem Plugin-Autor Takayuki Miyoshi:

Ich verstehe das Gefühl, aber es gibt ein technisches Problem für ein Plugin, zu wissen, ob die Seite zu Beginn des Ladens Kontaktformulare enthält oder nicht. 

Kontaktformular optimieren 7

Schritt 1: Deinstallieren von CF7-CSS-Dateien

Zunächst müssen wir prüfen, auf welchen Seiten Kontaktformulare vorhanden sind. Dann müssen wir die vom CF7-Plugin generierte CSS-Datei für alle anderen Seiten abmelden. 

URL-Slug der Seite suchen 

Finden wir den Slug Ihrer Seite mit dem Kontaktformular. Gehe zu Seiten. Klicken Schnelle Bearbeitung und kopiere die Schnecke.

Nehmen wir ein explizites Beispiel: Stellen Sie sich vor, Sie haben eine Seite mit dem Titel "Kontakt", die einen URL-Slug hat kontaktiere unsFügen Sie den folgenden Code in Ihr Theme ein Functions.php Datei am Ende.

// Kontaktformular abbestellen 7 styles add_action ('wp_print_styles', 'aa_deregister_styles', 100); Funktion aa_deregister_styles () if (! is_page ('contact-us')) wp_deregister_style ('contact-form-7');  

Dieser Code fügt eine Funktion hinzu aa_deregister_styles () was prüft, ob die Seite nicht ist kontaktiere uns entfernt dann den Stil CSS von CF7 für andere Seiten.

Schritt 2: Deinstallieren der CF7-JavaScript-Dateien

Ebenso wird es bei den JavaScript-Quellen für alle Seiten außer denjenigen mit Kontaktformularen deaktiviert. 

Fügen Sie den folgenden Code in Ihr Theme ein Functions.php Datei am Ende:

// Kontaktformular 7 abmelden JavaScript-Dateien auf allen Seiten ohne Formular add_action ('wp_print_scripts', 'aa_deregister_javascript', 100); Funktion aa_deregister_javascript () if (! is_page ('contact-us')) wp_deregister_script ('contact-form-7'); 

Dieser Code fügt eine Funktion hinzu aa_deregister_javascript () was prüft, ob die Seite nicht ist kontaktiere uns entfernt dann die JavaScript-Datei für alle anderen Seiten von CF7.

Das ist es. Sie haben Ihr CF7-Plugin erfolgreich optimiert.

Was ist, wenn ich mehrere Formulare auf mehreren Seiten habe??

Die Antwort auf diese Frage ist einfach: Ich verwende is_page ()  Funktion mit massiver Funktionsreferenz bei WordPress Codex: is_page (). Sie können ein Array von Seiten hinzufügen. Es kann Parameterwerte als Seiten-ID, Seitentitel oder Page Slug abrufen.

/ ** * is_page (Array (ID, 'slug', 'title')); * Gibt true zurück, wenn die angezeigten Seiten entweder die Beitrags-ID 42 oder post_name "about-me" oder post_title * / is_page (array (42, 'about-me', 'Contact')) sind.

Ressourcen 

  • WordPress-Codex: is_page ()
  • Kontaktformular 7