Stammesseite in 30 Minuten (Teil 1)

 

Screenshot der stammesseite

Screenshot der stammesseite

Heute möchte ich euch zeigen, wie man in wenigen Minuten eine Stammesseite erstellen kann, die nur wenig Wartung und Pflege benötigt. Wir werden die Seite zu github hochladen, wo diese dann für euch zum Download bereit steht.

Github

Github wird normalerweise von Softwareentwicklern für die Verwaltung ihres Programmcodes verwendet. Es bietet aber auch die Möglichkeit Projekt- oder wie in unserem Fall Stammesseiten zu betreiben.

Also los gehts. Zunächst brauchen wir einen Github Account. Hierzu meldet ihr euch einfach auf https://github.com an.

screenshot der github page

screenshot der github page

Nachdem ihr den Account eingerichtet habt, legen wir für den Stamm eine eigene Organisation an und merken uns den Namen. Das bietet uns die Möglichkeit, dass später auch andere die Seite pflegen können. Jetzt ist soweit alles eingerichtet, dass wir unsere Seite „forken“ (eine art Kopieren) können. Hierzu ruft ihr das Beispielprojekt auf (https://github.com/vcp-de/vcp-de.github.io). Dort gibt es einen Button auf dem „fork“ steht. Nach dem ihr den geklickt habt, werdet ihr gefragt, wohin ihr das Projekt forken möchtet. Dort wählt ihr eure Stammes Organisation aus.

Jetzt fehlt noch ein letzter Schritt. Damit aus dem Projekt auch eine Webseite wird muss es umbenannt werden. Hierzu klicken wir Rechts auf „Settings“. Danach können wir ganz oben den Projektnamen ändern. Der neue Projektname sollte folgendem, Schema entsprechen: „<organisations_name>.github.io“. Nach dem dieser letzte Schritt abgeschlossen ist können wir schon mal versuchen, ob die Seite zu Erreichen ist. Hierzu einfach im Browser „http://<organisations_name>.github.io“ eingeben und gucken was passiert. Wenn erstmal eine Fehlermeldung angezeigt wird versucht es 5 Minuten später einfach nochmal. Es kann sein, dass es etwas dauert bis die Änderungen von github umgesetzt sind.

Keine Panik, wenn ihr es bis hierher geschafft habt, habt ihr den kompliziertesten Teil hinter euch.

Bearbeiten der Einstellungen

OK, das ist jetzt ja schon ganz schön, aber die Daten stimmen alle nicht. Nun wollen wir die Daten direkt in github ändern. Im nächsten Blog Post gehen wir dann darauf ein, wie ihr die Webseite auch lokal bearbeiten könnt und die Bilder ändert.

Datei Bearbeiten

Datei Bearbeiten

Als erstes müssen wir die Datei _config.yml anpassen. Nachdem ihr die Datei aufgerufen habt, findet ihr oben in der rechten Ecke einen kleinen Bleistift. Wenn ihr diesen anklickt könnt ihr die Datei bearbeiten. Nicht alle Einträge sind im moment wichtig für uns. Zunächst passen wir nur die ersten  paar an.

# Site settings

# Titel der Seite (z.B. Stammes Name)
title: "VCP Stamm Martin Luther"

# Kurzbeschreibung der Gruppe
description: "Pfadfinden in Eisenach."

# Stammes Name (für die Adresse)
group_name: VCP Stamm Martin Luther

# Adresse der Gruppe (das <br/> macht einen Zeilenumbruch)
group_address: >
 Am Kirchweg 3<br/>
 12345 Eisenach

# Telefonnummer für Anfragen (z.B. vom Stammesleiter)
group_phone: 0123 / 456 78 90

# Emailadresse des Stammes
group_email: kontakt@test-stamm.de

# Name des Webmasters
name: 'Walter Webmaster'

# Emailadresse des Webmasters
email: info@johannes-engelke.de

# URL der Seite
url: "http://<organisation_name>.github.io/" # the base hostname & protocol for your site

...

Bei den drei Punkten geht die Datei noch weiter, den Teil werden wir später nochmal ansehen.

Bevor wir jetzt die Seite speichern können müssen wir noch eine kurze Änderungsbeschreibung angeben und dann auf „Commit changes“ klicken (siehe Bild).

Commit Message eingeben und Änderungen speichern

Commit Message eingeben und Änderungen speichern

Zusammenfassung

Was haben wir bisher erreicht? Wir haben das Projekt kopiert und können es bereits über den Browser erreichen. Wir haben die Konfiguration angepasst, damit korrekte Daten angezeigt werden. Soweit so gut, aber ein paar Details fehlen noch. In den nächsten Teilen werden wir uns dran machen und ein paar Social Media Kanäle einbinden und gucken, wie wir Stämme und die Leitungsrunde integrieren können.

Hat euch die kleine Anleitung gefallen? Habt ihr sie vielleicht schon umgesetzt? – Wir freuen uns über Anregungen, Lob und Kritik. Am besten ihr verwendet die Kommentar Funktion am Ende der Seite.

Kommentare sind geschlossen.