So verwenden Sie Cloudflare Pages mit WordPress

Das Hosting Ihrer statischen WordPress-Website auf Cloudflare Pages ist der sicherste Weg, Ihre Website deutlich zu beschleunigen. Diese leistungsstarke Kombination bietet Ihren Website-Besuchern ein schnelles, äußerst sicheres und nahtloses Online-Erlebnis.

Dieser Beitrag soll Ihnen dabei helfen, Ihre WordPress-Website in eine statische Website umzuwandeln und sie mithilfe von Cloudflare Pages bereitzustellen.

cloudflare pages wordpress

Das erwartet Sie in diesem Leitfaden:

  • Was Cloudflare Pages ist.
  • Die Vorteile des Hostings von WordPress auf Cloudflare Pages.
  • Schritte zum Hosten Ihrer WordPress-Website auf Cloudflare Pages.

Bevor wir jedoch beginnen, sehen wir uns an, was Cloudflare Pages ist und welche enormen Vorteile es bietet.

Was ist Cloudflare Pages?

Cloudflare Pages ist ein kostenloser, schneller und zuverlässiger Anbieter für statisches Hosting von Cloudflare. Durch die direkte Verbindung mit Ihrem GitHub-Repository wird die Bereitstellung und das Hosting statischer Websites vereinfacht.

Dadurch können Sie Ihre statische Website mit wenigen Klicks auf Cloudflare Pages bereitstellen – und sie ist innerhalb weniger Minuten verfügbar.

cloudflare pages wordpress

Dank der GitHub-Integration aktualisiert Cloudflare Pages automatisch alle Änderungen, die Sie nach der Bereitstellung an Ihrer Live-Website vornehmen. Dazu müssen Sie lediglich Ihre Aktualisierungen an GitHub übertragen. Cloudflare Pages übernimmt die gesamte Arbeit für Sie, sodass Sie sich ganz auf die Gestaltung Ihrer Websites und Webanwendungen konzentrieren können, um Ihren Nutzern die bestmögliche Erfahrung zu bieten. 

Cloudflare Pages ist auch eine praktische Option für Entwickler und Website-Betreiber, die bei Projekten mit ihren Teams zusammenarbeiten möchten.

Die Bereitstellung von Websites auf Cloudflare Pages erfolgt automatisch, effizient und reibungslos. Wir zeigen Ihnen später in diesem Leitfaden, wie das funktioniert. Zunächst sollten wir jedoch verstehen, was eine statische Website ist, da wir Ihre Website vor der Bereitstellung in eine statische Website umwandeln werden. 

Was ist eine statische Website?

Eine statische Website ist eine Sammlung vorab codierter HTML-, CSS- und manchmal Javascript-Dateien, die verschiedene Webseiten darstellen. 

Im Gegensatz zu dynamischen Websites, die Sprachen wie PHP verwenden, um Inhalte in Echtzeit auf Grundlage von Nutzerinteraktionen zu generieren, zeigen statische Websites jedem Besucher dieselben Inhalte. 

static website wordpress

Statische Websites können mithilfe clientseitiger Sprachen wie CSS zur Gestaltung und JavaScript für interaktive Elemente interaktiv oder ansprechend gestaltet werden. Dazu gehören beispielsweise anklickbare Links und Schaltflächen, Bilder, Videos, Formulare und vieles mehr.

Diese Websites eignen sich in der Regel hervorragend für Portfolios, Blogs, einmalige Landingpages, Informations- bzw. Nur-Lese-Websites usw. Das Hosting dieser Website mit Cloudflare Pages steigert ihre Leistung, Seitengeschwindigkeit und Sicherheit erheblich.

Sehen wir uns nun die wichtigsten Vorteile des Hostings von WordPress auf Cloudflare Pages an.

Die Vorteile des Hostings von WordPress auf Cloudflare Pages

Das Hosting einer statischen WordPress-Website auf Cloudflare Pages bietet zahlreiche Vorteile. Dazu gehören:

Geschwindigkeit und Leistung 

Statische WordPress-Websites laden in der Regel schneller, da sie weniger Serverressourcen und Datenbankabfragen benötigen. Das Hosting auf Cloudflare Pages steigert die Geschwindigkeit Ihrer Website zusätzlich.

static website speed

Sie erhalten Zugriff auf:

  • Automatic Platform Optimization (APO) ist der einfachste Weg, Ihre WordPress-Website durch Funktionen wie automatisches Caching sowie die Optimierung von Bildern &Assets usw. deutlich zu beschleunigen. Sie können APO aktivieren, wenn Sie das Cloudflare WordPress-Plugin installieren.
  • Browser-Caching beschleunigt Ihre Website für wiederkehrende Besucher.
  • Ein Content Delivery Network (CDN) , das Inhalte schnell über Server bereitstellt, die Ihren Besuchern am nächsten sind.
  • Seitenregeln , die festlegen, wie der Browser eines Besuchers oder Cloudflare Ihre statischen Dateien zwischenspeichert.
  • Und mehr.

Diese Funktionen sorgen für eine schnelle Bereitstellung und verbessern die Benutzererfahrung – Suchmaschinen wie Google belohnen schnelle Websites mit hohen SEO-Rankings. Neben der Verbesserung Ihrer SEO-Rankings spielt die Seitengeschwindigkeit eine entscheidende Rolle dabei, Besucher auf Ihrer Website zu halten.

Der Grund dafür ist, dass 40 % der Website-Besucher die Website verlassen, wenn das Laden länger als 4 Sekunden dauert. 

Verbesserte Sicherheit

Das Hosting Ihrer statischen WordPress-Website auf den Cloudflare Pages macht sie ebenfalls deutlich sicherer. Cloudflare Pages verfügt über leistungsstarke Sicherheitsfunktionen, darunter DDoS-Schutz und eine Cloud Web Application Firewall (WAF). Diese Technologien fungieren als Schutzschilde, die Ihre WordPress-Website vor einfachen und fortgeschrittenen Online-Bedrohungen schützen.

Cloudflare Pages stellt außerdem kostenlose SSL-Zertifikate für Ihre Website bereit. Dadurch wird sichergestellt, dass Ihre Websites HTTPS verwenden und eine sichere Verbindung herstellen. HTTPS schützt zudem die Privatsphäre der Nutzer und alle sensiblen Informationen, die sie mit Ihrer Website teilen.

Eine sichere Website macht einen großen Unterschied, insbesondere bei WooCommerce-Websites. Schließlich zeigen Untersuchungen, dass 84 % der Nutzer einen Kauf aufgrund einer unsicheren Verbindung abbrechen. 

Automatische Skalierung

Cloudflare Pages kann große Mengen an Website-Traffic erfolgreich bewältigen, selbst wenn zahlreiche Besucher gleichzeitig auf die Website zugreifen. 

Unabhängig davon, ob Ihre WordPress-Website plötzliche Traffic-Spitzen verzeichnet oder die Besucherzahlen im Laufe der Zeit allmählich steigen – Cloudflare kann diese Situationen mühelos bewältigen. 

Vor allem gewährleistet der Dienst, dass Ihre Website auch in Zeiten hoher Nachfrage reaktionsschnell und zugänglich bleibt. Dadurch wird eine nahtlose Benutzererfahrung auf Ihrer Website sichergestellt.

static website in github

Vereinfachte, automatische Bereitstellung

Da Cloudflare Pages in GitHub integriert werden kann, stellt Cloudflare Pages jede Änderung oder Aktualisierung, die Sie an GitHub übertragen, automatisch auch auf der Live-Website bereit. Dadurch wird der Bereitstellungsprozess optimiert.

Git ist in diesem Fall ebenfalls nützlich, da es Funktionen zur Versionskontrolle bietet und die Zusammenarbeit im Team ermöglicht.

Präzise Webanalysen

Cloudflare Pages bietet Echtzeit-Einblicke in Ihre Seiten mit datenschutzorientierten Analysen, die Sie mit Ihrem Team teilen können. Die präzisen Analysen können Daten wie die Anzahl der Besuche und die Standorte der Website-Nutzer umfassen.

Mehrere integrierte Optimierungen

Cloudflare Pages bietet zahlreiche Optimierungstechniken, die alle ressourcenintensiven Aufgaben bewältigen sollten, die Ihre statische Website verlangsamen können.

Dazu gehören:

  • Automatische Minimierung von HTML/CSS/JavaScript – dadurch wird die Größe statischer Dateien reduziert und die Website läuft schneller und reibungsloser.
  • WebP- und Bildoptimierung – diese Funktion ist im kostenlosen Tarif nicht verfügbar.
  • Rocket Loader – optimiert Ihre statischen Skriptdateien zusätzlich.
  • Brotli-Komprimierung – hilft dabei, die Ladezeiten für Ihre Besucher zu verkürzen.
  • Und mehr.
cloudflare pages wordpress security

Wer würde am meisten von Cloudflare Pages profitieren?

Die folgenden Personen können am meisten von der Nutzung von Cloudflare Pages profitieren:

  • Frontend-Entwickler, die Websites und Webanwendungen hosten, bereitstellen und skalieren möchten, die eine schnelle Inhaltsdarstellung erfordern. Dank der Git-Integration können diese Entwickler außerdem innerhalb ihrer Teams zusammenarbeiten und an einem Projekt arbeiten.
  • Start-ups und kleine Unternehmen mit begrenztem Budget können ebenfalls von dieser Lösung profitieren. Cloudflare Pages bietet leistungsstarkes Webhosting, ohne dass eine komplexe Serververwaltung erforderlich ist.
  • E-Commerce-Websites können ebenfalls die Fähigkeit von Cloudflare Pages nutzen, hohe Traffic-Lasten zu bewältigen und ihren Kunden ein reibungsloses Online-Einkaufserlebnis zu bieten.

Im Wesentlichen sollte jeder, der eine blitzschnelle, vor Online-Bedrohungen sichere Website möchte, die steigende Besucherzahlen bewältigen kann, Cloudflare Pages in Betracht ziehen.

Nun wissen wir, was Cloudflare Pages ist und welche Vorteile das Hosting Ihrer statischen Website auf dieser Plattform bietet. Wir können nun mit den Schritten fortfahren, die Sie durchführen müssen, um Ihre WordPress-Website auf Cloudflare Pages zu hosten.

Schritte zum Hosten Ihrer WordPress-Website auf Cloudflare Pages

Wenn Sie Ihre WordPress-Website auf Cloudflare Pages hosten möchten, müssen Sie sie zunächst in eine statische WordPress-Website umwandeln, bevor wir sie bereitstellen können.

In diesem Abschnitt führen wir Sie mithilfe eines WordPress-Plugins, Simply Static, Schritt für Schritt durch diesen Prozess. Es ist der beste und beliebteste Generator für statische Websites für WordPress auf dem Markt.

Hinweis: Dieser Leitfaden setzt voraus, dass Sie über ein Administratorkonto auf Ihrer WordPress-Website verfügen.

Warum Simply Static verwenden?

Simply Static ist ein WordPress-Plugin, mit dem Sie Ihre dynamische WordPress-Website mit nur einem Klick in eine statische Website umwandeln können. 

Dieses Plugin wandelt Ihr WordPress-Theme, Seiten, Beiträge, dynamische Inhalte wie Formulare und Kommentare und vieles mehr einfach in ihre statische Version um. Dieser Vorgang geht schnell, sodass Sie nicht lange auf den Abschluss warten müssen.

static wordpress simply static

Mit Simply Static können Sie Ihre WordPress-Website in eine statische Website umwandeln und von den folgenden Vorteilen profitieren:

  • Mehr Geschwindigkeit und Sicherheit – Dieses Plugin eliminiert Datenbankabfragen, verbessert dadurch die Ladezeiten von Seiten und verringert das Risiko von Website-Hacks.
  • Weniger Wartungsaufwand für die Website – Es macht WordPress-Caching-Plugins und häufige Aktualisierungen überflüssig, die manchmal Sicherheitslücken verursachen können.
  • Kosteneffizient – Statische Websites benötigen normalerweise weniger Serverressourcen, wodurch die Hostingkosten sinken. 
  • Mehrere Bereitstellungsoptionen – Es funktioniert gut mit Cloudflare Pages, Netlify, Vercel, GitHub Pages und weiteren Plattformen. Der Bereitstellungsprozess der Website wird mithilfe der Webhook-Integration von Simply Static automatisiert, was ihn besonders unkompliziert macht.
  • Simply Static lässt sich in dynamische Elemente wie Formulare und Kommentare integrieren. Dadurch gehen Benutzerinteraktionen und Feedback auch auf einer statischen Website nicht verloren.
  • Simply Static unterstützt die Minifizierung – CSS-, JavaScript- und statische HTML-Dateien werden für eine schnellere und reibungslosere Website-Performance minifiziert
simply static export

Simply Static unterstützt Multisite, ermöglicht einfache Aktualisierungen, bietet eine grundlegende Suchfunktion und vieles mehr. Diese Liste ist endlos. Fast alle diese Funktionen sind in den Simply Static Pro-Tarifen verfügbar. Mit dem kostenlosen Tarif ist nur ein vollständiger statischer Export möglich. 

Nachdem wir all dies berücksichtigt haben, beginnen wir nun mit unserem Leitfaden zur Bereitstellung einer statischen Website auf Cloudflare Pages.

Schritt 1: Simply Static installieren

Für den Anfang müssen Sie Simply Static Pro auf Ihrer WordPress-Website installieren. Sie können das Plugin hier erwerben: Simply Static.

Befolgen Sie anschließend diese Schritte, um es auf Ihrer WordPress-Website zu installieren:

  1. Melden Sie sich in Ihrem WordPress-Dashboard an. 
  2. Gehen Sie zu Plugins > Neu hinzufügen und klicken Sie auf die Schaltfläche Plugin hochladen. 
  3. Laden Sie die heruntergeladene Erweiterung hoch und klicken Sie auf „Jetzt installieren“.
  4. Klicken Sie nach Abschluss der Installation auf Aktivieren. Fügen Sie Ihren Lizenzschlüssel ein, um Ihren Kauf zu bestätigen. 

Als Nächstes bereiten wir Ihre WordPress-Website für die Konvertierung vor.

Schritt 2: Ihre WordPress-Website für die Konvertierung in eine statische Website vorbereiten

Führen Sie die folgenden Schritte aus, um Ihre WordPress-Website statisch zu machen:

  1. Gehen Sie in Ihrem WordPress-Dashboard zu Simply Static Settings und klicken Sie auf den Tab General . 
  2. Geben Sie im Bereich „Include/exclude“ alle URLs von Seiten an, die Sie vom Static Site Generator ausschließen möchten. Hinweis: Links zu /wp-admin oder ähnlichen internen WordPress-Routen werden nicht unterstützt.
  3. Wenn Sie die traditionell dynamischen Funktionen Forms, Search und Comments verwenden möchten, können Sie diese in den jeweiligen Tabs einrichten. 
simply static general tab

Als Nächstes verbinden wir Simply Static mit GitHub, damit wir problemlos deployen können.

Schritt 3: Simply Static mit GitHub verbinden

Durch die Integration von GitHub in Simply Static können Sie Ihre statische WordPress-Website zu Cloudflare Pages exportieren. 

Zunächst müssen Sie unter Github.com ein GitHub-Konto erstellen und anschließend Ihr persönliches Zugriffstoken (PAT) finden. Dieses Token ist nur für Sie bestimmt. Wir verwenden es, damit Simply Static mit GitHub kommunizieren kann. Eine ausführliche Anleitung finden Sie in unserem Leitfaden zur Einrichtung der GitHub-Integration.

Kehren Sie anschließend zu Ihrem WordPress-Dashboard zurück und verbinden Sie Simply Static wie folgt mit GitHub: 

  1. Gehen Sie zu Simply Static > Settings > Deployment. 
  2. Wählen Sie GitHub als Bereitstellungsoption aus. Dadurch wird Simply Static angewiesen, die Dateien Ihrer statischen Website an GitHub zu senden.
  3. Geben Sie die erforderlichen Angaben ein, einschließlich Ihres persönlichen Zugriffstokens und des Repository-Namens. 
simply static github deployment

Nachdem wir alles konfiguriert haben, ist es an der Zeit, Ihre statischen Dateien zu GitHub zu exportieren. Gehen Sie dazu wie folgt vor: 

  1. Gehen Sie zu Simply Static > Generate und klicken Sie oben links auf der Seite „Simply Static Settings“ auf die Schaltfläche Generate Static Files . 
  2. Die Konvertierung beginnt, und Sie können den Fortschritt unter Simply Static > Generate > Activity log anzeigen.
  3. Sobald der Vorgang abgeschlossen ist, werden alle Ihre statischen Dateien in Ihr konfiguriertes GitHub-Repository exportiert. 
github run export

Ihre statische WordPress-Website ist nun bereit für die Bereitstellung.

Schritt 4: Ihre Website auf Cloudflare Pages bereitstellen

Cloudflare Pages ermöglicht Ihnen die Bereitstellung Ihrer statischen Website durch eine Verbindung mit Ihrem GitHub-Konto. Falls Sie noch kein Konto haben, müssen Sie zunächst ein Cloudflare-Konto erstellen.

Führen Sie anschließend die folgenden Schritte aus, um eine Verbindung mit Ihrem GitHub-Konto herzustellen:

  1. Melden Sie sich beim Cloudflare-Dashboard an und wählen Sie unter „Account Home“ Ihr Konto aus. 
  2. Gehen Sie anschließend zu Workers & Pages.
  3. Klicken Sie auf die Schaltfläche Connect to Git, um Ihr GitHub-Konto zu verbinden. Wählen Sie anschließend das Repository aus, das Sie als statische Website bereitstellen möchten. 
cloudflare pages dashboard
  1. Anschließend werden Sie zu GitHub weitergeleitet, um Ihr Passwort zu bestätigen.
  2. Klicken Sie auf Einrichtung starten , wenn Sie fertig sind.
cloudflare pages github
  1. Als Nächstes richten wir automatische Builds und die Bereitstellung Ihrer Website für Ihr GitHub-Repository ein. Sie müssen einen Projektnamen festlegen (oder den Namen des Repositorys beibehalten) und einen Branch Ihres Repositorys auswählen. 
  2. Sie können die übrigen Einstellungen überspringen und auf Speichern und bereitstellen klicken, um Ihre Website bereitzustellen.
cloudflare pages deploy site
  1. Der Bereitstellungsprozess findet in Echtzeit statt. Sobald er abgeschlossen ist, werden Sie zur Projektübersicht weitergeleitet.
cloudflare pages wordpress deploy

Ab jetzt wird Cloudflare Pages jedes Mal, wenn Sie eine Aktualisierung oder Änderung an GitHub übertragen, diese automatisch auch auf Ihrer Live-Website bereitstellen.

Cloudflare Pages noch heute für WordPress nutzen

Das war’s. In diesem Leitfaden haben wir untersucht, wie Sie WordPress-Websites auf Cloudflare Pages hosten und bereitstellen. Im Gegensatz zu herkömmlichen Hosting-Anbietern vereinfacht Cloudflare Pages das Webhosting und sorgt für Geschwindigkeit, Website-Sicherheit und eine verbesserte Website-Performance.

Simply Static optimiert durch die Integration mit GitHub den Prozess, Ihre WordPress-Website auf Cloudflare Pages zu hosten. Sie können damit Ihre WordPress-Website in eine statische Website umwandeln und die Geschwindigkeit einer statischen Website mit der Effizienz von Cloudflare Pages kombinieren. 

Bieten Sie Ihren Website-Besuchern noch heute mit Simply Static die bestmögliche Nutzererfahrung!