Cloudflare und WordPress verbinden schafft meine Oma

Erwartete Lesedauer: 8 Minuten

WordPress durch Cloudflare mit einem kostenlosen CDN ausstatten

Ich habe bereits in einem anderen Artikel darauf hingewiesen, Cloudflare für WordPress einrichten ist super simpel. Den Beitrag, und was ich falsch gemacht habe, findet ihr im Link. Dieses Mal werde ich aber keine Fehler beheben sondern einfach den gesamten Vorgang dokumentieren da ich dabei bin eine weitere Seite zu Cloudflare zu transferieren. Cloudflare und WordPress verbinden schafft jeder und ich mache es euch so einfach wie möglich.

Was habe ich davon WordPress mit Cloudflare zu benutzen?

Ich bin seit Jahren Benutzer und Administrator von WordPress Seiten. Insgesamt habe ich hunderte Webseiten (also Datenbank und Files vom Webserver) gekauft oder über Dienste wie Fiverr erstellen lassen. Dementsprechend habe ich extrem schlechte aber auch wirklich gute Seiten gesehen. Den Buildprozess von WordPress.org habe ich nie verwendet sondern von Beginn weg mit All-Inkl.com als Hostingpartner gearbeitet. Bereits bei der damaligen Version 3.0 war es mit WordPress und dem Auto-Installer möglich eine funktionierende Installation aufzuziehen. Den Blog “9 after geek” betreibe ich seit Ende 2012, ich bin somit an dieser Seite seit Version 3.6 dran.

In Wirklichkeit tut dies aber nichts zur Sache – um die Frage aus der Überschrift zu beantworten: WordPress ist in Wirklichkeit eine Katastrophe!

WordPress ist schlampig

Ich liebe WordPress von ganze Herzen und verstehe die Arbeitsweise im Detail und somit auch die Problemlösung. Dennoch ist hier alles sowas von unsauber, hohe Performance ist nahezu unmöglich. Führt man einige Checks (technische Checks) mit den diversen Testprogrammen durch, erkennt man schnell hohe Latenzen, langsame Ladezeiten, viele Redundanzen, unnötige Abfragen, sich widersprechende CSS Formatierungen und vieles mehr.

Mein Artikel zur Webseitenperformance behandelt das Thema der Schlampigkeit von WordPress mit einer 3 Minuten Lösung.

Shared Hosting – Vor- und Nachteil zugleich

Befindet sich die WordPress Installation auf einem shared Hosting, das ist ein Webserver der viele Webseiten gleichzeitig ausliefert, spart man zwar Geld, ist aber auch langsam. Jetzt gäbe es die Möglichkeit einen dedicated Server anzukaufen um das Problem zu lösen. Die wahre Frage ist ob ich mir das auch leisten will. Während ich bei All-inkl.com für mein Premium Paket mit einer Vielzahl an Goodies 10 EUR monatlich zahle kostet der kleinste Webserver 100 EUR monatlich. Wieviel bin ich also bereit für meine WordPress Seite auszugeben? Vor allem da es in diesem Schritt um Performance geht?

Kostenlose Steigerung der Leistung

Eleganter halte ich in diesem Fall auf kostenlose Performance Steigerungen zurückzugreifen. Es gibt die Onsite Optimierungen am Code und durch das Testen unterschiedlicher Caching Programme. Alle Verbesserungsmöglichkeiten an der Codestruktur, den Stylesheets, der Reduktion von Plugins und so weiter sollten unbedingt genutzt werden. Egal welche Verbesserung man danach versucht, sie kann die vorherigen Fehler im Normalfall nicht mehr kaschieren. Dennoch ist bei WordPress nicht immer jede Verbesserung umsetzbar oder nutzbar.

Im nächsten Schritt, oder wenn ihr euch die Onsite Verbesserungen nicht zutraut, kommen die Offsite Verbesserungen ins Spiel. Der Umzug zu einem Content Delivery Network ist definitiv eine solche Verbesserung.

Für welche Webseiten lohnt sich ein Content delivery network?

Ich liste euch mal ein paar der Projekte auf die ich in den letzten Jahren betrieben habe:

  • 9ag.de – ein Content Blog – ja wegen der Usability und der Sicherheitsfeatures
  • abrickperday.at – ein künftiger Content Blog – ja wegen der Usability und Sicherheitsfeatures
  • abrickperday.com – ein künftiger Content Blog – ja wegen der Usability und Sicherheitsfeatures
  • free-flix.com – eine streaming Seite (mittlerweile verkauft) – ja wegen der vielen Bilder
  • simcutter.com – ein Webshop (bereits geschlossen) – ja wegen Geschwindigkeit und Sicherheit
  • microsimcutter.com – ein Webshop (bereits geschlossen) – ja wegen Geschwindigkeit und Sicherheit
  • alpenkult.com – ein Webshop (bereits geschlossen) – ja wegen Geschwindigkeit und Sicherheit
  • fiver-gigs.com – ein Fiverr Clone (bereits geschlossen) – ja wegen Geschwindigkeit und Sicherheit
  • itsmybeard.com – ein Webshop (bereits geschlossen) – nein weil bei Shopify gehostet
  • arbitragefunnelprofits.com – ein Salesfunnel (im Aufbau) – ja wegen der Geschwinditkeit

Das sind einige meiner Webseiten aus den letzten Jahren. Insgesamt hatte ich in Summe etwa 700 Domains angemeldet, aktuell sind es nur mehr knapp 40.

Wie ihr erkennen könnt, habe ich nur eine einzige Seite als nicht relevant für ein Content Delivery Network markiert. Das liegt daran, dass es eine Shopify Seite ist bei denen das Hosting sowieso nicht selbst passiert. Es wird nur die Domain bereitgestellt.

Cloudflare und WordPress – die Kochanleitung

Ich führe euch jetzt Schritt für Schritt und mit Screenshots, die ich beim erstmaligen Durchlauf vor über einem Jahr vergessen habe, durch den Prozess.

Schritt 1 – die Vorbereitung

Ihr benötigt um Cloudflare und WordPress zu verbinden:

  • Eine WordPress Seite bei der ihr Administrator seid
  • Die Möglichkeit die Nameserver eurer Domain zu ändern
  • Einen kostenlosen Account bei Cloudflare
  • 10 Minuten Zeit

Schritt 2 – Cloudflare konfigurieren

Loggt euch in eurem Account ein

 

 

Login to Cloudflare

Login to Cloudflare

Das war bereits der schwierige Teil.

Klickt auf “Add Site”

 

 

Add Website

Add Website

 

 

Tippt die Domain ein die ihr verbinden möchtet und klickt wieder auf “Add Site”

 

 

ABrickperday.com on CDN

ABrickperday.com on CDN

Ihr bekommt die Information, dass Cloudflare versucht anhand der Domain eure Nameserver Einstellungen zu ermitteln.

 

 

We are querying your DNS settings

We are querying your DNS settings

 

 

Als nächstes folgt die Abfrage des gewünschten Preismodells. Ich wähle hier “Free” aus.

 

Cloudflare select a plan

Cloudflare select a plan

 

Die Auswahl von “Free” führt bei mir zu einer Hinweismeldung. Nur eine Seite ist im Free Plan enthalten. Ich müsste für die zweite Seite somit 20 Dollar monatlich bezahlen. Da ich darauf keine Lust habe, weicht der weitere Artikel vom ursprünglichen Plan ab.

 

Nur eine Webseite ist gratis

Nur eine Webseite ist gratis

 

Schritt 2a – nur erforderlich um mehr als eine Webseite gratis bei Cloudflare CDN zu halten

Wenn ihr eure erste Seite bei Cloudflare anlegt, ist dieser Punkt für euch nicht relevant, ihr könnt weiterspringen zu Schritt 3

  • Ich habe einen neuen Useraccount mit einer anderen Mailadresse angelegt und verifiziert. Der Anlageprozess mit dieser anderen Mailadresse bringt mich leider zur selben Fehlermeldung. Cloudflare kennt mich noch.
  • Der Versuch der Anmeldung mit Microsoft Edge schlägt fehl. Ich bekomme wirre Meldungen von Cloudflare. Den Edge Browser mag wohl wirklich Niemand!
  • Der Anmeldeversuch mit dem Internet Explorer ist erfolgreich. Die Seite wurde hinzugefügt und erscheint wie im nachfolgenden Schritt 3 in meinem Dashboard.

Ich bin sehr überrascht, dass die Identifikation scheinbar nur über Browser Cookies und nicht IP-Adresse, Netzwerkkarte usw. passiert. Das scheint mir im Moment zu einfach gewesen zu sein.

Ps.: Es war auch zu einfach. Bei Auswahl des Cloudflare Plans war auch im anderen Browser Schluss. Da ich jetzt weder mit irgendwelchen Tunneln oder dergleichen rummurksen möchte, zeige ich euch den Rest mit 9ag.de.

Schritt 3 – Die Domain scheint im Dashboard von Cloudflare auf

Dashboard mit Domainübersicht

Dashboard mit Domainübersicht

 

Mit einem Klick auf dem Schraubenschlüssel landet ihr im Dashboard eurer Domain.

In diesem Dashboard wechselt ihr zu DNS und nehmt die grundlegenden Einstellungen vor.

Cloudflare Domain Menü

Cloudflare Domain Menü

 

In diesem DNS Menü gibt es nun zwei für euch wichtige Informationen.

Zuerst: Der untere Teil der Ansicht, die Cloudflare Nameservers.

Cloudflare Nameservers

Cloudflare Nameservers

 

Lasst euer Browserfenster mit der Cloudflare Konfiguration offen und erledigt den nächsten Schritt. Wir kommen später hierher zurück.

Schritt 4 – Domain konfigurieren

Meine Domains sind bei drei unterschiedlichen Anbietern gehostet:

  • Ich habe Domains bei Allinkl.com. Insgesamt sind das die zehn Domains die die höchste Jahresgebühr haben (In meinem Fall also .at Domains). Für diese zehn Domains zahle ich keine Jahresgebühr und diese Gebühr alleine würde mich bei anderen Anbietern schon mehr kosten als das gesamte Premiumpaket von Allinkl.com. Dort habe ich noch 100GB Webspace, 50 SQL Datenbanken, super Support usw. – jede Menge, das lohnt sich in jedem Fall.
  • Ich habe viele Domains bei Domain Offensive. Es gibt immer wieder Aktionen bei do.de, der Support ist schnell, Abrechnung und Konfiguration sind simpel. Über viele Jahre lang war do.de auch supergünstig was .de Domains betrifft. Diese kosteten ca. 2,5 EUR jährlich. Mittlerweile ist das anders. Die Jahresgebühr wurde angehoben und eine Einrichtungsgebühr eingeführt. Manche Livetests führe ich deshalb nicht mehr durch oder mache die Tests mit bestehenden Domains.
  • Zu guter Letzt habe ich noch Namesilo entdeckt. Obwohl ich auch bei Godaddy und Namecheap Domains hatte und habe, verwende ich aktuell öfter Namesilo. Godaddy und Namecheap habe ich aufgrund der Möglichkeit Domains sofort von einem Account zu einem anderen Account zu übertragen – auf Flippa.com (Webseiten kaufen und verkaufen) ist das der gängige Weg. Namesilo hingegen ist für .com Domains nochmal ein Stück günstiger und bietet kostenlos die Anonymisierung der Daten des Registranten.

Wie das Ausrichten der Nameserver bei Domain Offensive aussieht zeige ich euch jetzt.

Im Domainportfolio klickt ihr auf das Zahnrad bei der Domain die ihr ändern möchtet.

Do.de Domainportfolio

Do.de Domainportfolio

 

Ihr sucht den Aktionspunkt – externe Nameserver

 

externe Nameserver

externe Nameserver

 

Ihr tragt hier die Daten ein die wir bei Cloudflare vorhin angezeigt bekommen haben. Kopiert sie am besten aus dem anderen, noch geöffneten, Browserfenster.

 

Cloudflare Nameserver eintragen

Cloudflare Nameserver eintragen

 

Ein Klick auf prüfen liefert euch hoffentlich keine Fehlermeldung. Falls doch kontrolliert nochmal auf Leerzeichen oder dergleichen.

Fertig – die Domain selbst ist eingerichtet. So weit, so gut.

Schritt 5: Cloudflare zum Hoster umleiten

Die Domain verweist denjenigen der die Seite aufruft jetzt zu Cloudflare. Cloudflare selbst weiß aber noch nichts von euch und kann deshalb keine Daten ausliefern. Wir müssen deshalb Cloudflare klarmachen wo die Dateien aus denen eure WordPress Installation besteht liegen. Cloudflare und WordPress müssen sich noch finden. Cloudflare und die Domain sind soweit schon gute Freunde. Die Änderung der Nameserver kann bis zu 24 Stunden dauern. Es ist deshalb möglich, dass ihr alles umgestellt habt und die Seite eigentlich noch vom Hostingprovider anstatt dem CDN ausgeliefert wird.

Ihr könnt die Verwaltungskonsole des Domainanbieters nun schließen und das Cloudflare Browserfenster wieder öffnen.

Im oberen Teil des DNS Fensters findet ihr die automatisch ermittelten Nameserver eurer Domain. Dies war möglich da ihr ja bisher auch schon Nameserver hattet und das System annimmt ihr möchtet diese Nameserver weiterverwenden.

Bei mir führte genau dies zu einem Problem das ich vor Kurzem gelöst habe. Ich hatte die automatisch erkannten Server nicht geändert was wohl Falsch war.

Schritt 5a: Die Ermittlung der richtigen Nameserver

Allinkl.com hat eine sehr gute Anleitung in der FAQ Area die erklärt welche Daten einzutragen sind. Hier gehts zum FAQ Artikel.

Cloudflare benötigt, ähnlich wie bei der Einrichtung von Mailprogrammen, den Allinkl.com KAS Benutzernamen.

Bei mir sieht das dann so aus.

Cloudflare CNAME

Cloudflare CNAME

 

Bei euch stehen nach der erstmaligen Einrichtung unter “Type” noch A-Records. Diese Einträge könnt ihr löschen und durch die obigen CNAME Einträge ersetzen.

Schritt 6: WordPress Plugin von Cloudflare

Wenn ihr direkt in WordPress die Möglichkeit haben wollt auf Statistiken zuzugreifen benötigt ihr das Cloudflare Plugin.

Cloudflare Plugin für WordPress

Cloudflare Plugin für WordPress

 

Die Bewertung von 3,5 Sternen kann ich nachvolllziehen da es inhaltlich sehr spartanisch gehalten ist. Dennoch bietet es mir alle Informationen die ich benötige.

 

Den API Key um das Plugin zu aktivieren findet ihr im Domain Dashboard von Cloudflare (Menüpunkt Overview – Zone ID).

 

Nachfolgend einige Screenshots aus dem Plugin.

Plugin Requests

Plugin Requests

Plugin daily Visitors

Plugin Threats

Plugin Threats

 

Entscheidet am besten selbst ob euch diese Ansichten und ein paar kleine Konfigurationsmöglichkeiten ein eigenes Plugin wert sind.

Schritt 7: Cloudflare fertig konfigurieren

Ihr habt nun getan was notwendig ist um Cloudflare und WordPress zu vereinen. Jetzt geht es an die Detailarbeit der Cloudflare Konfiguration.

Klickt euch am besten wirklich durch jeden einzelnen Menüpunkt. Ihr werdet schnell sehen, dass es eine Menge Features kostenlos gibt. Außerdem sind einige Nice to have Funktionen natürlich nicht kostenlos. Da der kleinste Monatsbeitrag aber bei 20 Dollar netto pro Monat liegt solltet ihr selbst genau entscheiden wieviel ihr für eure Webseite ausgeben wollt.

Seht euch insbesondere die Menüpunkte “Speed” und “Apps” genauer an.

An Apps verwende ich Cookie Consent und Google Analytics.

Schritt 8: Feiern und warten

Egal ob ihr 12 oder 80 Jahre alt seid, Cloudflare und WordPress sind nun verbunden. In spätestens 24 Stunden könnt ihr alle Vorteile dieser Verbindung nutzen. Euch bleibt nichts weiter als zu warten und die Performance vor der Umstellung (jetzt ist noch Zeit) und nach der Umstellung (in spätestens 24 Stunden) zu messen.

Kostenlos, effizient, großartig. Obwohl ich hier viele Bilder abgelegt habe würde ich dennoch schätzen, dass ihr nicht mehr als 15 Minuten dafür benötigt habt. Es ist wirklich einfach Cloudflare und WordPress im Verband zu verwenden und ich empfehle es JEDEM. Seht beispielsweise auf den Screenshot “Plugin Threats”. Diese Bedrohungen hätten WordPress oder der Webserver meines Hostingproviders abfangen müssen. Damit es gar nicht dazu kommt, endeten diese Angriffe schon eine Stufe vorher.

Fazit

Meiner Meinung nach sollte jede Seite in einem Content Delivery Network laufen. Vor allem wenn man nur eine einzige Seite betreibt hat man keine Schwierigkeiten mit Cloudflare zu starten. Da ich beim Übertragen einer weiteren Seite in den kostenlosen Tarif von Cloudflare gescheitert bin, übertrage ich diese Seite möglicherweise noch zu einem anderen CDN. Falls dem so ist, mache ich einen Artikel daraus.

Wie hat euch dieser Artikel gefallen? Gibt es Anregungen, Wünsche oder Verbesserungen? Was sind eure Erfahrungen mit CDNs?

Bitte teilt diesen Beitrag auch mit euren Freunden:

Stefan

Ich bin Geek, Digitalnomade, Blogger, IT-Techniker, IT-Projektleiter, Denker, Weltverbesserer, Kritiker, Analytiker, Datenschützer, Lego verliebt, Vater, neugierig. Think first!

2 Comments

  1. Da ich selber auch eine englischsprachige Seite von Deutschland aus betreibe nutze ich selber Cloudflare. Die Einrichtung ist super einfach, wobei die DNS vom Anbieter umgestellt werden mussen.

    Leide etwas umständlich, aber für internationale Seiten ist das von Vorteil meiner Meinung nach.

    Beste Grüße,
    Sebastian

    • Der Hauptvorteil besteht ganz klar für Seiten die in mehreren Regionen aufgerufen werden. Aber auch Seiten wie diese hier können davon profitieren und zumindest die erste Webseite kostet nichts. Ob die DNS Einträge selbst geändert werden können oder nicht hängt vom Hosting Provider ab. Sofern dieser Service nichts extra kostet ist es eigentlich egal ob man es selbst macht oder der Support 🙂

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.