So richten Sie eine Headless-WordPress-Website ein

Bei Headless-WordPress-Sites geht es darum, das Back- und Front-End Ihrer Website zu trennen. Mit diesem Ansatz können Sie statische Kopien Ihrer Website erstellen. Bei einer Headless-WordPress-Site verwenden Sie im Gegensatz zum herkömmlichen Modell nicht WordPress zum Generieren des Frontends Ihrer Site. Daraus ergeben sich zwei wesentliche Vorteile: schnellere Ladezeiten und erhöhte Sicherheit.

So richten Sie eine Headless-WordPress-Website ein (mit AWS)

Sie können Ihre Headless-WordPress-Site bei jedem beliebigen Anbieter hosten. In diesem Tutorial erstellen wir jedoch eines mit Hilfe von

. Wenn Sie statische Websites hosten möchten, können Sie diese mit AWS auf einfachste und bequemste Weise einrichten. Befolgen Sie die drei unten genannten einfachen Schritte und richten Sie Ihre Headless-WordPress-Site mit wenigen Klicks ein.

Schritt 1:
Erstellen Sie Ihr AWS-Konto oder melden Sie sich an

Das Einrichten einer Headless-WordPress-Site mit AWS ist mit etwas mühsamerer Kleinarbeit verbunden als auf herkömmliche Weise. Allerdings entschädigt es Sie in puncto Kosteneffizienz deutlich für diesen Aufwand. Es kann Sie nur 0,50 $ pro Monat kosten. Darüber hinaus nutzen wir für das Hosting die Amazon S3-Stufe  , die 12 Monate kostenloses Hosting bietet.

So richten Sie eine Headless-WordPress-Website ein – Arvind

Sie können sich ganz einfach für Ihr Konto anmelden, indem Sie auf die Option „Erste Schritte mit Amazon S3“ klicken  und das Registrierungsformular ausfüllen. Wenn Sie bereits in Ihrem Amazon-Konto angemeldet sind, finden Sie  stattdessen die Schaltfläche „Anmeldung abschließen“ . Der Prozess bleibt jedoch derselbe.

Schritt 2:
Erstellen Sie eine statische Kopie Ihrer Website

Wie wir bereits besprochen haben, fungiert WordPress in einem Headless-Setup als Backend. Daher müssen Sie WordPress irgendwo installieren, damit es als Backend Ihrer Website fungieren kann. Darüber hinaus werden auch statische Inhalte für Ihr Frontend generiert. Im Tutorial wird auf eine lokale Installation eingegangen, so dass Sie nicht für zwei verschiedene Hosting-Anbieter bezahlen müssen .

Es gibt verschiedene Möglichkeiten, eine lokale WordPress-Website zu installieren:

  • Mit Tools wie XAMPP eine vollständige lokale WordPress-Umgebung erstellen
  • Verwendung von Software wie Local von Flywheel, die speziell für lokale WordPress-Installationen entwickelt wurde

Letzteres bietet natürlich einen benutzerfreundlicheren Ansatz für die Einrichtung einer lokalen WordPress-Website. Laden Sie die Software „Local by Flywheel“ herunter, installieren Sie sie  und richten Sie eine neue lokale Website ein.

Nachdem Sie Ihre lokale Website konfiguriert und angepasst haben, aktualisieren Sie Ihre Einstellungen, wählen Sie ein Thema aus und erstellen Sie Seiten und Beiträge. Sobald Sie mit dem Inhalt und dem Thema der Website fertig sind, können Sie ein statisches Frontend dafür erstellen.

Um dies zu erreichen, richten wir das WP2Static-Plugin ein . Sie können hierfür auch einige andere Plugins verwenden. Aber WP2Static funktioniert reibungslos mit mehreren Plattformen, darunter AWS, Netlify, GitHub Pages und mehr.

Sobald Sie das Plugin eingerichtet haben, finden Sie es in Ihrem Dashboard. Wenn Sie darauf zugreifen, gelangen Sie direkt zur Registerkarte „Statische Website bereitstellen“  .

So richten Sie eine Headless-WordPress-Website ein – Arvind

Geben Sie im Feld Ziel-URL  die URL ein, über die die Besucher auf Ihre Website zugreifen. Beachten Sie, dass dies von Ihrer Amazon S3-Konfiguration abhängt. Wählen Sie abschließend Amazon S3 im Dropdown-Menü aus, wo Sie den Host für die statische Version auswählen müssen.

Im nächsten Schritt, vor der Bereitstellung, werden wir die Einstellungen konfigurieren und eine Verbindung herstellen

zur Website

Schritt 3:
Automatische Bereitstellung statischer Seiten in AWS

Sobald Sie Amazon S3 als Hosting auswählen, werden mehrere Optionen angezeigt:

So richten Sie eine Headless-WordPress-Website ein – Arvind

Sie müssen zunächst sowohl Ihre Zugriffsschlüssel-ID als auch Ihren geheimen Zugriffsschlüssel eingeben, bevor Sie mit der Bereitstellung beginnen können. Beachten Sie, dass die Zugriffsschlüssel-ID über die richtigen Berechtigungsstufen verfügen muss, damit die Bereitstellung erfolgreich ist.

Nachdem Sie beide Schlüssel in die entsprechenden Felder eingegeben haben, müssen Sie nun die Region auswählen, in der Ihr AWS-Bucket erstellt wurde, und seinen Namen so eingeben, wie er in Ihrer AWS-Konsole angezeigt wird:

Gehen Sie abschließend zum Ende der Seite und klicken Sie auf die Schaltfläche  „Export statischer Site starten“  . Dieser Schritt dauert normalerweise eine Weile, wenn Ihre Website groß ist. Sobald der Vorgang abgeschlossen ist, können Sie auf die statische Live-Version Ihrer Website zugreifen. Mit anderen Worten: Sie haben erfolgreich eine Headless-WordPress-Website eingerichtet.

Abschluss

Und voilà! Mit diesen drei einfachen Schritten sollten Sie Ihre Headless-WordPress-Website erfolgreich eingerichtet haben. Bedenken Sie, dass das Headless-Modell nicht für jede Website geeignet ist. Wenn Ihre Website jedoch nicht über viele dynamische Elemente verfügt, erhöhen sich ihre Sicherheit und Leistung durch ein statisches Frontend.

  • Klicken Sie hier, um das beste WordPress-Hosting speziell für WordPress zu erhalten.