Einführung und Tipps für die Gestaltung der Internet Seiten
Auf dieser Seite bekommen Sie eine kurze Einführung in die Funktionsweise des Wiki-Systems, das bei der Homepage der Vaihinger Kirchengemeinde eingesetzt wird.
Der Name Wiki kommt übrigens vom hawaiianischen Wort wikiwiki, was schnell bedeutet.
Organisation in Gruppen
Die ganze Internetseite ist in mehreren Gruppen organisiert. Derzeit gibt es folgende Gruppen:
- Aktuell
- Wegweiser
- Musik
- Kindergarten
- Jugendwerk
- Waldheim
- JungeErwachsene
- Senioren
- Internet
Die Gruppe einer Seite kann sehr einfach an der Adressleiste (oben) im Browser abgelesen werden. So hat z.B. diese Seite den Namen "Tipps" innerhalb der Gruppe "Internet" - die Adresse (mit Gruppe) ist damit "Internet/Tipps".
Pro Gruppe gibt es ein eigenes Passwort. Damit können Seiten dieser Gruppe verändert werden bzw. neue Seiten für die Gruppe erstellt werden.
Bearbeiten von Seiten
Eine Seite können Sie bearbeiten (verändern, erweitern...), in dem Sie die Seite in Ihrem Browser anzeigen lassen und dann oben auf den grauen Punkt "Bearbeiten" klicken. Sie werden dann nach einem Passwort gefragt, bitte geben Sie da das Passwort der Gruppe ein (wie oben erwähnt gibt es pro Gruppe ein eigenes Passwort).
Sie kommen dann auf eine Seite, in der sie die Seite beschreiben können, d.h. Sie können
in einem großen Eingabefenster "Code" für die Seite eingeben.
Das nachfolgende Bild zeigt das Aussehen der "Bearbeiten" Seite:

Für die Beschreibung der Seite gibt es einige einfache Regeln, die nachfolgend erklärt werden. Durch Klicken auf den "Vorschau" Knopf können Sie anschauen, ob die Seite so aussieht, wie Sie sich das vorgestellt haben. Falls Sie mit der Seite zufrieden sind, können Sie durch Klicken auf "Speichern" die Seite veröffentlichen. Ab diesem Zeitpunkt ist die Seite für alle Surfer in der geänderten Version zu sehen.
Bitte geben Sie noch im "Autor" Feld Ihren Namen oder Initialen ein, das ist besonders dann hilfreich, wenn mehrere Personen an einer Seite arbeiten.
Ausprobieren im "Sandkasten"
Es gibt eine Ausprobier-Seite (Sandkasten), in der Sie (ohne Passwort) das System testen können. Diese Seite wird automatisch nach 15 Minuten wieder gelöscht, so dass Sie hier keine dauerhaften Seiten erstellen können.
Grundregeln für die Bearbeitung der Seiten
Es gibt einige, sehr einfache Grundregeln, mit denen die Seite beschrieben werden kann. Nachfolgend kommen einige Beispiele. Der Text (=Code), den Sie auf der "Bearbeiten" Seite eingeben müssen, ist jeweils in blauer Schrift und grau hinterlegt. Das zugehörige "Ergebnis" erscheint auf dieser Seite in der Regel in einem grauen Kasten. Dieser graue Kasten erscheint im realen Fall natürlich nicht, er dient hier nur zur klaren Kennzeichnung der Beispiele.
Diese Seite beschreibt nur einige Regeln für die Bearbeitung der Seiten. Sehr hilfreich ist auch auf jeden Fall das Lesen der zum Wiki-System gehörenden Beschreibung der Grundregeln.
Auf der "Bearbeiten" Seite gibt es eine kurze Zusammenfassung der Grundregeln, zudem sind für viele Funktionen auch Symbole zum klicken vorhanden, so dass Sie die Befehlszeichen selbst gar nicht eingeben müssen.
Wichtig ist zunächst, dass Sie alle Zeilen ganz links (ohne Leerzeichen) beginnen.
Absätze
Ein neuer Absatz wird eingefügt, in dem Sie eine leere Zeile einfügen. Eine neue Zeile allein bewirkt noch keinen neuen Absatz. Falls Sie einen Zeilenumbruch wünschen, so müssen Sie zwei "Back-Slashes" \\ (bei PCs: AltGr+ß) ganz rechts in einer Zeile einfügen. (Achtung: Es dürfen nach \\ auch keine Leerzeichen mehr folgen!)
Beispiel. Der folgende Code zeigt die Verwendung von Absatz und Zeilenumbruch:
Hier kommt der erste Absatz. Hier kommt der zweite Absatz.\\ Hier gab es einen Zeilenumbruch.
So sieht die zugehörige Ausgabe aus:
Hier kommt der erste Absatz.
Hier kommt der zweite Absatz.
Hier gab es
einen Zeilenumbruch.
Überschriften
Um den Text zu strukturieren werden Überschriften verwendet. Dabei gibt es Seitenüberschriften, Unterüberschriften, Unter-Unterüberschriften usw.
Seitenüberschrift
Die Seitenüberschrift (Hauptüberschrift) sollte nur einmal,
ganz oben auf der Seite verwendet werden.
Sie wird durch die Eingabe von "!" (Ausrufezeichen) als erstes Zeichen einer Zeile
im Code angegeben. Die Wörter nach dem Ausrufezeichen bilden die Überschrift.
Diese Seite verwendet z.B. für die Seitenüberschrift die folgende Codezeile:
!Einführung und Tipps für die Gestaltung der Internet Seiten
Die Seitenüberschrift wird automatisch gelb hinterlegt.
Weitere Überschriften
Weitere Überschriften innerhalb der Seiten können durch die Eingabe von "!!", "!!!" oder "!!!!" als erste Zeichen einer Zeile im Code angegeben werden. Je mehr Ausrufezeichen angegeben werden, desto niedriger die Ordnung der Überschrift.
Eine größere Seite könnte man als z.B. wie folgt strukturieren:
!Titel meiner Testseite Einführungstext ... blablabla !!Erstes Thema Text zum Thema ... blablabla !!Zweites Thema !!!Unterthema A Text zum Unterthema A von Thema 2 !!!Unterthema B Text zum Unterthema B von Thema 2 !!Drittes Thema Text zum Thema 3 ... blablabla
Textformatierung
Manchmal ist es nützlich, einzelne Wörter besonders hervorzuheben. Dies kann z.B. durch Fettdruck oder durch eine kursive Darstellung erfolgen. Der hervorzuhebende Satzteil wird jeweils mit mehreren Apostrophen (PC: rechts neben "Ä") eingerahmt. Das Beispiel macht die Verwendung deutlich:
Das ist ''kursiver'' Text\\ Das ist '''fetter''' Text\\ Das ist '''''kursiver und fetter''''' Text
Das ist kursiver Text
Das ist fetter Text
Das ist kursiver und fetter Text
Bitte verwenden Sie für die Textstrukturierung die Überschriften und nicht die Verwendung von fettem Text!
Aufzählungen
Häufig werden Aufzählungslisten benötigt. Diese werden durch einen Stern "*" am Anfang der Zeile beschrieben. Eine hierarchische Aufzählung kann durch die Verwendung von mehreren Sternen erzeugt werden. Beispiel:
Folgendes gibt es noch zu tun: * Einladungen senden ** Mitarbeiter ** Teilnehmer\\ Insbesondere an die, die nur unregelmäßig erscheinen. * Programm vorbereiten.\\ Da ist noch sehr viel zu tun, da wir leider (wie immer) \ ein wenig spät dran sind...\\ Aber das wird schon noch klappen!
Folgendes gibt es noch zu tun:
- Einladungen senden
- Mitarbeiter
- Teilnehmer
Insbesondere an die, die nur unregelmäßig erscheinen.
- Programm vorbereiten.
Da ist noch sehr viel zu tun, da wir leider (wie immer)ein wenig spät dran sind...
Aber das wird schon noch klappen! - Sonstiges
Hier noch zwei Hinweise: Ein Zeilenumbruch innerhalb eines Aufzählungspunkts
kann man mittels eines \\ am Zeilenende erreichen.
Falls ein längerer Text nicht umgebrochen werden soll, es jedoch
unpraktisch ist, alles in eine Code-Zeile zu schreiben, so können die Code-Zeilen
durch einen einzelnes \ am Zeilenende verbunden werden.
Verweise (Links)
Was wäre das Internet ohne Verweise (Links)? Damit kann man einfach von einer Seite zu
einer anderen kommen.
Einen Verweis zu einer Seite innerhalb der selben Gruppe (siehe auch oben die
Erläuterung zu "Gruppe") kann man einfach durch
die Angabe von [[Andere Seite]] erreichen (Die Zeichen "[" bzw. "]" werden durch AltGr und "8" bzw "9"
eingegeben).
Einen Verweis zu einer Seite in einer anderen Gruppe wird durch die Angaben
von [[Andere Gruppe/Seite]] angegeben.
So zeigt das folgende Beispiel einen Verweis zum Lutherhaus (Gruppe: Wegweiser):
Die Veranstaltung findet im [[Wegweiser/Lutherhaus]] statt.
Die Veranstaltung findet im Lutherhaus statt.
Falls Sie einen anderen Text als den Seitennamen für den Verweis haben wollen, so können Sie diesen nach einem "|" (AltGr + Taste links von "Y") innerhalb der Rechteck-Klammern angeben:
Die Veranstaltung findet im [[Wegweiser/Lutherhaus|Vaihinger Gemeindehaus]] statt.
Die Veranstaltung findet im Vaihinger Gemeindehaus statt.
Seitennamen
Seiten können beliebige Namen aus Buchstaben und/oder Leerzeichen haben. Die Groß- bzw. Kleinschreibung ist wichtig! Details zu den Seitennamen können Sie dieser Seite der pmwiki Beschreibung entnehmen.
Verweise zu externen Seiten
Einen Verweis zu einer Seite auf einer anderen Internetseite kann einfach durch die Angabe der vollständigen Internet Adresse (die sogenannte URL) angegeben werden:
Die württembergische Landeskirche hat die Internetadresse http://www.elk-wue.de - surfen Sie doch mal hin!
Die württembergische Landeskirche hat die Internetadresse http://www.elk-wue.de - surfen Sie doch mal hin!
Mailadressen
Eine e-mail Adresse kann folgendermaßen eingegeben werden:
Bitte eine Mail an mailto:empfaenger@xxxxxx.yy
Bitte eine Mail an empfaenger@xxxxxx.yy senden
Neue Seiten erstellen
Eine neue Seite können Sie ganz einfach dadurch erzeugen, dass Sie in der Gruppe einen Verweis auf eine neue, noch nicht existierende Seite erzeugen. Diese Nicht Exisiterende Seite? wird dann im Browser mit einem "?" versehen, durch klicken auf dieses Fragezeichen kann die neue, noch nicht existierende Seite bearbeitet werden.
Auswahl-Menü auf der linken Seite bearbeiten
Die Bearbeitung des Gruppenmenüs auf der linken Seite funktioniert genau gleich wie das Bearbeiten einer "normalen" Seite. Sie müssen dazu lediglich auf den grauen "Menü"-Punkt oben auf der Seite (statt auf "Bearbeiten") klicken.
Ein Beispiel für eine Menüseite (aus der Gruppe Musik):
![[Musik]] !![[Termine]] !! [[Gruppen|'''Gruppen''']] * [[Kantorei]] * [[Kinderchor]] * [[Jugendkantorei]] * [[Posaunenchor]] * [[Gospelchor|Voices Vaihingen]] * [[Orchester]] !! [[Kontakt]] !! [[Freundeskreis]]
Bilder
Bilder sind eine gute Möglichkeit, die Seiten aufzulockern.
Jedoch ist immer zu bedenken,
dass Seiten mit großen oder vielen Bildern speziell von Surfern, die ein Modem nutzen, sehr langsam geladen werden und
daher mit Bedacht eingesetzt werden sollen.
Die Bilder sollten eine Größe von ca. 60kByte nicht überschreiten. Zu große Bilder werden
vom System abgewiesen.
Vorbereiten der Bilder/Fotos
Die Fotos, die mit einer Digitalkamera geschossen werden, sind fast immer viel zu groß für den
Einsatz im Internet. Die Bilder müssen also vor der "Veröffentlichung" verkleinert werden.
Dabei ist zu beachten, dass die Fotos am Bildschirm betrachtet werden, der ja nur eine
begrenzte Auflösung besitzt.
Eine brauchbare Größe für Fotos im Internet ist z.B. eine maximale Breite von 640 Punkten.
Die Verkleinerung erfolgt am einfachsten mit einem geeigneten Programm für den PC.
Für diese Anwendung gibt es massenhaft Programme (viele auch kostenlos).
Ein sehr gutes, für den nicht-kommerziellen Einsatz kostenloses Programm ist
"IrfanView" , das Sie unter der Adresse http://www.irfanview.de
aus dem Internet laden können.
Die Vorgehensweise zum Verkleinern von Bildern mit Irfan View ist die folgende:
- Das Original-Bild mit IrfanView öffnen
- Das Bild verkleinern (Im Menüpunkt "Bild/Größe ändern" eine geeignete Größe angeben)
- Das Bild per "Datei/Speichern unter" unter einem anderen Namen abspeichern (damit das Originalbild nicht verändert wird), dabei den richtigen Dateityp (typischerweise "JPG") auswählen.
Bei Bedarf können mit "IrfanView" auch Bildausschnitte gewählt, Farbkorrekturen durchgeführt werden usw.
Code zum Anzeigen von Bildern
Der Codebefehl Attach:bild.jpg stellt das Bild "bild.jpg" an der Stelle dar, an der
der Befehl im Text erscheint.
Das Bild muss nach Speichern der Seite noch hochgeladen werden, dieser Schritt wird weiter unten erläutert.
Beispiel:
Hier kommt Attach:bild_a.jpg und hier Attach:bild_b.jpg
Hier kommt
und hier
Wenn Sie ein Bild einer anderen Gruppe anzeigen wollen, dann können Sie Attach:Gruppe/bild.jpg eingeben.
Ein Bildtitel kann angegeben werden, in dem nach dem Bildname und einem "|" (Taste links von "Y" mit AltGr) noch der Titel angegeben wird. Für die Bild+Titelbeschreibung sollte dabei eine eigene Codezeile verwendet werden: Beispiel:
Das ist ein Buchstabe: Attach:bild_a.jpg|Buchstabe A Und weiter geht es mit B: Attach:bild_b.jpg|Buchstabe B
Das ist ein Buchstabe:

Buchstabe A
Und weiter geht es mit B:

Buchstabe B
Die Anordung der Bilder innerhalb des Texts ist dabei allerdings oft nicht sehr ansprechend. Daher sollte bei der Integration von Bilder in Text eher das nachfolgende Verfahren verwendet werden.
Bilder im Text
Sehr auflockernd sind Bilder, die in den Textfluss links oder rechts integriert werden.
Zu beachten ist dabei, dass die Bilder nicht zu breit werden.
Gut geeignet sind Bilder, die eine Breite von ca. 350 Punkten aufweisen.
Wenn die Bilder mit einem Rahmen versehen werden sollen,
in dem auch die Bildunterschrift enthalten ist, dann kann das z.B. im Wiki Code so beschrieben werden:
%rframe% Attach:meinbild.jpg|Buntes Bild!

Buntes Bild!
Für ein Bild auf der linken Seite ist statt "rframe" eben "lframe" einzugeben.
Bei allen Bildern ist es wichtig, das Aussehen der gesamten Seite bei verschiedenen Browser-Breiten zu überprüfen (mit der Maus einfach die Breite des Fensters enger oder weiter ziehen). Die Anordnung wird dabei vom Browser manchmal ziemlich durcheinander geschoben.
Hochladen der Bilder
Durch die Angabe der "Attach:" Anweisung und ein nachfolgendes Speichern der Seite erscheint in der Web-Seite ein Link mit einem Pfeil zum Hochladen des Bilds. Ein Klick auf den Pfeil öffnet eine neue Seite, das Bild kann auf der Festplatte ausgewählt werden (Durchsuchen Knopf) und schließlich auf die Internetseite geladen werden (Hochladen Knopf).
Die Bilder sind innerhalb der gesamten Gruppe nutzbar, d.h. sie können von mehreren Seiten aus über die "Attach:" Anweisung genutzt werden.
Achtung: Groß- / Kleinschreibung beachten!
Für das System ist das Bild "bild2" nicht identisch zu "Bild2"!
Am sichersten ist es, alle Bilder ausschließlich mit Kleinbuchstaben zu benennen.
Ersetzen/Austauschen hochgeladener Bilder
Um ein Bild der Internetseite durch ein anderes zu ersetzen, bitte auf den grauen Eintrag "Anhängen" ganz oben auf der Seite klicken.
Es erscheint wiederum die schon bekannte Seite zum Hochladen der Bilder. Im unteren Teil dieser Seite sind alle vorhandenen Bilder der Gruppe (nicht nur dieser Seite!) aufgelistet. Ein Klick auf den Pfeil neben einem Bildnamen wählt dieses Bild aus. Weiter geht es wie beim Hochladen eines neuen Bildes (siehe oben).
Bilder Gallerien
Es ist schön, schon kurz nach einer Veranstaltung Bilder der Veranstaltung auf die Internet-Seiten zu stellen.
Jedoch sollte man auch immer darauf achten, alte Bilder wieder zu entfernen.
Ideal ist es z.B. immer nur die jeweils letzte Veranstaltung in einer Gallerie zu halten.
Die "alten" Bilder werden dann einfach durch die "neuen" Bilder ersetzt, der Text leicht angepasst und
schon hat man ohne großen Aufwand alles auf dem aktuellen Stand.
Seitenabfolgen
Die einfachste Art eine Gallerie zu erstellen, ist die Verwendung der sogenannten Seitenabfolgen. Dabei ist ein einziges Bild auf jeder Seite zu sehen, unten auf der Seite erscheinen Navigationspfeile zum weiter- oder zurückblättern. Dabei kann man sich den Aufwand sparen, kleine Vorschaubilder (Thumbnails) erzeugen zu müssen. Jedoch müssen auch hier die Bilder im Vorfeld auf eine brauchbare Größe (maximal 600 Punkte breit) skaliert werden.
Ein Beispiel für eine Seitenabfolge kann man bei der Jugendkantorei anschauen. Der zugehörige Wiki-Code einer der Seiten (hier Juka 03) sieht dabei folgendermaßen aus:
! Jugendkantorei - David 2005 Attach:juka03.jpg|David und seine Freunde <<|[[Juka Rückblick]]|>>
Wichtig ist noch eine Übersichts-Seite ("Indexseite der Seitenabfolge"), in der alle Seiten der Seitenabfolge aufgelistet sind.
Beim Beispiel ist das die Seite "Juka Rückblick".
Auf diese Seite wird innerhalb der
<<|[[Juka Rückblick]]|>>
Anweisung verwiesen, sie
bestimmt auch die Namen und Reihenfolge der Abfolge.
Die "Juka Rückblick" Seite besteht aus folgendem Code:
! Jugendkantorei - Rückblick !! Bilder vom Musical David (2005) * [[Juka 01|David 1]] * [[Juka 02|David 2]] * [[Juka 03|David 3]] * [[Juka 04|David 4]] * [[Juka 05|David 5]] * [[Juka 06|David 6]]
Um eine Seitenabfolge leicht wiederverwenden zu können ist es empfehlenswert beim ersten Anlegen einer Bildergallerie die Bilder durchzunummerieren (z.B. hier juka01.jpg, juka02.jpg ...) und dann einen passenden Bildkommentar zu vergeben.

