forked from hacc/haccfiles
70 lines
4.6 KiB
Markdown
70 lines
4.6 KiB
Markdown
|
## 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.
|
||
|
|
|