haccfiles/websites/help.studentsforfuture.info/website/og-homepage.md

70 lines
4.6 KiB
Markdown
Raw Permalink Normal View History

## Ortsgruppen-Homepage selbst erstellen
- [Gestalten der Website](website/og-homepage.md?id=gestalten-der-website)
- [Titelbild einfügen](website/og-homepage.md?id=titelbild-einfügen)
- [Terminkalender einbauen](website/og-homepage.md?id=terminkalender-einbauen)
- [Profilbildgenerator einrichten](website/og-homepage.md?id=profilbildgenerator-einrichten)
Die Website bietet alle Informationen die ihr braucht, um eure **eigene OG-Homepage** zu basteln. Dazu braucht ihr **keine besonderen technischen Kenntnisse**, ihr solltet aber ein Auge für Design haben.
Der Link zu eurer Homepage lautet dann "studentsforfuture.info/ortsgruppe/*Name eurer OG*". Hier ist ein [Beispiel der OG Leipzig](https://studentsforfuture.info/ortsgruppe/leipzig/).
Zum Homepage-Editor gelangt ihr über den Reiter `Pages`. Dort findet ihr bereits eine Seite die den Namen eurer OG trägt. Klickt einfach auf `bearbeiten`, um deren Design & Inhalte anzupassen.
### Gestalten der Homepage
In der Mitte der Eingabemaske ist die aktuelle Arbeitsversion eurer Website zu sehen. Um ein geändertes Design zu testen, könnt ihr oben rechts `Vorschau` auswählen. Wählt `Aktualisieren`, damit die Änderungen auch auf der tatsächlichen Homepage geändert werden.
Neue Elemente fügt ihr mit dem `+`-Knopf hinzu, der in der linken oberen Ecke der Eingabemaske liegt. Dort könnt ihr zwischen **verschiedensten Designblöcke** auswählen.
Anschließend könnt den Block auf der Seite an die **gewünschte Position** ziehen. Ebenso könnt ihr ihn wieder **löschen oder duplizieren**.
Wählt ihr einen existierenden Block aus, so erscheint rechts neben der Eingabemaske ein **Optionsmenü, mit verschiedenen Einstellungsmöglichkeiten**. Zum Beispiel lässt sich dort die Schriftgröße in einem Absatz anpassen.
**Übersicht über die wichtigsten Blöcke:**
| Name | Funktion |
| ---------------------------- | --------------------------------------- |
| **Heading** | Verschiedene einheitliche Überschriften |
| **Absatz** | Textelemente einbinden |
| **Buttons** | Knöpfe zum Verlinken anderer Websites |
| **Bild** | einzelnes Bild |
| **Galerie** | mehrere Bilder mit Fester Spaltenanzahl |
| **Zitat** | Einbinden von Zitaten |
| **Pullqoute** | Einbinden von Zitaten |
| **#PublicClimateSchool2020** | Link zur PCS Website |
| **Cover** | Titelbild |
| **Calendar** | Terminkalender eurer OG |
| **Profile Image Generator** | Profilbildgenerator für Events |
### Titelbild einfügen
Oben auf eurer Homepage könnt ihr ein **großes Titelbild** einbauen. Dafür eignen sich besonders **Bilder von Klimastreiks** oder anderen Aktionen eurer OGs. [Hier ein Beispiel der OG Leipzig.](https://studentsforfuture.info/ortsgruppe/leipzig)
Dafür müsst ihr oben auf eurer Seite einen `Cover` Block einbauen. Wählt dann ein **Bild mit möglichst hoher Auflösung** aus. Anschließend könnt ihr innerhalb des Titelbilds weitere Blöcke einbauen, meistens bietet sich ein `Heading` an, also eine Überschrift.
Im Optionsmenü des `Cover`-Blocks könnt das Titelbild mit einer Farbe überlagern. Wählt dafür eine Farbe aus und ändert danach die `Deckkraft`, bis euch das Ergebnis gefällt. [Hier ein Beispiel auf der SFF-Startseite.](https://studentsforfuture.info)
### Terminkalender einbauen
Ihr könnt einen **Terminkalender** einbauen, **der alle Events anzeigt**, die für eure OG eingetragen wurden. Außerdem könnt ihr diesen auf eine Kategorie, wie die PCS beschränken. Erstellt dazu einen `Calendar`-Block.
Im Optionsmenü des Blocks könnt die **Ortsgruppe, und die Eventkategorie des Kalenders auswählen**. Es bietet sich an, eure eigene OG auszuwählen, um deren Events anzuzeigen.
Zusätzlich könnt ihr den **Zeitraum des Kalenders eingrenzen**. Für einen Studenplan zur PCS eignet sich beispielsweise der Zeitraum 25.05.-29.05.
### Profilbildgenerator einrichten
Ihr könnt auch einen **Profilbildgenerator** einbinden. Dafür benötigt ihr allerdings selbst einen **passenden Profilbildrahmen**. Dieser sollte im `.png` oder `.svg` Format sein und mindestens eine Auflösung von **800x800** **Pixeln** haben.
Erstellt dafür einen `Profile Image Generator`-Block. Anschließend müsst ihr einen passenden **Profilbildrahmen auswählen oder hochladen**. In der Medien-Galerie der Website ist bereits ein Rahmen für die PCS-2020 verfügbar.