WordPress mit W3 Total Cache und CloudFlare CDN in LAMP konfigurieren

Dieser Leitfaden zeigt Ihnen, wie Sie die Ladegeschwindigkeit Ihrer WordPress-Website mit dem W3 Total Cache-Plugin und einem kostenlosen CloudFlare-CDN-Konto erhöhen können. In diesem Tutorial ist das WordPress-CMS-System auf einem LAMP-Stack (Linux + Apache HTTP-Server + MariaDB RDBMS und PHP) auf einer selbst gehosteten virtuellen Maschine mit Debian 9 installiert, aber das gleiche Verfahren kann mit einigen geringfügigen Änderungen erfolgreich auf jeder WordPress-Website angewendet werden, unabhängig davon, ob sie auf einem dedizierten Server, einem VPS oder in einer Shared-Hosting-Umgebung bereitgestellt wird.

ANFORDERUNGEN

• Eine WordPress-Website, die auf einer registrierten öffentlichen Domain verfügbar ist. Falls Sie Ihre eigene WordPress-Website auf einem LAMP-Stack bereitstellen möchten, sollten Sie die Anweisungen aus diesem Tutorial lesen: https://www.howtoforge.com/tutorial/install-wordpress-on-lamp-in-debian-9/
• W3 Total Cache-Plugin installiert und in WordPress aktiviert
• Ein CloudFlare-Kostenloses Konto

Hinweis:

Falls Ihre WordPress-Website auf einem dedizierten Server auf einem LAMP-Stack installiert ist, müssen Sie zunächst überprüfen, ob Sie neue Plugins über das WordPress-Dashboard installieren können, ohne einen FTP-Server lokal installiert zu haben. Wenn Sie aufgefordert werden, ein FTP-Konto einzugeben, um neue Plugins zu installieren, müssen Sie die direkte Dateisystem-Schreibmethode von WordPress aktivieren. Um diese WordPress-Funktion zu aktivieren, öffnen Sie die wp-config.php-Datei, die sich im Stammverzeichnis Ihrer Website befindet, und fügen Sie die folgende Zeile Code irgendwo im Inhalt der Datei hinzu.

define('FS_METHOD', 'direct');

Sie können auch den folgenden Befehl ausführen, um dasselbe zu erreichen, ohne die wp-config.php-Datei manuell zu aktualisieren, wie im folgenden Screenshot dargestellt.

echo "define('FS_METHOD', 'direct');" | tee -a /path/to/website/wp-config.php

Bevor Sie das W3 Total Cache-Plugin mit CloudFlare CDN einrichten, besuchen Sie die GTmetrix-Website unter folgendem Link https://gtmetrix.com und führen Sie einen Leistungstest für Ihre Domain durch, um die Ergebnisse nach der CDN-Integration zu vergleichen.

Teil 1 - W3 Total Cache installieren

• Um das W3 Total Cache-Plugin zu installieren, melden Sie sich im WordPress-Dashboard an und klicken Sie auf den Link Plugins -> Neu hinzufügen. Geben Sie im Suchfeld W3 Total Cache ein und klicken Sie auf die Schaltfläche Jetzt installieren, um den Installationsprozess zu starten, wie im folgenden Bild dargestellt.

• Nachdem das W3 Total Cache-Plugin installiert wurde, klicken Sie auf die Schaltfläche Aktivieren des W3 Total Cache-Plugins, um das Plugin zu aktivieren.**

Teil 2 – W3 Total Cache-Plugin einrichten

1. Um das W3 Total Cache-Plugin zu konfigurieren, navigieren Sie zum WordPress-Dashboard und gehen Sie im linken Menü zu Plugins -> Installierte Plugins und klicken Sie auf den Link Einstellungen von W3 Total Cache, um den Konfigurationsprozess zu starten.

2. Gehen Sie dann zu Allgemeine Einstellungen und aktivieren Sie die Option Seiten-Cache. Verwenden Sie die Cache-Methode Disk:Enhaced und scrollen Sie nach unten, um zur nächsten Option zu gelangen.

3. Scrollen Sie als Nächstes nach unten und deaktivieren Sie Minify, Datenbank-Cache und Objekt-Cache, da CloudFlare CDN sich um das Minimieren Ihrer Website-JavaScript-, CSS- und HTML-Dateien kümmern wird und auch einen eigenen Cache-Mechanismus bereitstellt.

Sie sollten den Datenbank-Cache deaktivieren, falls die WordPress-Website in einer Shared-Hosting-Umgebung installiert ist.

4. Scrollen Sie weiter nach unten und aktivieren Sie den Browser-Cache, wie im folgenden Bild dargestellt.

5. Scrollen Sie nach unten und deaktivieren Sie die CDN- und Reverse-Proxy-Option, gehen Sie dann zum Tab Sonstiges und aktivieren Sie die folgende Option: Rewrite-Regeln überprüfen. Stellen Sie sicher, dass Sie alle anderen Optionen deaktivieren, wie im folgenden Bild dargestellt.

6. Scrollen Sie als Nächstes nach unten und deaktivieren Sie alle Debug-Optionen. Klicken Sie schließlich auf die Schaltfläche Alle Einstellungen speichern, um die Konfiguration anzuwenden. Hier haben Sie auch die Möglichkeit, die Konfiguration des W3 Total Cache-Plugins zu exportieren oder das Plugin auf die Standardeinstellungen zurückzusetzen, falls etwas schiefgeht.

7. Die nächsten Einstellungen betreffen die Seiten-Cache-Option im linken Menü. Gehen Sie zum Tab Allgemein und aktivieren Sie die folgenden Optionen, wie im folgenden Screenshot dargestellt.

• Cache-Startseite

• Cache-Feeds: Site, Kategorien, Tags, Kommentare

• Cache-SSL (https)-Anfragen

• Seiten für angemeldete Benutzer nicht cachen

• Seiten für folgende Benutzerrollen nicht cachen: Administrator, Redakteur, Autor, Mitwirkender und Abonnent.

8. Scrollen Sie als Nächstes nach unten und aktivieren Sie die Option Cache-Alias-Hostnamen. Schreiben Sie alle Ihre Website-Aliase (mit oder ohne www) in Zusätzliche Home-URLs und scrollen Sie nach unten zur nächsten Option.

9. Aktivieren Sie im Tab Cache Preload die Option Seiten-Cache automatisch vorladen. Ändern Sie die Werte für das Aktualisierungsintervall und die Seiten pro Intervall nicht. Außerdem sollten Sie eine XML-URL-Sitemap für die Website hinzufügen. Stellen Sie auch sicher, dass Sie die Option Post-Cache beim Veröffentlichen von Ereignissen vorladen aktivieren.

10. Scrollen Sie als Nächstes nach unten und aktivieren Sie die Optionen Startseite, Beitragsseite, Blog-Feed, Seiten mit Beitragskommentaren und rss2 aus der Bereinigungsrichtlinie: Seiten-Cache-Bildschirm, wie im folgenden Bild beschrieben.

11. Scrollen Sie schließlich zum Tab Erweitert und aktivieren Sie nur die Option Kompatibilitätsmodus. Lassen Sie alle anderen Optionen auf den Standardwerten und klicken Sie auf die Schaltfläche Alle Einstellungen speichern, um die bisher vorgenommenen Änderungen anzuwenden.

12. Navigieren Sie als Nächstes zum Menü Browser-Cache und stellen Sie im Tab Allgemein sicher, dass Sie die folgenden Optionen aktivieren, wie im folgenden Screenshot dargestellt.

• Letzte-Änderung-Header setzen

• Ablauf-Header setzen

• Cache-Control-Header setzen

• Entitätstag setzen

• W3 Total Cache-Header setzen

• HTTP gzip-Kompression aktivieren

13. Scrollen Sie weiter nach unten und aktivieren Sie die folgenden Optionen für die Tabs CSS & JS, XTML & XML und Medien & andere Dateien, wie unten beschrieben:

• Letzte-Änderung-Header setzen

• Ablauf-Header setzen

• Cache-Control-Header setzen

• Cache-Control-Richtlinie auf Cache mit max-age und Validierung („max-age=EXPIRES_SECONDS, public, must-revalidate, proxy-revalidate“) setzen

• Entitätstag (ETag) setzen

• W3 Total Cache-Header setzen

• HTTP gzip-Kompression aktivieren

14. Klicken Sie schließlich auf die Schaltfläche Alle Einstellungen speichern, um die Konfiguration des W3 Total Cache-Plugins anzuwenden. Sie sollten jedoch die Einstellungen des W3 Total Cache-Plugins anpassen und Tests durchführen, um die besten Optionen für Ihre Website zu bestimmen.

Teil 3 – CloudFlare CDN einrichten

15. Um das CloudFlare-Plugin in WordPress zu aktivieren, navigieren Sie zu Leistung - > Erweiterungen - CloudFlare und klicken Sie auf den Link Aktivieren, wie im folgenden Bild dargestellt.

16. Um das CloudFlare-Plugin zu konfigurieren, klicken Sie auf den Link Einstellungen im Erweiterungsmenü, wie im folgenden Screenshot dargestellt.

17. CloudFlare ist ein Content-Delivery-Network-Service (CDN), der als Reverse-Proxy-Beschleuniger für Websites fungiert. Zu den weiteren Funktionen, für die Sie möglicherweise bezahlen müssen, bietet CloudFlare DNS- und integrierte Sicherheitsdienste für zwischengespeicherte Websites. Um eine Website in das CloudFlare CDN zu integrieren, müssen Sie sich lediglich unter folgendem Link https://www.cloudflare.com/a/login für ein kostenloses Konto anmelden und Ihre Domain zu deren Netzwerken hinzufügen, wie im folgenden Screenshot dargestellt.

18. Warten Sie etwa eine Minute, damit CloudFlare Ihre Domain-DNS-Einträge scannen kann, und klicken Sie auf die Schaltfläche Weiter, um zum Bildschirm mit den DNS-Einträgen zu gelangen. Überprüfen Sie auf dem Bildschirm mit den erkannten DNS-Einträgen, ob alle Ihre Domain-Einträge entdeckt wurden. Wenn alle Ihre DNS-Einträge in der Liste vorhanden sind, klicken Sie auf die Schaltfläche Weiter, um fortzufahren. Verwenden Sie die folgenden Screenshots als Leitfaden.

19. Als Nächstes müssen Sie einen CloudFlare-Plan für Ihre Domain auswählen und auf die Schaltfläche Weiter klicken, um zum nächsten Bildschirm zu gelangen. In diesem Tutorial wählen wir einen kostenlosen Website-Plan aus.

20. Notieren Sie sich auf dem nächsten Bildschirm die CloudFlare-DNS-Namensserver und aktualisieren Sie entsprechend Ihre Domain-Namensserver. Sie müssen sich in das Panel Ihres Domain-Registrars einloggen, um Ihre Domain-Namensserver zu ändern, und die neuen Einträge müssen so schnell wie möglich aktualisiert werden. Die Namensserver der Domain sollten genau auf die CloudFlare-Namensserver zeigen und keine anderen ns-Einträge. Wenn Sie fertig sind, klicken Sie auf die Schaltfläche Weiter, um den Integrationsprozess abzuschließen. Sie können jedoch auch auf die Schaltfläche Weiter klicken und die DNS-ns-Einträge später bei Ihrem Registrar aktualisieren.

21. Nachdem Sie Ihre Domain-Namensserver geändert haben, klicken Sie auf die Schaltfläche Namensserver erneut überprüfen, um den Aktivierungsprozess zu erzwingen. Die DNS-Propagation der Domain in der Internet-Cloud dauert bis zu 24 Stunden. Während dieser Zeit wird Ihre Website jedoch in keiner Weise beeinträchtigt. Keine Ausfallzeiten!

22. Navigieren Sie als Nächstes zum CloudFlare-Webpanel und klicken Sie auf die Schaltfläche Geschwindigkeit. Aktivieren Sie hier die Option Auto Minify für JavaScript, HTML und CSS, wie im folgenden Bild dargestellt. Diese Einstellung komprimiert alle JavaScript-, CSS- und HTML-Dateien, um deren Volumen zu reduzieren und sie schneller an die Endbenutzerbrowser zu liefern.

23. Scrollen Sie nach unten und aktivieren Sie den Automatischen Modus für Rocket Loader, wie unten dargestellt.

24. Klicken Sie als Nächstes auf die Schaltfläche Crypto und setzen Sie die SSL-Verschlüsselung auf Voll. Gehen Sie dann zum Hauptbildschirm, um den API-Schlüssel zu erhalten und die WordPress-CloudFlare-Erweiterung zu aktivieren. Klicken Sie auf den Link API-Schlüssel abrufen, wählen Sie Global API Key und klicken Sie auf die Schaltfläche API-Schlüssel anzeigen. Ein neues Popup-Fenster sollte sich öffnen. Kopieren Sie die API-Schlüsselzeichenfolge aus der Zwischenablage und schließen Sie das Popup-Fenster.

25. Kehren Sie zur WordPress-Website zurück und gehen Sie zu Leistung -> Erweiterungen -> CloudFlare und klicken Sie auf den Link Einstellungen. Klicken Sie im CloudFlare-Bildschirm auf die Schaltfläche Autorisieren und fügen Sie die E-Mail-Adresse hinzu, mit der Sie sich bei CloudFlare angemeldet haben, sowie den API-Schlüssel, den Sie vom Global API Key kopiert haben. Wenn Sie fertig sind, klicken Sie auf die Schaltfläche Weiter, um fortzufahren.

26. Wählen Sie Ihre Domainzone aus und klicken Sie auf die Schaltfläche Weiter, um den Autorisierungsprozess abzuschließen. Dann können Sie beginnen, die CloudFlare-CDN-Einstellungen für Ihre Domain über das CloudFlare-Plugin in WordPress zu verwalten.

27. Wenn Sie die DNS-ns-Einträge bereits bei Ihrem Registrar aktualisiert haben, können Sie einige Stunden warten und sich dann im CloudFlare-Panel anmelden. Die Website sollte erfolgreich auf CloudFlare aktiviert sein.

Warten Sie einige Tage, bis der CloudFlare-CDN-Dienst den Inhalt Ihrer Website vollständig zwischengespeichert hat, und analysieren Sie die Geschwindigkeit Ihrer Website erneut auf der Website https://gtmetrix.com. Vergleichen Sie die Ergebnisse mit dem ursprünglichen Bericht, um den Leistungsgewinn zu bestimmen, den das CloudFlare-CDN bietet.