Lilo.Blog installieren

Mit dieser Anleitung kannst du deinen eigenen Lilo.Blog einrichten. Wir brauchen zwei Komponenten:

  1. GitHub, um den Website-Code und den zuk√ľnftigen Inhalt des Blogs zu speichern.
  2. Netlify, um die Website auf einem Server zu hosten. So kann der Blog im Internet aufgerufen werden.

Nun legen wir los mit der Installation.

1. GitHub Account erstellen

Gehe zu GitHub und erstelle dort einen Account:

GitHub Account erstellen. Als Benutzername z.B. den Vor- und Nachnamen verwenden.
GitHub Account erstellen. Als Benutzername z.B. den Vor- und Nachnamen verwenden.

Als n√§chstes wirst du deine Mailadresse best√§tigen m√ľssen.

Du wirst zuk√ľnftig kaum mehr mit GitHub selbst zu tun haben, ausser du willst mal etwas Nerd-m√§ssig dort tiefer graben. Grunds√§tzlich werden aber die Blogeintr√§ge und Bilder f√ľr dich automatisch dort unter content abgelegt.

Backup-Tipp: Falls du später mal ein Backup machen willst, so kannst du dich bei GitHub anmelden und mit dem Knopf Code->Download Zip deinen ganzen Blog herunterladen.

2. Lilo.Blog-Vorlage kopieren

Unter github.com/marcojakob/lilo.blog findest du die aktuelle Version der Lilo.Blog-Vorlage. Diese kannst du jetzt f√ľr dich kopieren, indem du auf den folgenden Knopf Deploy to Netlify klickst:

Deploy to Netlify

Netlify richtet fast alles automatisch ein. Wir m√ľssen einfach noch ein paar Dinge best√§tigen.

Schritt 1: Mit GitHub verbinden
Schritt 1: Mit GitHub verbinden
Schritt 2: Speichern und Veröffentlichen
Schritt 2: Speichern und Veröffentlichen

Nun wurde die Vorlage auf dein GitHub kopiert und alles bei Netlify eingerichtet f√ľr das Hosting.

3. Admin-Passwort erstellen

Damit wir später unsere Blogeinträge verwalten können, brauchen wir ein Admin-Passwort.

Du solltest von Netlify eine E-Mail erhalten haben. Klicke auf Accept the invite.

Admin-Passwort erstellen.
Admin-Passwort erstellen.

Dann sollte sich ein Passwort-Feld √∂ffnen, wo du ein Admin-Passwort f√ľr deinen Blog w√§hlen kannst.

4. Namen wählen

Die Website wird standardmässig unter einer zufälligen und ziemlich langen Adresse angegeben, wie diese hier:

Um diese Adresse zu k√ľrzen, k√∂nnen wir unter Settings mit dem Knopf Change site name den Namen √§ndern. Du kannst irgendetwas ausw√§hlen.

Unter Settings den Namen ändern.
Unter Settings den Namen ändern.
Eigenen Namen wählen.
Eigenen Namen wählen.

Nun sollte die Website unter dem einfacheren Namen aufrufbar sein. Der Blog hat aber immer noch den Zusatz .netlify.app dabei. Dies ist zum Testen ganz ok, aber sollte später ersetzt werden mit unserem ganz eigenen Domainnamen.

F√ľr einen eigenen Domainnamen m√ľssen wir eine Domain kaufen (ca. CHF 9 pro Jahr) bei einem Domainanbieter und dann die Domain mit Netlify verkn√ľpfen. Diese Schritte unterscheiden sich je nach dem, wo du die Domain kaufst. Hier ist eine Anleitung, wie du eine eigene Domain einrichten kannst. Wahrscheinlich brauchst du dazu einen Nerd deines Vertrauens.

5. Lilo.Blog editieren mit dem Netlify CMS

Nun sollte dein Lilo.Blog bereit und unter der gewählten Adresse abrufbar sein. Die Admin-Oberfläche erreichst du, indem du bei deinem Blog /admin anhängst.

Zum Beispiel https://marcoblog.netlify.app/admin

Dort erscheint nun die Admin-Oberfläche mit dem Netlify CMS.

Bei Netlify CMS anmelden.
Bei Netlify CMS anmelden.
Mit der E-Mail-Adresse und dem gewählten Admin-Passwort anmelden.
Mit der E-Mail-Adresse und dem gewählten Admin-Passwort anmelden.

Wenn alles funktioniert, sollte jetzt das Netlify CMS erscheinen.

Oberfläche des Netlify CMS.
Oberfläche des Netlify CMS.

ūüéČ Gratuliere, wenn du es bis hier geschafft hast! Zugegeben, das Einrichten ist etwas aufw√§ndig. Aber ab jetzt kannst du bequem auf der Admin-Oberfl√§che unter /admin deine Blogeintr√§ge erfassen.

Übrigens: Wie du deinen ganz eigenen Domainnamen (ohne netlify.app) einrichten kannst, erfährst du in diesem Blogartikel.