4.5.7 Bilder- und Datei-Upload Alle Dateien (z.b. Bilder, PDF-Dateien, Flash-Animationen, etc.), die Sie auf Ihren Seiten einbinden möchten, laden Sie im Modulbereich Datei in den Modulen Dateiliste oder Bilder auf den Server. Wenn Sie Datei-Upload wählen, öffnet sich das folgende Fenster: Besonders in der Aufbauphase der Page kann es sinnvoll sein, 10 Dateien in einem Zug hoch zu laden. So kann man den Datentransfer verkürzen. Hier hochgeladene Dateien können Sie immer wieder verwenden und auch mehrfach in verschiedene Seiten einbinden (ein erneuter Upload ist nicht notwendig). Tipp: TYPO3 bietet auch die Möglichkeit an, Dateien in den einzelnen Inhalts elementen über die Schaltfläche Durchsuchen (Browse) direkt hochzuladen. Diese Möglichkeit sollten Sie aber nicht verwenden, denn auf diese Weise hochgeladene Dateien und Bilder wären dann nur innerhalb dieses einen Inhalts elementes verfügbar, Sie könnten sie dann nicht mehr weiter verwenden (z.b. in einer anderen Seite oder in der englischen Übersetzung dieser Seite). 4.5.8 Veränderung des Seiteninhalts/Editieren Um ein Seiteninhaltselement zu editieren, d. h. neu einzufügen oder zu verändern werden mehrere Symbole verwendet: Mit diesem Symbol fügt man einen neuen Seiteninhalt zur Seite hinzu. Durch einen Mausklick auf den Stift bzw. auf den Text kann man diesen editieren. Mit Hilfe dieses Icons kann man den Seiteninhalt auf einer Seite verschieben. Der Pfeil nach unten verschiebt ihn nach unten, der nach oben eine Stelle höher. Mit diesem Symbol kann man den Seiteninhalt verstecken. Durch einen Klick auf dieses Symbol wird der Seiteninhalt gelöscht. Version 3/2007 Seite: 21
4.5.9 Seiteninhaltselemente Einige wesentliche Seiteninhaltselemente wollen wir uns am Beispiel der Seite des OV Oberasbach veranschaulichen. Damit werden uns alle wesentlichen Werkzeuge zur Erstellung einer Homepage an die hand gegeben: 4.5.9.1 Seiteninhaltselement: Bild Die Seite, auf der die Bilder der Mitglieder des Vorstandes eines Ortsverbandes abgebildet werden sollen, hat ein Seiteninhaltselement des Typs Bild ( ). Soll der Seiteninhalt eine eigene Überschrift bekommen, kann man diese in im Eingabefeld ( ) einfügen. Welche Bilder auf der Seite benutzt werden finden sie mit einer Vorschau unter. Wenn alle Bilder eine einheitliche Breite oder Höhe haben sollen, kann man diese nach Aktivierung des jeweiligen Kästchen ( ) in Pixeln angeben. Die Bilder werden dann automatisch von Typo3 auf die richtige Größe sk aliert. zurückgreifen. Im Textfeld Bildtext ( ) kann man die Bilder beschriften. Für jedes Bild ist eine Zeile vorgesehen. Um dennoch einen Zeilenumbruch bei einem Bild zu generieren, muss man auf einfaches HTML (siehe Anlage) Damit die gemachten Änderungen auch auf der Homepage angezeigt werden, muss man diese abspeichern ( ).Mit dem ersten Symbol von links speichert man die Änderungen ab, bleibt aber in der Editierumgebung des Seiteninhaltselements. Das zweiten Symbol speichert ebenso ab und öffnet zusätzlich ein Browserfenster, in dem man sich die Seite des Seiteninhaltselements ansehen kann. Durch einen Klick auf das mittlere Symbol speichert man ab und verlässt die Editierumgebung des Seiteninhaltselement. Das zweite Symbol von rechts schließt lediglich die Editierumgebung und mit dem ganz rechts löscht man das Seiteninhalt s- element. Version 3/2007 Seite: 22
4.5.9.2 Seiteninhaltselement: Text mit Bild Auf den Seiten, die über die Arbeit in Stadtrat oder Verein berichten, stehen oft Artikel mit Bildern. Diese kann man bei Typo3 mit Hilfe des Seiteninhaltselement Text mit Bild einfügen. Möchte man vor bzw. hinter dem Seiteninhaltselement mehr Platz haben, so aktiviert man die Kästchen Vor oder Nach und fügt den Abstand in Pixeln ein, die vor oder nach dem Seiteninhaltselement sein soll. Wie bei jedem Typ von Seiteninhaltselement kann hier eine Überschrift eingegeben werden. In dem Textfeld wird der abzubildende Text eingefügt. Eine neue Zeile im Textfeld erzeugt eine neue Zeile im Artikel auf der Homepage. Möchte man einzelne Wörter formatieren (fett, kursiv,...), so kann dies am einfachsten mit dem Rich-Text-Editor erledigen oder verwendet HTML. Die Bilder werden genauso wie bei dem Seiteninhaltselement Bild hinzugefügt. Unter Position kann man die Anordnung von Text und Bildern einstellen. Entweder man klickt auf das entsprechende Icon oder wählt die gewünschte Einstellung im Drop- Down-Menü aus. Des weiteren kann man die Anzahl der Spalten einstellen, in denen die Bilder angezeigt werden sollen. Die Breite und Höhe der Bilder können ebenso wie bei dem Seiteninhaltselement Bild beschrieben eingestellt werden. Im Textfeld Bildtext kann man die Bilder auch beschriften. Für jedes Bild ist eine Zeile vorgesehen. Dabei entspricht die Reihenfolge der Textzeilen auch der der Bilder. Somit ist die erste Zeile im Textfeld die Bildunterschrift zum ersten Bild, die zweite Zeile gehört zum zweiten Bild, usw.. Möchte man auf einer Seite die Bilder nicht ausschließlich auf einer Seite anzeigen, so teilt man den Text auf und erstellt zwei Seiteninhaltselemente Text mit Bild. Bei diesen kann man dann die gewünschte Position der Bilder separat einstellen. Version 3/2007 Seite: 23
4.5.9.3 Seiteninhaltselement: Text Wenn eine Absatz ausschließlich aus Text besteht verwendet man das Seiteninhaltselement Text. Wie bei jedem Typ von Seiteninhaltselement kann hier eine Überschrift eingegeben werden. In dem Textfeld wird der abzubildende Text eingefügt. Eine neue Zeile im Textfeld erzeugt eine neue Zeile im Artikel auf der Homepage. Möchte man einzelne Wörter formatieren (fett, kursiv,...), so kann dies am einfachsten mit dem Rich-Text-Editor erledigen oder verwendet HTML. 4.5.9.4 Seiteninhaltselement: Punktliste Um eine Aufzählungsliste in den Text einzufügen, verwendet man das Punktliste. Da es verschiedene Arten von Aufzählungslisten gibt, bietet Typo3 vier Layouts, um Punktlisten anzuzeigen. Layout: Standard 1. 2. Layout 1 3. Layout 2 Layout 3 Für jede neue Zeile im Textfeld Text wird ein neuer Aufzählungspunkt erstellt. Mit HTML <br> kann man einen Zeilenumbruch ohne Aufzählungspunkt erzeugen. Zu html aber später mehr. Version 3/2007 Seite: 24
4.5.9.5 Seiteninhaltselement: Dateidownloads Man kann auch verschiedene Dokumente mit dem Seiteninhaltselement Dateilinks ( ) zum Download anbieten. Mit dem Typo3 Element Browser ( ) wählt man die Datei, die zum Download freigegeben werden soll, aus. Wenn man das Kästchen bei Zeige Dateigröße ( ) aktiviert, dann wird die Größe der zum Download freigegebenen Datei eingeblendet. Um eine Beschreibung zu der Datei hinzuzufügen, gibt man diese bei Beschreibungen ( ) ein. Auch hier gilt das gleiche wie bei den Bildern, für jede Datei eine Zeile im Textfeld. 4.5.9.6 Schrittanleitung zur Erstellung eines neuen Termins 1. Schritt Klicken Sie im Menü auf Seite, um den Seitenbaum zu öffnen. In diesem Seitenbaum finden Sie die Unterseite Termine. 2. Schritt Vor dem Titel Termine befindet sich ein kleines Symbol, das wie eine kleine Seite aussieht. Mit einem Klick mit der linken Maustaste öffnet sich ein Menü. In diesem wählen Sie nun Neu aus. Es öffnet sich der Assistent zum Erstellen eines neuen Datensatzes. Hier wählen Sie neuer Termin aus. Version 3/2007 Seite: 25
3. Schritt Nun öffnet sich untenstehendes Formular. In den ersten zwei Eingabefeldern geben Sie Datum und Uhrzeit ein. Wenn dieser Termin auch auf den Seiten des Kreisverband angezeigt werden soll, so muss das Häkchen bei Im Landes- /Kreisverband anzeigen gesetzt werden. Unter Titel können Sie eine Überschrift zu Ihrem Termin eingeben, diese wird auf der Webseite fettgedruckt dargestellt. Bei Bemerkung kann eine kurze Beschreibung zu dem Termin angegeben werden. Beim Verfassen des Textes werden Sie vom Rich Text Editor unterstützt. Wenn Sie bereits eine Seite erstellt haben, auf der nähere Informationen zu diesem Termin abgebildet sind, dann können Sie unter Link zur Seite auf diese Seite verweisen. Auf der Webseite wird unter dem Termin ein Link ([mehr]) hinzugefügt. Das Verfahren haben wir bereits kennen gelernt. Unter Allgemeinen Optionen können die Sichtbarkeitseinstellungen vorgenommen werden. Achten Sie bitte darauf, dass der Standard hier NICHT-sichtbar ist und das Häkchen unbedingt zu entfernen ist. Fertig Mit einem Klick auf das Speichernsymbol wird der Termin gespeichert. Auf der Webseite werden allerdings nur die Termine des aktuellen und der zwei folgenden Monate angezeigt. Einen Tag nach Ablauf des Termins wird dieser automatisch auf der Webseite ausgeblendet. Die Termine bleiben aber nach wie vor im System gespeichert und bearbeitbar. Version 3/2007 Seite: 26
4.5.9.7 Spezielle Seiten mit der Erweiterung Top Content Um unsere Website übersichtlicher zu gestalten, ist es sinnvoll, insbesondere im Nachrichtenbereich eine kurze Zusammenfassung der Meldungen zu präsentieren. Dies wollen wir nicht selber schreiben, sondern überlassen es dem Typo3. Dazu fügen wir auf der den Nachrichte übergeordneten Seite einen Seiteninhalt vom Typ Plugin einfügen ein (Schritt 1). Als Erweiterung müssen wir Top Content aus der Liste auswählen (Schritt 2). Schritt 1 Schritt 3 Schritt 2 Schritt 4 Version 3/2007 Seite: 27
Mit Hilfe dieses PlugIns werden sämtliche Unterseiten des Ausgangspunkts (Schritt 3) mit der bei Rekursiv eingestellten Tiefe (Schritt 4) durchsucht und die Kurztexte erstellt. Beim Auswählen des Ausgangspunkts verwenden wir den bekannten Typo3 Element Browser. Dieses PlugIn verwendet nun die ersten 300 Zeichen eines Seiteninhaltselements einer Seite, die sich unterhalb dieser Seite befindet und setzt einen Link auf den eigentlichen längeren Artikel. Daher sollte auf jeder Seite im ersten Absatz die wichtigste Information des Artikels stehen. TIPP: Auf allen Unterseiten ist bei jeden Seiteninhaltselement ein Feld TopContent: Zusammenfassung des Seiteninhalts vorhanden. Bei diesem kann man eine alternative Zusammenfassung angeben, die statt der ersten 300 Zeichen angezeigt wird. Bleibt das Feld leer, werden die ersten 300 Zeichen des Seiteninhalts verwendet. Es kann sinnvoll und notwendig sein, dieses Feld zu beschriften, wenn die Seite sehr bildlastig ist. Version 3/2007 Seite: 28
4.5.9.8.1 Emailkontakt (Seiteninhaltselement: Tabelle) Die Kontaktdaten eines Ortsverbandes werden in ein Seiteninhaltselement Tabelle eingefügt. Das Aussehen der Tabelle ist auch hier bereits vorbestimmt und im Layout 2 gespeichert. Um einen Abstand zwischen den einzelnen Zellen der Tabelle einzufügen, aktiviert man das Kästchen und schreibt den gewünschten Abstand in das Textfeld bei diesem Seiteninhaltselement 5. In dem Textfeld Text gibt man nun den Inhalt der Tabelle ein. Daten werden nach folgendem Schema eingegeben: Überschrift: Inhalt Beispiel: Stadträte: Karl Napf<br>Fred Feinbein Eine Möglichkeit der Anordnung der Kontaktadressen ist bereits im Entwurf der Seite Kontakt vorgegeben. Man muss lediglich noch die Inhalte füllen. E-Mail-Adressen werden wie folgt eingegeben: <link mailto:[e-mail-adresse]>[sichtbarer Text]</link> Beispiel: <link mailto:christoph.forman@web.de>christoph Forman</link> Version 3/2007 Seite: 29
4.5.9.8.2 Kontaktformular benutzen Eine weitere Möglichkeit einen Emailkontakt herzustellen stellt das Seiteninhaltselement Mail Formular dar, dessen Konfiguration wir uns anschauen wollen. Die Konfiguration starte nach Klick auf den Formularassistenten: Die genauen Einstellungen können Sie dem unten abgebildeten Formularassistenten entnehmen. Bei der Detaillierten Konfiguration sollten Sie ein wenig experimentieren, damit die für Ihre Seite richtige Formatierung gefunden wird. Version 3/2007 Seite: 30