Handbuch Einführung in TYPO3 HANDBUCH Berlin / Heidelberg, den 06.10.2010 Bedienung von TYPO3 4.3.3 für Redakteure Projekt: AHK Website-Tool Consulting Piezunka & Schamoni -Information Technologies GmbH Bergheimer Straße 102 69115 Heidelberg Tel 06221.187413.5 Ihr Ansprechpartner Sascha Böttcher Office Berlin Neue Promenade 5 Hackescher Markt 10178 Berlin Tel 030.2759537.1 E-Mail boettcher@cps-it.de 1
1. Einleitung..... 3 2. TYPO3 Grundelemente... 4 2.1 Login... 4 2.2 Die Oberfläche... 5 2.3 Die Modulleiste... 7 2.4 Die Navigationsleiste... 8 2.5 Die Detailansicht... 9 2.6 Die Module von TYPO3... 11 3. Das Arbeiten mit TYPO3... 15 3.1 Das Anlegen und Ändern von Seiten... 15 3.1.1 Das Anlegen einer neuen Seite... 17 3.1.2 Seite als Menüpunkt... 22 3.1.3 Das Löschen einer Seite... 23 3.1.4 Anlegen von Seiteninhaltselementen... 23 3.1.5 Unterscheidung zwischen Listen- und Seitenansicht... 30 3.1.6 Seiteninhalte bearbeiten... 32 3.2 Dateiverwaltung / Filelist... 34 3.2.1 Hochladen von Dateien... 34 3.2.2 Bilddateien... 36 3.2.3 Datei-Updates... 36 3.3 Der Rich Text Editor (RTE)... 37 3.3.1. Überblick... 37 3.3.2. Symbole und Funktionen im RTE... 38 3.3.3. Fragen und Antworten zum RTE und zur Bearbeitung von Links im RTE... 53 3.4 SeitenInhaltselemente verschieben / kopieren... 65 3.5 Cache löschen / Verlauf leeren... 68 4.Suchmaschinenoptimierung... 69 4.1 SEO Einmaleins... 69 4.2 Relevante Seitenbereiche... 72 4.3 Tipps und Hinweise... 73 4.4 Ergebnis... 73 2
1. Einleitung TYPO3 ist ein Content Management Systems (kurz CMS). Das Content Management System erlaubt die Bearbeitung von Inhalten einer Website ohne Programmierkenntnisse. TYPO3 Redakteure können mit Texten, Bildern, Zahlen, Dokumenten, Links oder Informationen in Bild und Ton arbeiten. Die Bearbeitung wird vollständig über einen Internetbrowser vorgenommen, die Verwaltung findet damit orts-, zeit- und medienunabhängig statt. Mit der Benutzer- und Rechteverwaltung wird der Zugriff auf Daten gesichert bzw. zugelassen und so eine effiziente Aufteilung der Bearbeitung der Inhalte einer Homepage organisiert. Die Benutzeroberfläche ist für mit dem Computerumgang gewohnte Mitarbeiter selbsterklärend und nach einer Einarbeitungszeit problemlos zu bewerkstelligen. Dieses Handbuch soll Redakteuren als eine Anleitung für die gebräuchlichsten Funktionen bei der Bearbeitung der Seite dienen. Inhaltlich ist das Handbuch in folgende Abschnitte gegliedert: Die Oberfläche und ihre Bereiche / Die Module von TYPO3 Das Arbeiten mit TYPO3 (z.b. das Arbeiten mit dem Texteditor ( RTE )) Suchmaschinenoptimierung Weitere Informationen finden Sie auch unter www.typo3.org. 3
2. TYPO3 Grundelemente 2.1 Login Um mit TYPO3 arbeiten zu können, müssen Sie sich zunächst bei dem System anmelden. Dazu benötigen Sie die korrekte Web-Adresse (URL), Ihren Benutzernamen (Username) und das dazugehörige Passwort. Diese Angaben erhalten Sie von Ihrem zuständigen Administrator bzw. vom CPS-IT Projektverantwortlichen. (1) Geben Sie in der Eingabezeile des Browsers Ihre Web-Adresse ein. Diese ist üblicherweise die Domain der Homepage und zusätzlich ein /typo3 (www.ihre-domain.de/typo3) >> vor Launch oftmals: projektname.cps-projects.de (2) Geben Sie in das Feld "Username" Ihren Benutzernamen ein. >> vor Launch oftmals: redakteur (3) Geben Sie im Feld "Password" Ihr Passwort ein. >> vor Launch oftmals: redakteur (4) Drücken Sie anschließend auf den Button "Log In". (5) WICHTIG: Cookies und JavaScript muss im Browser aktiviert sein bzw. davon unterstützt werden. 4
2.2 Die Oberfläche Nach dem erfolgreichen Login zeigt sich Redakteuren im Hauptbereich ein schematischer Überblick über TYPO3 und seinen Funktionen per Symbolen und Erklärungen. Redakteure finden also bereits hier weiterführende Informationen, auf die sie jederzeit zurückgreifen können. Die Arbeitsoberfläche von TYPO3 ist in drei Hauptbereiche unterteilt (siehe hierzu auch die Grafik mit den entsprechenden Nummerierungen der Arbeitsbereiche). 5
(1) Die TYPO3 Modulleiste - sie dient als oberste Ebene zur Auswahl des jeweiligen Moduls, in welchem Sie arbeiten. Sie erkennen Web, Datei, Benutzerwerkzeuge und Hilfe. Sie werden z.b. nach dem Einloggen von Ihrem persönlichen Arbeitsbereich begrüßt. >> Am häufigsten ist die Nutzung von "Web > Seite". (2) Die Navigationsleiste - bildet die Navigation für das gewählte Modul ab. In unserem Beispiel wird für das Modul "Web > Seite" die entsprechende Navigationsleiste angezeigt. Sie enthält den Seitenbaum, die er auch der Navigation auf der Webseite entspricht. Außerdem wird ein Filter angeboten, um ggf. schneller selektieren zu können. (3) Die Detailansicht - stellt den eigentlichen Arbeitsbereich für den Nutzer dar. Auf der Arbeitsoberfläche sind darüber hinaus immer präsent (oben): Logout - wenn sie eine Arbeitssitzung beenden möchten, melden Sie sich mit dem Button ab. TYPO3 speichert Ihre letzte Arbeitsposition und kehrt beim nächsten Einloggen an die Stelle zurück. Benutzer - es wird immer der aktuell angemeldete Benutzer angezeigt. Suchen es werden alle Verweise, Seiten, Seiteninhaltselemente oder Plugineinträge innerhalb der Präsenz angezeigt. Filter es werden nur die gefilterten Navigationselemente eingeblendet. 6
2.3 Die Modulleiste Die Modulleiste dient zur Auswahl des jeweiligen Arbeitsbereiches. In diesem Bereich werden nur die für den Redakteur notwendigen Befehle per Symbol und Bezeichnung angezeigt. In unserem Bespiel werden für den Modul-Bereich eines Standard-Redakteurs folgende Module angezeigt (siehe Grafik): Web Datei Benutzerwerkzeuge Fragebögen Direct Mail Hilfe Im Folgenden werden die wichtigsten Modulbereiche kurz vorgestellt: Die Funktionen unter Web Hier finden Sie die wichtigsten Module, welche die Inhalte sowie das Aussehen der Website definieren. Sie können Seiten anlegen, Inhaltselemente in der Seiten- oder Listenansicht eingeben und bearbeiten, sich die Seiten vor der Veröffentlichung in der Vorschau anzeigen lassen und globale Informationen zu den Seiten oder Inhaltselementen abrufen. Die Funktionen unter Datei Der Bereich liefert Ihnen die Übersicht über die hochgeladenen Dateien der Website. Bilder, Downloads, Movies, Sounds etc., welche auf der Seite mehrfach verwendet werden können, sind in einer übersichtlichen Dateistruktur hinterlegt. Neue Ressourcen können mit Massenoperationen bequem hochgeladen werden. Die Preview (Vorschau) von Bildern, sowie das Abrufen von Dateiinformationen erlaubt ein intuitives Handling. Redakteure sollten am unteren Rand einer Seite immer auf die Auswahlfelder achten, mit denen sie das Erscheinungsbild und die Funktionen der Benutzeroberfläche beeinflussen können. 7
Die Funktionen unter Benutzerwerkzeuge Die Module dienen der Fein-Einstellung Ihrer Benutzeroberfläche. Hier können Sie beispielsweise die Backend-Sprache in ihre favorisierte Sprache ändern (das Backend steht Ihnen in über 40 Sprachen zur Verfügung). Die Funktionen unter Hilfe Die Module geben Ihnen einen ersten Überblick über TYPO3, eine Online-Hilfe zu allgemeinen Themen sowie elf einführende Animationen, die sich jedoch auf die Ansicht des "Classic-Backend" beziehen. 2.4 Die Navigationsleiste Haben Sie ein Modul (z.b. Web") durch einen Klick auf das Symbol oder die Bezeichnung mit der linken Maustaste gewählt, steht Ihnen in der Navigationsleiste und das dazugehörige Menü zur Verfügung. Im Modul-Bereich "Web" ist es der Seitenbaum der Präsenz. Für das Modul "Dateiliste" (unter Datei ) ist es ein Baum von Ordnern, in denen Bilder, Downloads etc. voreingestellt und abgelegt sind. Redakteure können darauf zugreifen und neue Ordner anlegen, sodass ein individuelles und intuitives Arbeiten möglich ist. Da Redakteure am häufigsten das Modul "Web" verwenden, stellen wir hier exemplarisch den Seitenbaum der Navigationsleiste vor. Die Ansicht gibt die Struktur Ihrer Website wieder. Vom Baumstamm/Startseite ( AHK-Sandbox ) zweigen sich die einzelnen Ebenen ab. In unserem Beispiel wäre Stadt" die erste Ebene und (u.a.) Lage" die zweite und Fraktionen die dritte Ebene. Einzelne Ebenen können Sie einblenden oder ausblenden. Vor dem jeweiligen Seitentitel gibt ein Icon den Typ und den Status der Seite wieder. (3) Über dem Seitenbaum können Sie mittels Reload/Baumansicht aktualisieren die Ansicht jederzeit aktualisieren. 8
(2) Sie könnten auch mit dem Filter arbeiten und so nur die Seiten einblenden lassen, die im Seitentitel den Wortbestandteil haben, den sie im Filter eingegeben haben. Die gleichen Prinzipien der Navigationsführung gelten für den Ordner-Baum im Modul- Bereich "Datei". Übrigens, benötigen Redakteure im redaktionellen Hauptfenster, also in der Detailansicht mehr Platz, können Sie mit dem Pfeilsymbol (1) den Arbeitsplatz vergrößern. Diese Einstellung ist natürlich immer rückgängig zu machen. 2.5 Die Detailansicht Im Bereich der Detailansicht liegt das zentrale Arbeitsfeld von TYPO3. Hier werden die Informationen und Bearbeitungsmöglichkeiten für das von Ihnen ausgewählte Element (z.b. einer Seite) 9
abgebildet. Im Kopf der Detailansicht finden Sie verschiedene Informationen, die weitere Optionen einbzw. ausblenden. Je nach Zugangsrechten (4) finden Redakteure die Suche, die Cachefunktion und die Arbeitsumgebungsverwaltung. Hiermit könnten Redakteure entscheiden, ob live oder in einem gesicherten Status gearbeitet werden sollte. Live sind alle Änderungen oder Neueingaben sofort im Frontend im Internet zu sehen. (1) Im Kopf können Redakteure seitenbasiert typische TYPO3 Befehle ausführen. Wichtig: Sie können über auch Veränderungen Schritt für Schritt rückgängig machen. Diese Symbole sind je nach Navigationsniveau in TYPO3 immer wieder zu finden. Also im Seitenbaum. Auf einer Seite. Aber auch in einem Seiteninhaltselement. Dabei unterstützt das Spalten-pulldown Menue schnelles Surfen innerhalb einer Seite. Wird in der Listenansicht in einem Systemordner gearbeitet, können über das Feld Datensätze anzeigen in nur einer Seite alle Einträge aufgelistet werden. So müssen Redakteure nicht den Page-Browser verwenden und haben alle Einträge in einem Blick. (2) Hier können Sie die Seiteneigenschaften bearbeiten. (3) Ob alle Elemente angezeigt werden, entscheidet ein Häkchen an der richtigen Stelle. Manchmal ist es sinnvoll Inhaltselemente auszublenden. Redakteure können sie hier in der backend Variante der site trotzdem sehen und bearbeiten. (4) Wenn Daten geändert oder neue Seiteninhalte hinzugefügt wurden, empfehlen wir den Seitencache zu leeren. (5) Redakteure können über diese Felder schneller Ergebnisse erzielen. Sie können entweder nur auf der Seite oder sollte die Seite Unterseiten haben, auch auf Unterseiten suchen. Dazu einfach einen Suchbegriff eingeben, im pulldown menue die Auswahl treffen, wo gesucht werden soll und auf Suchen klicken. Alle relevanten Inhalte werden angezeigt. Im Hauptbereich wird der Inhalt der Seite angezeigt. Hier befindet sich die Möglichkeit, die einzelnen Inhaltselemente der Seite zu bearbeiten (jeweils Klick auf das Objekt oder das Stiftsymbol) oder neue Elemente hinzuzufügen. 10
2.6 Die Module von TYPO3 2.6.1 Überblick über die Modul-Bereiche Mittels der Auswahl der Module wählen Sie den Bereich, in welchem Sie arbeiten und die Aufgaben, die Sie durchführen wollen. Wir möchten einmal die einem Standard-Redakteur zur Verfügung stehenden Module und ihre Verwendung einzeln kurz vorstellen. TYPO3 selbst liefert Ihnen im Backend über das Modul Hilfe Kurzbeschreibungen zu jedem Thema. 2.6.2 Modul Web Hier finden Sie die wichtigsten Auswahlmöglichkeiten, die Inhalte und Aussehen der Website definieren. Sie können Seiten anlegen, Inhaltselemente eingeben und bearbeiten, sich die Seiten vor der Veröffentlichung in der Vorschau anzeigen lassen und globale Informationen zu den Seiten oder Inhaltselementen abrufen. Je nach Präsenz finden Redakteure hier auch Unterpunkte zu Powermail oder Questionnaire TYPO3 Module, mit denen Sie u.a. Formulare händeln oder Umfragen starten können. In solch einem Fall können Sie mit einem Klick auf ein Moduleintrag, wie Powermail oder Questionnaire, Informationen einsammeln, welche hinterlegten Formulare wann, von wem etc. ausgefüllt wurden. Sie können diese Daten auch exportieren und später mit z.b. XLS Programmen zur Datenanalyse weiterverarbeiten. Seite Mit dieser Ansicht können Sie neue Webseiten mit verschiedenen Inhaltselementen anlegen und bearbeiten. Mit Hilfe der Pulldown Option "Schnelleingabe" verfügen Sie über einen schnellen Zugriff auf den Hauptseiteninhalt. Anzeigen Die Ansicht ermöglicht Ihnen den Bearbeitungszustand einer Seite mittels der Vorschau zu betrachten und sogleich Veränderungen vorzunehmen ("Frontend-Editing"). Der Bleistift markiert hierbei die Inhaltselemente, welche Sie bearbeiten können. So ist garantiert, dass die jeweilige Seite auch korrekt dargestellt wird, sobald sie online geht. Liste Die Listenansicht gibt Ihnen den besten Überblick und Zugriff auf die einzelnen Datensätze einer Seite, die für den jeweiligen Benutzer zugänglich sind. Die Inhaltselemente werden ebenso übersichtlich untereinander aufgelistet wie Erweiterungen oder spezielle Templates für die Seite. Über die Listenansicht können Sie Inhaltselemente bearbeiten, die Reihenfolge der Inhalte leicht ändern, sie kopieren, verschieben oder sich den Änderungsverlauf eines Datensatzes anzeigen lassen. WICHTIG: Möchten Sie mehrere Inhaltselemente kopieren empfiehlt CPS-IT dringend die Listenansicht zum effektiven Arbeiten. 11
2.6.3 Modul Datei Der Bereich liefert Ihnen die Übersicht über die Ressourcen der Website. Bilder, Downloads, Movies, Sounds etc., welche auf der Site mehrfach verwendet werden können, sind in einer übersichtlichen Dateistruktur hinterlegt und können von Redakteuren erweitert werden. Neue Ressourcen können mit Massenoperationen bequem hochgeladen werden. Die Preview (Vorschau) von Bildern, sowie das Abrufen von Dateiinformationen erlaubt ein intuitives Handling. Dateiliste Die Dateiansicht im Modul Dateiliste stellt das Dateiverwaltungssystem von TYPO3 dar. Es erlaubt Ihnen den Zugriff auf die für Ihren Login gültigen Dateiordner. 12
Durch Klicken mit einer Maustaste auf das jeweilige Icon (1) steht Ihnen ein Kontextmenü zu Verfügung, mit dem Sie Ordner aber auch Dateien umbenennen, kopieren, ausschneiden, löschen oder sich weitere Informationen anzeigen lassen können. Mittels der Checkboxen (am unteren Rand) können Sie sich Thumbnails (kleine Vorschau) der Bilder oder das sog. Klemmbrett also die Zwischenablage, zum Einfügen, Kopieren oder Verschieben von Dateien, anzeigen lassen. 13
Nutzung der Zwischenablage 2.6.4 Modul Benutzerwerkzeuge Dieses Modul dient der Fein-Einstellung Ihrer Benutzeroberfläche. Einstellungen Mit dem Modul Einstellungen können Sie die Arbeitsumgebung nach Ihren Wünschen anpassen. So bietet TYPO3 Mehrsprachigkeit für Backend-Benutzer. Wählen Sie die Darstellungsform des backends entsprechend Ihren Vorlieben oder den Möglichkeiten Ihres Bildschirms. Sie können einstellen; ob Hilfetexte oder Thumbnails als Standard angezeigt werden sollen, ob Rekursives Kopieren bzw. Löschen erlaubt ist, wie viele Dateisätze im Dokumenten-Modul angezeigt werden und der Datei- Upload hier erlaubt ist. Legen Sie fest, ob der Rich Text Editor und das Kontextmenü aktiviert sind und welche Art von Hilfen bei der Eingabe angezeigt werden. Um die Sicherheit zu erhöhen können Sie sich per Email benachrichtigen lassen, wenn jemand sich mit Ihrem Account einloggt. 14
2.6.5 Modul Hilfe Über Module Dieses Modul bietet Ihnen eine Kurzbeschreibung über die Ihnen zur Verfügung stehenden Module. Die Auswahl entspricht der Ihres Benutzerprofils. Wenn Sie mit der Mouse über die einzelnen Buttons fahren, öffnen sich Kurzbeschreibungen zu den Modulen. 3. Das Arbeiten mit TYPO3 3.1 Das Anlegen und Ändern von Seiten Das Grundsätzliche vorab: In TYPO3 bildet eine Seite den Rahmen für eine Anfrage auf Ihrer Website. Sie liefert den Container für verschiedene Inhalte, die darauf abgebildet werden. Sie hat eine eigene ID- Nummer und in der Regel einen Titel, eine Beschreibung, verschiedene Metadaten für Suchmaschinen, ein bestimmtes Aussehen, welches durch ein ihr zugewiesenes Template bestimmt wird usw. Die Hierarchie (Struktur) der Seiten wird durch den Seitenbaum abgebildet und erzeugt in der Regel Seitennavigationsangaben (Links) auf Ihrer Website. TYPO3 hat verschiedene Seitentypen eingeführt und Ihnen damit das Arbeiten erleichtert. So besteht z.b. ein Unterschied darin, ob eine Seite im Menü angezeigt werden soll oder nicht bzw. nur im backend eingeblendet werden soll. Inhalte (Text, Bild, Tabellen...) werden auf den einzelnen Seiten abgebildet. Um komplexere Inhalte verschiedener Art innerhalb einer Seite abzubilden, gibt es sog. Erweiterungen (bzw. Spezialtypen) wie Foren, Shops, Kalendereinträge. Sie strukturieren den Inhalt jeweils gesondert, indem sie Sortierungen oder Gruppierungen auf einer Seite vorgeben. 15
TYPO3 liefert Ihnen eine kompakte Zusammenfassung aller wichtigen Informationen einer bestehenden Seite und lässt Sie so leicht den Überblick behalten. Den schnellsten Zugriff erhalten Sie über das Kontextmenü im Modul-Bereich "Web" in der Seiten- oder auch Listenansicht. Klicken Sie im Seitenbaum oder auch in der Detailansicht auf das jeweilige Icon hier und Sie erhalten das zugehörige Kontextmenü. Es bietet Ihnen verschiedene Aktionsmöglichkeiten an. So können Sie die Seite: Ansehen Die Seite wird in einem neuen Browser-Fenster zur Ansicht geöffnet. Bearbeiten - Ihnen wird die Seite inklusiv der Inhalte im Bearbeitungsmodus zurückgegeben, Neu - eine neue Seite oder ein neues Inhaltselement anlegen, Info - Informationen über die Seite abrufen, Kopieren - und damit die Seite mit samt dem Inhalt in die Zwischenablage (Klemmbrett) legen, Ausschneiden - und damit die Seite mit samt dem Inhalt in die Zwischenablage (Klemmbrett) legen Weitere Einstellungen ein neues Kontextmenü mit weiteren Einstellungsmöglichkeiten öffnet sich. Verbergen - d.h. die Seite offline stellen, damit ist sie in Ihrer Website nicht mehr sichtbar, Sichtbarkeitseinstellungen - für zeitgesteuertes Publizieren können Sie den Zeitraum festlegen in dem die Seite in Ihrem Auftritt sichtbar ist, Seiteneigenschaften bearbeiten - damit können Sie Metadaten wie Titel, Beschreibung, Keywords bearbeiten, jedoch auch den Zugriff, Cache etc steuern. Erstellungsverlauf / Rückgängig machen Mit dieser Funktion kann man ältere Versionen der Seite wieder herstellen, Je nach Redakteurs-Rechten können Sie auch: Einfügen in - fügt den Inhalt der Zwischenablage eine Ebene tiefer unter die gewählte Seite im Strukturbaum ein, Einfügen nach - fügt den Inhalt der Zwischenablage direkt nach der gewählten Seite im Strukturbaum ein, Löschen. 16
3.1.1 Das Anlegen einer neuen Seite TYPO3 macht Ihnen das Anlegen einer Seite denkbar einfach. Eine Möglichkeit besteht darin, auf das Icon vor dem betreffenden Seitentitel im Seitenbaum zu klicken und im Kontextmenü neu auszuwählen: Daraufhin öffnet sich dieses Menü. Hier sind die Wahlmöglichkeiten vielfältiger. Außer Seiten können auch Inhaltselemente angelegt werden. 17
Soll die Seite in der Baumstruktur eine Ebene tiefer als der Ausgangspunkt angelegt werden so wählen Sie "Seite (in)" Soll die Seite in der Baumstruktur auf derselben Ebene und direkt nach dem Ausgangspunkt angelegt werden so wählen Sie "Seite (nach)" Möchten Sie die Position der neuen Seite nochmals bestimmen, wählen Sie den Assistenten, den Sie mit "neue Seite anlegen" aufrufen können. Je nach beauftragter TYPO3 Komplexität erscheinen auch weitere Datensatztypen. Hier in unserem Beispiel sind dies News und Banner Management aus dem Newsmodul und dem Bannermodul sowie das Modul jobxchange. Weitere häufige Datensatztypen sind z.b. Veranstaltungen. Eine zweite Möglichkeit besteht darin, die entsprechende Seite, unter bzw. hinter der eine neue Seite erstellt werden soll, auszuwählen und auf das Symbol für neue Seite an- legen anzuklicken. Mit dem Klick auf das Symbol öffnet sich dieses Menü: Haben Sie die Position der Seite mittels der Pfeile bestimmt, erhalten Sie das Formular einer neuen Seite. 18
Daraufhin erscheint folgendes Webformular mit mehreren Reitern. Mit Allgemein definieren Sie die Seite. Die Option Seite verbergen ist zur Sicherheit gedacht, um eine Publikation von ungeprüften Inhalten zu verhindern. Diese Option müssen Sie deaktivieren, um die Seite letztendlich im Frontend als live im Internet anzeigen zu lassen. Im Gegensatz dazu Im Menü verbergen. Hier wird die Seite live gestellt, wird aber nicht in der Navigationsstruktur der site veröffentlicht. Die Seite kann nur über Verlinkungen erreicht werden. Unter Typ werden alle beauftragten Typen hinterlegt. Standard ist: Als nächsten Schritt geben Sie der Seite einen Titel Seitentitel". Er ist zwingend erforderlich und wird in der Regel als Menütitel in Ihrer Website also oben links in der Browserleiste angezeigt. TYPO3 weist mit dem Icon ist. darauf hin, dass die Seite ohne Eingabe nicht gesichert werden kann, da es ein Pflichtfeld 19
Wenn Sie Änderungen gespeichert haben, ist die neue Seite angelegt. Doch fehlen ihr noch einige wichtige Angaben, die wir im nächsten Schritt Seite bearbeiten" behandeln. Im Kopf befinden sich die Icons und ein Menü zum Umgang mit dem neuen Datensatz. Sie sehen den Pfad und verschiedene Speichertypen. (Ansicht wenn Sie ein Seiteninhaltselement bearbeiten) Möchten Sie die Eingaben sichern, wählen Sie Dokument sichern Dokument speichern und Webseite anzeigen Dokument speichern und schließen Dokument speichern und neues erstellen Darüber hinaus können Sie von hier aus auch Dokumente schließen ohne Änderungen zu speichern Dokumente entfernen (Je nach Redakteursrechten) Letzte Änderung zurücknehmen/ ausführen Metadaten ist der Dreh- und Angelpunkt für SEO Maßnahmen von Redakteuren. Im Kapitel SEO werden wir im Handbuch vertiefend darauf eingehen. Mit Hilfe der hier gemachten Angaben verbessern Sie die Suchergebnisse in Suchmaschinen wie Google. 20
Unter Ressourcen können Sie Bilder für den Header (Kopfzeile) einstellen. Das Kopfbild, welches auf der Homepage eingestellt ist, erscheint auf allen darunter angelegten Seiten, sofern kein abweichendes Kopfbild auf einer Seite eingestellt wurde. Für diesen Fall werden die Einstellungen also hier vorgenommen. Näheres zum Einfügen eines Kopfbildes finden Sie in unserem TYPO3- Handbuch zum Thema Einfügen von Kopfbildern. Sie bitte folgendes: die Reihenfolge der eingefügten Dateien ist: von oben nach unten = von links nach rechts in der Kopfzeile. Bei Optionen können Sie eine alternative Seite einblenden lassen ( Inhalt dieser Seite anzeigen ). Einfach nur rechts auf das Icon Datensätze durchblättern klicken und die entsprechende Seite eintragen. Die Spracheinstellungen spielen dann eine Rolle, wenn Sie mehrsprachige Seiten haben. Dazu finden Sie genauere Informationen in unserem TYPO3-Handbuch zum Thema Mehrsprachigkeit. 21
Mit Zugriff können Sie definieren, wann die Seite erscheinen soll. Sie können damit die Veröffentlichung datumsgenau begrenzen. Außerdem haben Sie die Möglichkeit, den Zugriff auf bestimmte Benutzergruppen einzuschränken. 3.1.2 Seite als Menüpunkt Beachten Sie: Mit dem Speichern erscheint die Seite, sofern Sie die Seite als nachgelagerte oder hierarchisch untergliederte Seite angelegt haben, sofort als Menüpunkt. Falls die Seite im Menübaum mit dem Symbol angezeigt wird, heißt es, dass die Seite noch als versteckt gekennzeichnet ist (siehe links: Handbuch Beispiel ). Sie wird also noch nicht im Internet angezeigt. Um die Seite sichtbar zu machen, einfach entweder die Checkbox entsprechend ausschalten und abspeichern oder über das Kontextmenü aktivieren. 22
Die Seite über das Kontextmenü wieder sichtbar machen. Redakteure können auch mit Klick auf den Seitentitel die Seite in der Detailansicht mit allen hinterlegten Inhaltselementen aufrufen oder mit Klick auf das Symbol das Kontextmenü aufrufen. 3.1.3 Das Löschen einer Seite Um eine Seite zu löschen, einfach im Kontextmenü auf Löschen klicken! Wenn der Menüpunkt im Kontextmenü nicht angezeigt wird, existieren Unterseiten in diesem Fall kann die Seite nicht gelöscht werden, bevor nicht alle Unterseiten gelöscht wurden. Oder der Redakteur hat keine Löschrechte für die Seite, denn Redakteure können per Standardeinstellung immer nur die eigenen also selbst angelegten Seiten löschen. 3.1.4 Anlegen von Seiteninhaltselementen Bisher haben wir uns nur im Seitenbaum aufgehalten und eine Seite angelegt. Nun möchten wir noch die Seite mit Inhalten befüllen. WICHTIG: Redakteure definieren in der Seite, also in den Seiteneigenschaften, das Verhalten auf der Seite und für Suchmaschinen. Sie definieren mit Seiteninhaltselementen das Aussehen und natürlich die Inhalte der Seite. Die schnellste Möglichkeit ist ein Klick auf den Titel der Seite im Seitenbaum in der Seitenansicht. Dann sehen Sie alle bisher angelegten Seiteninhaltselemente für jede Spalte bzw. Sprache im Überblick. In diesem Beispiel sind bisher zwei Inhaltselemente angelegt worden eines in der mittleren Spalte und eines in der rechten Spalte. 23
Sie finden den Seitentitel und die anderen schon bekannten Reiter in Seiteneigenschaften bearbeiten über den Inhaltselementen. Sie können auch den Bearbeitungsmodus über das jeweilige Kontextmenü öffnen. Klicken Sie, wie schon erwähnt, mit der Maus auf das jeweilige Seiten-Icon im Seitenbaum und wählen im Kontextmenü die Aktion Bearbeiten" erhalten Sie ebenfalls die Seiteneigenschaften. 24
Befinden Sie sich hingegen in der Listenansicht und haben die entsprechende Seite im Seitenbaum der Navigationsansicht gewählt, öffnen Sie die Angaben zur Seite ähnlich einer Tabelle. Die Inhaltselemente können schneller sortiert und beispielsweise leichter kopiert werden. Im Unterschied zur Seitenansicht sehen Sie hier außer den Inhaltselementen auch die Unterseiten aufgelistet. Beide Ansichten haben Vor- und Nachteile. Redakteure werden in der Arbeit mit TYPO3 die eigenen Vorlieben und die Stärken sowie Schwächen leicht erkennen. Möchten Sie z.b. die Seitentitel aller aufgeführten Unterseiten gleichzeitig bearbeiten, klicken Sie zunächst auf die Tabellenüberschrift Seite. 25
Daraufhin werden alle weiteren Tabellen in der Listenansicht ausgeblendet und im Tabellenkopf zwei Stift-Symbole eingeblendet. Für die gleichzeitige Bearbeitung aller Seitentitel klicken Sie auf das obere Stiftsymbol. Für die gleichzeitige Bearbeitung aller Felder aller aufgeführten Seiten klicken Sie auf den unteren Stift. Im Kopfteil der Ansicht stehen Ihnen weitere Angaben (u.a. Pfad der Seite) und weitere Funktionen zur Verfügung, die nur im Ausnahmefall benutzt werden müssen. Wichtig ist jedoch Cache leeren also Verlauf löschen. Immer wenn neue Seiteninhalte angelegt oder geändert worden sind, sollten Sie auf das Symbol klicken, um die Änderungen auch tatsächlich sichtbar zu machen. Je nach Browser könnte es vorkommen, dass Änderungen nicht sofort live sind und im Zwischenspeicher abgelegt werden. Cache leeren löscht diesen Zwischenspeicher. Sie erhalten als Standard hier in der Seitenansicht bei einer neu angelegten Seite ohne Inhalte folgende Übersicht: Redakteure sollten darauf achten, Verborgene Inhalte anzeigen auszuwählen. Anderenfalls werden sie auch im backend z.b. in der Listenansicht und generell im frontend nicht angezeigt. 26
Hier im Standardbeispiel können drei verschiedene Seitenbereiche gepflegt werden (v.l.n.r.): Linke Spalte, Mitte, Rechte Spalte. Die Ansicht variiert stark und hängt vom template also von der Beauftragung durch den Kunden ab. Klicken Sie auf Seiteninhalt anlegen, um Inhalte anzulegen. Sie erhalten daraufhin eine Auswahl an vorgegebenen Templates. Übrigens, hinter den Symbolen finden Sie immer mouse-over-effekte, die die hinterlegten Befehle erklären. Sie erhalten die Übersicht zu allen in der Präsenz deklinierten Inhaltselementen. 1. Typische Elemente wie Text und Bild 2. Spezielle Elemente wie Multimediaanwendungen 3. Formulare wie Mail- oder Anmeldeformulare 4. Plugins wie für PowerMail, Questionaire oder Banner 27
Sie können auch definieren, für welchen Seitenbereich das ausgewählte Element verwendet werden soll. Haben Sie das Element einfügen bereits in einem Seitenbereich gewählt, erscheint diese Positionsauswahl nicht. Bitte klicken Sie die gewünschte Auswahl an. Für unser Beispiel wählen wir den Typ Text m/medien. Es wird sich ein entsprechender Aufbau der Seite öffnen und Sie können die einzelnen Elemente mit Text/Bild ausfüllen (in den meisten Fällen werden die zwei erstgenannten Stile gewählt werden). Weitere Inhaltselemente umfassen Formulare, Nachrichten usw. auf die speziellen Inhaltselemente wird jeweils in den Kapiteln zu den einzelnen Plugins eingegangen. Vergeben Sie in der Registrierkarte Allgemein, wenn möglich, immer einen Titel für jedes Inhaltselement. Später kann sich der Redakteur besser in der Seite zurechtfinden, wenn jedes Inhaltselement über eine Überschrift verfügt. Insbesondere in der Listenansicht. Sollten Sie keine Überschrift auf der Seite wünschen, können Sie hier den Typ Verborgen auswählen. Geben Sie entsprechend eine Überschrift ein (sie wird automatisch je nach Kundenwunsch formatiert) und in der Registrierkarte Text im Rich Text Editor (RTE) entsprechend den Inhalt der Seite (siehe dazu das entsprechende Kapitel Rich Text Editor ). Formatierungen wie Ausrichtungen u.ä. funktionieren analog der bekannten Word Editoren. 28
Unter Medien legen Sie fest, welches Bild Sie wie verwenden. Sie importieren eine Bilddatei aus der Dateiliste oder durchsuchen wie in z.b. Windows Ihren Computer und laden direkt Medien auf die Seite. WICHTIG: Die Datei bleibt jedoch auf Ihrem Computer. CPS-IT empfiehlt Daten immer in TYPO3 Ordnern abzulegen, sodass auch andere Redakteure darauf zugreifen können. Sie arrangieren ein oder mehrere Bilder auf der Seite. Sie definieren unabhängig von der tatsächlichen Größe ein Bild. Wichtig: Die Bildmaße sollten nicht größer als die Originaldatei sein, da sonst ein Qualitätsverlust auftritt. Sie können Verlinkungen angeben. Sollten Browser keine Bilddateien unterstützen, können Sie hier alternative Varianten wählen und damit Ihren Auftritt auch barrierefrei gestalten. 29
Unter Zugriff können Sie schon wie bei der Seite erwähnt definieren, in welchem Zeitraum Inhalte veröffentlicht sein sollen. Sie können Anfangs- und Enddaten eingeben. 3.1.5 Unterscheidung zwischen Listen- und Seitenansicht Seitenansicht: Übersichtlich sehen Redakteure die Seiteninhaltselemente, den Typ und die Sichtbarkeitseinstellungen. Über die Symbole erfolgt schnell der Zugriff. Möchten Sie ein Element bearbeiten, klicken Sie einfach in den Text. Die Seitenaufteilung in links, Mitte, rechts ist leicht nachvollziehbar. Vorteil: Übersichtlichkeit Möchten Sie die Eigenschaften der Seite also beispielsweise den Titel der Seite oder die SEO Daten ändern, erreichen Sie sie über den Inhaltselementen. 30
Listenansicht: Funktionell können Redakteure Inhaltselemente kopieren, verschieben und weiterverarbeiten. Mit Klicks auf Zwischenablage eröffnen sich in der Listenansicht weitere Optionen. Zeilenweise können über Symbole die Inhaltselemente bearbeitet werden. Werden beispielsweise Elemente kopiert, stehen sie auch auf anderen Seiten in der Zwischenablage zur Verfügung und können schnell eingefügt werden. Vorteil: Funktionalität Im Standardmodus ist die Zwischenablage auf Normal eingestellt und es werden keine Checkboxen angezeigt. 31
Sobald Sie auf eine der Zwischenablagen Nr. 1, 2 oder 3 klicken (1), erscheinen Checkboxen (2), die ein einfaches Arbeiten mit der Zwischenablage ermöglichen. Hier können Sie auch alle Datensätze auf einmal markieren bzw. auf einmal alle Markierungen deaktivieren (3). 3.1.6 Seiteninhalte bearbeiten Je nach dem was TYPO3 Redakteure bearbeiten möchten, haben Sie bei bestehenden Seiten mit vorhandenen Seiteninhaltselementen die Möglichkeit in der Seitenansicht die Seiteneigenschaften zu bearbeiten. Also den Titel oder die Metadaten (1). die Bearbeitungsansicht zu allen Elementen dieser Spalte untereinander. Möchten sie hingegen ein spezielles Inhaltselement bearbeiten, klicken sie auf das Stiftsymbol (2) oder auf die Schaltfläche In Rich- Text-Editor bearbeiten (3). Je nach Browser wird man entweder direkt in den RTE oder auf den Reiter Allgemein weitergeleitet. Wenn Sie auf das Stiftsymbol in der Titelleiste einer Spalte klicken (4), erhalten Sie 32
(2) vs. (3) Nun können sie direkt neue Texte hinzufügen oder bestehende Texte ändern. Möchten Redakteure hingegen bestehende Bilder löschen und durch neue ersetzen, müssen sie auf den Reiter Medien klicken. CPS-IT empfiehlt eine vorhandene Datei zu löschen, bevor eine neue Bilddatei eingefügt wird. Markieren Sie dazu den Dateinamen mit einem Klick (1) und löschen Sie sie mit erneutem Klick (2). Danach können Sie eine neue Bilddatei hinzufügen (3). 33
3.2 Dateiverwaltung / Filelist Um effektiv mit mehreren Redakteuren im CMS zu arbeiten, sollten Dateien wie Bilder oder pdfs immer in Ordnern im System abgelegt werden. Zur Dateiliste gelangen Sie, wenn Sie in der Modulleiste auf das entsprechende Feld klicken. 3.2.1 Hochladen von Dateien 1. Klicken Sie in der TYPO3 Modulleiste auf Dateiliste. 2. Wählen Sie einen Ordner aus oder erstellen Sie einen neuen, in den die hochzuladenden Dateien hineinkopiert werden sollen, in dem Sie das Ordnersymbol mit der linken Maustaste anklicken. 34
3. Wählen Sie im erscheinenden Menü Dateien hochladen 4. Nun können Sie auswählen, welche Dateien Sie hoch laden wollen 5. Ein einfacher Klick auf den Ordnernamen zeigt Ihnen den Inhalt des Ordners 35
6. Ein Klick auf das Dateisymbol, hier das JPG-Symbol und Sie erhalten folgendes Menü. Hier können Sie die Datei z.b. löschen, kopieren oder umbenennen. WICHTIG: Information zur Umbenennung von Ordnern oder Verschiebung von Dateien Umbenennung von ORDNER oder DATEI oder der UMZUG von DATEIEN in andere ORDNER führt dazu, dass verlinkte Dateien (typischerweise PDFs, Dokumente) nicht mehr über das Frontend aufgerufen werden können, bevor der Redakteur den Link nicht neu gesetzt hat. TYPO3 ist derzeit nicht in der Lage, entsprechende Verlinkungen automatisch anzupassen. >> Ausnahme: Für Bilder gilt dies typischerweise nicht, wenn sie über Text mit Bild als Media-Objekt eingebunden werden. 3.2.2 Bilddateien WICHTIG: Information zur Farbskala von Bilddateien Damit Bilder einwandfrei im Web angezeigt werden können, sollten diese NICHT im sog. CMYK- Modus abgespeichert werden. Hierbei sind besonders beim Internet Explorer 8 Probleme aufgetreten, wir raten aber generell davon ab. Der CMYK-Modus eignet sich für Printmedien, aber nicht für den Webauftritt. Für die Darstellung von Bildern im Web wird üblicherweise die Farbskala RGB verwendet. Die Umwandlung können Sie in üblichen Bildbearbeitungsprogrammen vornehmen. 3.2.3 Datei-Updates Wenn Sie eine ältere Datei mit einer aktuelleren Datei mit gleichem Dateinamen überschreiben wollen, können Sie dies mittels folgender Funktion tun: Sie sparen damit den Schritt, die ältere Datei vorher zu löschen. Aktivieren Sie beim Hochladen die Funktion Vorhandene Dateien überschreiben. Die Datei wird überall, wo sie verlinkt ist, automatisch aktualisiert. 36
3.3 Der Rich Text Editor (RTE) Der RICH TEXT EDITOR (im Folgenden RTE ) ist das Herzstück für die Texteingabe in TYPO3. Sie finden den RTE in den Einstellungen eines Seiteninhaltselementes unter dem Reiter Text. 3.3.1. Überblick Für die Inhaltstypen Text" und Text mit Bild" steht Ihnen in TYPO3 ein einfach zu handhabender Editor zu Verfügung. Er erlaubt es Ihnen, Formatierungen und Auszeichnungen an den Texten vorzunehmen und Bilder, Tabellen oder Links einzufügen. Beachten Sie jedoch, dass dabei die Formatvorgaben etc. mittels HTML-Auszeichnungen direkt in den Texten hinterlegt werden und somit die bei allen Inhaltstypen bestehende Trennung von Inhalt und Layout aufgehoben wird, d.h., dass ursprüngliche Formatierungen von eingefügten Inhalten nur zum Teil wiedergegeben werden (z.b. Schriftformatierung Bold/Fett) und stattdessen nur die voreingestellte Formatierung angezeigt wird. Der RTE" kann umfangreich für die entsprechenden Nutzerprofile konfiguriert und auch deaktiviert werden. Steht er Ihnen für Ihr Profil zu Verfügung, können Sie ihn zum einen generell in Ihren Benutzer- Einstellungen oder dem jeweiligen Bearbeitungsmodus aktivieren bzw. deaktivieren. Einmal deaktiviert können Sie mit TYPO3 wie mit einem html Editor arbeiten. Individuell können Sie den RTE" auch für einzelne Inhaltselemente deaktivieren. Dies kann evtl. bei der Beseitigung überflüssigen HTML-Codes hilfreich sein. CPS-IT hinterlegt im CMS einen Standard-RTE. 37
Bei der Eingabe von Text verhält sich der RTE bzgl. des Zeilenabstandes so, dass wenn man in der Tastatur auf Return drückt, er einen neuen Absatz beginnt. Dieser ist mit etwas größerem Zeilenabstand zur nächsten Zeile verbunden. Wenn man lediglich eine neue Zeile beginnen will und den normalen Zeilenabstand wünscht, dann drückt man für die neue Zeile Shift+Return (d.h. man hält die Shift-/Umschalt-Taste gedrückt beim Return/Enter-Drücken). 3.3.2. Symbole und Funktionen im RTE Die Bedeutung der Symbole sollte aus dem Umgang mit Windows und Word vertraut sein. Deshalb wird hier nur eine Auswahl der Funktionen aufgeführt: Block Style: Ausrichtung links- oder rechtsbündig, zentriert oder Blocksatz, blauer Fließtext Die Dropdown-Liste Text style ist deaktiviert, weil nichts ausgewählt ist. Nachdem Sie Text ausgewählt haben, können Sie die Formatierung zu blauem Fließtext ändern. Übliche Schriftformatierungsfunktionen (fett, kursiv, tief- und hochgestellt, unterstreichen) 38
Fügt Absätze ein ( Paragraph ), formatiert Text als Überschrift ( Heading 3 ) oder entfernt den Blocksatz ( remove block format ) Textausrichtung Nummerierung und Aufzählungszeichen: Möchten Sie eine Aufzählung/Nummerierung einfügen, markieren Sie die gewünschten Absätze und klicken das Icon. Die Absätze werden durchgehend nummeriert. Sonderzeichen einfügen Trennlinie einfügen: Beispiel siehe Grafik unten 39
Links einfügen/anpassen "Link einfügen": Um einen Link auf eine Seite oder ein Inhaltselement einzufügen, markieren Sie den entsprechenden Text und klicken auf das Symbol. Es öffnet sich der "RTE Link Browser". Wählen Sie im neuen Fenster zwischen "page" (interne Seite), "File" (z.b. PDF-Dokumente), "External URL" oder "Email". Page Bei Page können Sie noch unterscheiden, ob Sie auf eine interne Seite (1) oder nur in einer internen Seite auf ein Seiteninhaltselement also einen Anker (2) verlinken möchten. File Wenn Sie den Reiter File wählen, werden Ordnerbaum und die im ausgewählten Ordner enthaltenen Dateien wie z.b. pdf- Dateien angezeigt. Klicken Sie auf die gewünschte Datei. 40
External URL Geben Sie hier (1) die URL an, auf die der User weitergeleitet werden soll. Klicken Sie danach auf Set Link. (2) Wenn Sie zu einem späteren Zeitpunkt Änderungen an den Einstellungen vornehmen, klicken Sie anschließend auf Update (3), so dass die Änderungen übernommen werden. Email Link zu einer Email-Adresse herstellen: (Wenn der User auf den Link klickt, öffnet sich automatisch ein neues Email- Fenster in Outlook und fügt die Adresse ein) Geben Sie eine Email- Adresse an. 41
Entfernung der Verlinkung Um den Link zu entfernen, markieren Sie diesen und klicken anschließend auf das Link-Icon. Ein Doppelklick auf das Wort/die Wortgruppe erleichtert die Markierung. Jetzt gibt es im RTE Link Browser den neuen Reiter Remove link. Beim eimaligen Klicken auf den Reiter ist die Verknüpfung wieder gelöscht. Wir haben diese Möglichkeiten beispielhaft für Sie unter http://sandbox.ahk.de/seiteninhalte/normalertext/ angelegt. 42
Einstellungen zur Verlinkung Darstellungsart einer verlinkten Seite im Browser Hier können Sie angeben, dass die verlinkte Seite in demselben oder einem neuen Fenster geöffnet wird. Soll die verlinkte Seite in einem neuen Browserfenster geöffnet werden? Dann geben Sie bei Open in window Breite und Höhe (px) des sich neu zu öffnenden Browserfensters an. Auf diese Weise ist gewährleistet, dass sich trotz unterschiedlicher Browsereinstellungen bezüglich Tabs/windows der Link in einem neuen Fenster statt neuen Tab öffnet. Wenn Sie unter Target New Window wählen, wird der Link je nach Browsereinstellungen in einem neuen Fenster (= z.b. Standardeinstellung bei Firefox) oder in einem neuen Tab geöffnet. 43
Soll die verlinkte Seite in demselben Browserfenster geöffnet werden? Dann wählen Sie unter Target Top aus. Wenn Sie zu einem späteren Zeitpunkt Ihre Einstellungen im RTE-Browser ändern sollten, klicken Sie anschließend auf den Button Update. Titel Der Titel, den Sie hier eingeben, fungiert als Tooltip 1. Wenn der User den Cursor über den Link bewegt, wird dieser Titel angezeigt. 1 Tooltips werden häufig zur Erklärung der Funktion von Schaltflächen in der Symbolleiste verwendet, in Webbrowsern auch zur Kurzbeschreibung von Fotos oder des Linkziels von Links. Der Tooltip erscheint, wenn der Benutzer den Mauszeiger eine gewisse Zeit ruhig über dem entsprechenden Objekt schweben lässt, und verschwindet automatisch, sobald der Benutzer die Schaltfläche bzw. den Link anklickt oder die Maus wegbewegt. [Wikipedia: http://de.wikipedia.org/wiki/tooltip] 44
Link-Symbole Folgende drei Symbole/Icons können momentan im Rich Text Editor (RTE) vor einem Link eingefügt werden. Es gibt je ein Symbol für Links zu Email-Adressen, zum Datei-Download und zu externen Internetseiten, aber kein Symbol für Verknüpfungen zu internen Seiten. Wo Sie diese Symbole einfügen bzw. wieder löschen können, zeigen wir Ihnen hier: Fall 1: Symbol für den Datei-Download Wählen Sie im RTE-Browser unter dem Reiter File unter dem Punkt Style die Option download-icon aus. Wenn Sie das Symbol nicht mehr wünschen, wählen Sie stattdessen die oberste, leere Zeile der Drop-down-Liste aus. Das Symbol ist danach sofort im RTE gelöscht und nach dem Abspeichern im Backend ist das Symbol auf der Webseite ebenfalls verschwunden. 45
Das Löschen des Symbols funktioniert analog genauso für externe Links und Email-Links. Fall 2: Symbol für Email-Link Wählen Sie im RTE-Browser unter dem Reiter Email unter dem Punkt Style die Option mailicon aus. Wenn Sie das Symbol nicht mehr wünschen, wählen Sie stattdessen die oberste, leere Zeile der Drop-down-Liste aus. Fall 3: Symbol für einen externen Link Wählen Sie im RTE-Browser unter dem Reiter Email unter dem Punkt Style die Option external-link-icon aus. Wenn Sie das Symbol nicht mehr wünschen, wählen Sie stattdessen die oberste, leere Zeile der Drop-down- Liste aus. 46
Link-Symbole vor unterschiedlichem Hintergrund Link-Symbole können nicht nur vor weißem Hintergrund, sondern auch vor andersfarbigem Hintergrund wie bei der Infobox eingesetzt werden. Die Einstellungen für beide Fälle sind gleich. Hier ein kurzer Exkurs, wie Sie das Design einer Infobox einstellen können: Wählen Sie bei Einstellungen des Inhaltselementes unter Rahmen Infobox aus. Wir haben alle Möglichkeiten zu Verlinkungen und Linksymbolen beispielhaft für Sie unter http://sandbox.ahk.de/seiteninhalte/normaler-text/ angelegt. 47
Broken Links defekte Verlinkungen Ausgangspunkt: Über den RTE wird aus dem Inhaltselement (1) auf eine interne Seite verlinkt (2). Änderung: Wenn diese interne Seite, auf die verlinkt wird, gelöscht wird, dann passiert folgendes: a) der Link ist im Frontend automatisch nicht mehr aktiv 48
b) der Link wird im Backend beim erneuten Öffnen des Datensatzes gelb/rot markiert >> sodass der Redakteur darauf reagieren kann Möglichkeit I: Der Redakteur entfernt den gesamten Link und setzt ihn neu. Möglichkeit II: Der Redakteur speichert das Inhaltselement trotzdem ohne Änderung ab >> dann wird die gelb/rote Markierung auch im FE zu sehen sein Dieses Feature funktioniert nur bei Verlinkungen auf interne Seiten. 49
Bilder einfügen/anpassen Bilder einfügen/anpassen: Sobald Sie auf das Symbol klicken, öffnet sich folgendes Fenster: Hier können Sie zwischen drei Optionen wählen: New Magic Image New Plain Image Drag n Drop Der direkte Weg geht über Drag n Drop, in dem Sie das Bild mit der Maus anklicken und in den RTE rüberziehen. Im Beispiel unten wurde auf diese Weise eine jpg-datei eingefügt. Über drag n drop können Sie auch dann ein Bild einfügen, wenn der Datensatz vom Typ Text ist. Wenn Sie die Position des Bildes zum Text ändern möchten, ist dafür die Medien-Funktion eines Datensatzes vom Typ Text mit Bild anstelle des direkten Einfügens in den RTE besser geeignet. 50
Tabelle einfügen/anpassen "Tabelle einfügen": Um eine einfach strukturierte Tabelle einzufügen, steht ein Assistent zu Verfügung, den Sie durch das Symbol aufrufen können. Sie bestimmen so die Anzahl der Reihen und Spalten, den Zellen- und Inhaltsabstand, die Stärke der Rahmen und die Hintergrundfarbe und geben anschließend die Inhalte ein. Geben Sie hier die Zahl der Zeilen und Spalten an (1). Stellen Sie hier die Ausrichtung des Textes ein (2). Wenn Sie hier (3) unter Frames und Rules, Rahmen und Gitterlinien anzeigen lassen, werden Zeilen und Spalten der Tabelle im RTE gleich sichtbar. (siehe Grafik unten) Falls Hintergrundfarben eingerichtet sind, können diese hier eingestellt werden (4). Mit den Einstellungen aus der Beispielgrafik oben, erhalten Sie diese leere Tabelle mit 4 Spalten und zwei Reihen. Wenn Sie die Tabelle mit der Mouse auseinander ziehen, erhalten Sie genug Platz um Werte eintragen zu können. 51
Mit einem Klick auf die horizontalen oder vertikalen Pfeile erweitern Sie die Tabelle im Handumdrehen um neue Zeilen oder Spalten (bzw. löschen diese mit Klick auf das mittlere Element zwischen den Pfeilen). Falls Sie eine Tabelle eingebaut haben, stehen Ihnen einige weitere Symbole zur Tabellenbearbeitung zur Verfügung: Mit Hilfe der weiteren Tabellen-Symbole können Sie verschiedene Veränderungen an der Tabelle vornehmen (neue Zeile, neue Spalte, Verschiebungen usw.) fahren Sie einfach mit der Maus über das entsprechende Symbol und lassen Sie sich die Funktion anzeigen. Suchen und Ersetzen von Wörtern 52
HTML-Modus 3.3.3. Fragen und Antworten zum RTE und zur Bearbeitung von Links im RTE 1. Beschädigte Links sind im Backend im RTE nicht sichtbar Problem: Der Link ist in seiner ursprünglichen Form nicht mehr vorhanden: Obwohl ich im Backend im RTE keinen verlinkten Text sehe, ist im Frontend doch ein Link vorhanden, in Form der verlinkten Internetadresse (siehe unten). 53
So soll es sein: Dies ist ein Beispiel für einen unversehrten Link. Klickt man im Frontend auf den Link, gelangt man in diesem Beispiel zu einer externen Webseite. Im Backend sieht man im RTE auch den Link, wie hier im Beispiel. Nützlichkeit des HTML-Modus: Wenn Sie den HTML-Modus einschalten, erkennen Sie den Link daran, dass er zwischen zwei <a>- (Anker-)Tags eingeschlossen ist (in unserem Beispiel gelb/rot unterstrichen). Rot unterstrichen ist der Text, den Sie im RTE eingegeben und verlinkt haben. Eine kurze Einführung zum Thema <a>-tag erhalten Sie im Exkurs weiter unten. 54
Zurück zu unserem Problemfall: Ursache: Wenn wir den HTML-Modus einschalten, sehen wir, dass an der Stelle Text fehlt, an der Text für den Link stehen müsste. Sobald hier kein Text eingefügt wird, zeigt das System die verlinkte URL an, also in unserem Beispiel http://www.cps-it.de/. Problemlösung: Wenn Sie keine Verlinkung mehr wünschen, löschen Sie im HTML-Modus den gesamten <a>-tag (alles Gelb unterstrichene in unserem Beispiel). Wenn Sie statt der URL verlinkten Text wünschen, fügen Sie diesen im HTML-Modus (an der rot markierten Stelle analog zu unserem Beispiel) wieder ein. Oder löschen Sie zuerst im HTML-Modus den gesamten <a>-tag und setzen den Link im normalen Modus wieder neu. Weitere mögliche Fehler, die auftreten können: Problem: Leerzeichen sind verlinkt. Der Link ist aktiv, aber kaum zu sehen. Das können zum Beispiel Überbleibsel einer Löschaktion sein. 55
In der HTML- Ansicht sehen Sie deutlich, dass der Link dennoch besteht. Ein geschütztes Leerzeichen ( nonbreaking space ) ist hier im HTML- Quelltext als   ausgegeben. Problemlösung: Siehe oben Exkurs Es folgt ein kurzer Exkurs für HTML-Fremde zum Begriff tag : Links sind einige Beispiele für HTML-Tags aufgeführt. HTML-Tags sorgen für Struktur. Zum Beispiel: Was zwischen <h1> und </h1> gesetzt wird, erzeugt einen Zeilenumbruch und wird zu einer großen fetten Überschrift, was zwischen <p> und </p> steht, wird zum Textabsatz mit Zeilenumbruch, <strong>fett</strong> erzeugt fett gesetzten Text ohne Zeilenumbruch, <em>kursiv</kursiv> erzeugt kursiv gestellten Text ohne Zeilenumbruch. 2 <h1>lorem ipsum </h1> <p>lorem ipsum dolor sit amet, consectetuer adipiscing elit. </p> <p>mauris ante neque, vehicula quis, convallis sit amet, vestibulum ornare, arcu. </p> <p>donec at lorem et elit congue dictum. Cras sapien ligula, rutrum quis, posuere id, faucibus id, risus. Maecenas sed est volutpat arcu 2 Quelle: http://www.mediaevent.de/tutorial/index.html 56
adipiscing tempus. Sed dictum mauris euismod mauris.</p> Das <a>-tag auch als Anker-Tag (eng. anchor) bezeichnet wird für gewöhnlich zusammen mit dem href-attribut benutzt, um einen Hyperlink, kurz auch als Link bezeichnet, zu erzeugen. Durch einen einfachen Klick mit einer Maus oder durch einen Tastaturbefehl kann der Besucher von einer Seite auf eine andere Seite wechseln oder auch innerhalb der Seite zu einem Sprungziel navigieren. Per Vorgabe wird die neue Seite im selben Browserfenster oder Frame dargestellt, es sei denn, das Attribut target bestimmt eine andere Variante. 2. Tabelle ist breiter als die Content-Spalte Spaltenbreite einer Tabelle im RTE anpassen Problem: Eine Tabelle in der Contentspalte ist zu groß und reicht bis in die rechte Spalte. Problemlösung #1 Dann ist die einfachste Lösung in den Seiteneigenschaften aus dem dreispaltigen Layout ein zweispaltiges zu machen. 57
Problemlösung #2 Wenn Sie die Spaltigkeit der Seite nicht ändern möchten, gibt es eine Alternative: Letztlich besteht das Problem oft darin, dass die Formatierung der Tabellenbreite die Ursache ist. Wenn keine maximale Tabellenbreite angegeben ist, passt sich diese automatisch der Breite der Contentspalte auf der Seite an. Wenn also eine Breite für die Tabelle im Quelltext zu finden ist, diese rauslöschen. Bsp. Die Formatierungen hinter table (=Tabelle) suchen, width steht für die Breite der Tabelle, und dann wie im Beispiel den markierten Bestandteil rauslöschen. Je nachdem, wie die Tabelle formatiert ist, kann das mit nur einer Löschaktion verbunden oder sehr aufwändig sein. 58
3. Zeilenabstand korrigieren Problem: Der Zeilenabstand vom unteren der beiden Absätze soll an den Standard-Zeilenabstand des oberen Absatzes angepasst werden. Problemlösung: Auch für den Zeilenabstand ist eine Standard-Formatierung hinterlegt. Sobald eine andere Formatierung vorhanden ist, wird die Vorgabe überlagert. Wenn die Formatierung für Zeilenabstand im Quelltext im RTE gelöscht wird, ist das Problem behoben. Suche nach: line-height im Quelltext. In diesem Beispiel line-height: 10.2pt; rauslöschen.(siehe Bild unten) 59
4. Es lässt sich kein Blocksatz einstellen Es ist nicht möglich, ähnlich wie in einem Textverarbeitungsprogramm wie MS Word in TYPO3 Text im Blocksatz darzustellen. Der Grund ist, dass Internetbrowser nicht über automatische Silbentrennung verfügen, der Text daher größere Lücken aufweisen würde und damit die Leserlichkeit des Textes verschlechtert würde. 60
5. Zwischenablage-Funktion im RTE funktioniert nicht Problem: Das Kopieren/Ausschneiden von Text beispielsweise aus MS Word oder aus dem RTE und Einfügen der Textpassage in den RTE funktioniert nicht. Bei der Arbeit mit dem Firefox-Browser erhalten Sie folgende Fehlermeldung? (Informationen zum Internet Explorer weiter unten) Problemlösung: Im Browser muss Ihre Webseite erst als vertrauenswürdige Seite eingetragen werden, die Zugriffsrechte auf die Zwischenablage erhalten darf. Klicken Sie im oben gezeigten Dialogfenster auf Ok. Am oberen Rand des Browsertabs erscheint nun die Möglichkeit, ein Add-On runterzuladen. 61
Klicken Sie auf Jetzt installieren. Starten Sie danach den Browser neu, damit die Änderungen wirksam werden können. Klicken Sie dann in der Menüleiste des Browsers unter Extras auf AllowClipboard Helper. Es müsste die Internetadresse der URL, mit der Sie gerade in TYPO3 arbeiten, eingetragen sein. Bestätigen Sie mit dem Klick auf Erlauben, dass Sie dieser Seite Zugriff auf die Zwischenablage gestatten. Jetzt ist die Internetadresse in die Liste aufgenommen. Die Zwischenablage-Funktion im RTE von TYPO3 funktioniert jetzt. 62
Einstellungen für den Internet Explorer Im IE werden Sie zunächst standardmäßig bei jedem Einfügen-Vorgang gefragt, ob die Seite auf die Zwischenablage zugreifen darf. Um zu verhindern, dass Sie jedes Mal neu gefragt werden, gehen Sie unter Extras>Internetoptionen> unter dem Reiter Sicherheit auf Vertrauenswürdige Sites. Klicken Sie auf den Button Sites. 63
Geben Sie dann die Internetadresse ein, von der aus Sie mit TYPO3 arbeiten, sofern diese noch nicht aufgeführt ist. Klicken Sie auf den Button Hinzufügen. Die Checkbox unten Für Sites dieser Zone soll leer bleiben. Achten Sie darauf, dass für Vertrauenswürdige Sites die Sicherheitsstufe Niedrig eingestellt ist. Jetzt können Sie Inhalte aus der Zwischenablage in den RTE einfügen, ohne dies bei jedem Vorgang bestätigen zu müssen. 64
3.4 SeitenInhaltselemente verschieben / kopieren Einzelne Seiteninhaltselemente (Content-Elemente) können beliebig verschoben oder kopiert werden. Hierzu gehen Sie wie folgt vor: 1. Gehen Sie auf die Seite, dessen Inhaltselement Sie z.b. kopieren möchten 2. Wechseln Sie in die Listenansicht 3. Achten Sie darauf, dass die Option Erweitere Ansicht aktiviert ist. 4. Nun stehen Ihnen zu jedem Inhaltselement verschiedene Optionen zur Verfügung: 1 Element verschieben 2 Element kopieren Sobald man auf Verschieben klickt, erscheint ein neues Fenster. Hier können Redakteure entweder auf derselben Seite oder über Seiten hinweg einzelne Inhaltselemente verschieben. Im genannten Fenster gibt es die Möglichkeit von Verschieben auf Kopieren zu wechseln. 65
Klicken Redakteure hingegen auf Kopieren ändert sich die Ansicht Ein Inhaltselement wurde kopiert. Dadurch wird es automatisch in eine Zwischenablage gespeichert und kann von dort x-beliebig oft an jede andere Stelle auf der site eingefügt werden. Möchten Sie beispielsweise mehrere Elemente einer Seite duplizieren, klicken Sie auf Zwischenablage Nr. 1. Dadurch erweitert sich die Ansicht. Nun können Sie zum einen alle Elemente oder Element für Element mit in die Zwischenablage kopieren. Von dort können Sie sie wie gehabt an jede x-beliebige Seite x-beliebig oft einfügen. Nun alle relevanten Felder markieren und auf Ausgewählte Datensätze in Zwischenablage übertragen (1) klicken. (2) Hier stehen die Elemente zur Verfügung. 66
Wollten Sie sie beispielsweise auf eine andere Seite kopieren bzw. einfügen, müssten Sie auf die Seite im Verzeichnisbaum klicken und dort auf das Symbol Zwischenablageninhalt einfügen. Dann bestätigen Sie den Vorgang. Auch hier besteht wieder die Möglichkeit, das Einfügen der Inhalte über das Kontextmenü vorzunehmen. (Klick mit linker Maustaste auf das Seitensymbol der Zielseite). 67
3.5 Cache löschen / Verlauf leeren Wenn Inhaltselemente oder komplette Seiten neu eingegeben oder geändert werden, kann es sein, dass sie im TYPO3 Cache oder Browser zwischengespeichert werden. Dadurch erscheinen die Elemente / Seiten ev. nicht sofort live im Internet. In solch einem Fall klicken Sie bitte auf Cache löschen bzw. Verlauf leeren. Das Symbol ist in der Seiten- und Listenansicht oben rechts im redaktionellen Bereich zu erreichen. WICHTIG: Prüfen Sie, ob die Elemente auf Verborgen stehen. Es kann die Ursache dafür sein, dass etwas nicht sofort live angezeigt wird, obwohl der Cache schon gelöscht wurde. (1) alle Caches löschen (2) Cache dieser Seite löschen 68
4.Suchmaschinenoptimierung 4.1 SEO Einmaleins Suchmaschinenoptimierung (auch Search Engine Optimization) kurz SEO hilft, Seiten für Suchen im Internet besser zu positionieren und prominenter in Ergebnislisten zu präsentieren. Vor allem auf die redaktionelle Beschaffenheit der Seite kommt es an. Um eine obere Platzierung in Suchmaschinen zu unterstützen, sind im TYPO3 backend einige wenige Einträge vorzunehmen. Übrigens, Schwerpunkt liegt aufgrund der hohen Verbreitung auf der Google Suchmaschine. Redakteure rufen z.b. in der Seitenansicht eine Seite auf und klicken auf "Seiteneigenschaften bearbeiten" am oberen Rand. Hier sehen Sie unter dem Reiter Allgemein den Seitentitel. Dieser erscheint auf der Webseite als Überschrift auf der Seite bzw. dem Tab (wie hier im Beispiel: Seitenbereiche ) Der Untertitel würde auf der Seite im Content- Bereich als Titel erscheinen, sofern dies im voreingestellten Layout Berücksichtigung findet. Redakteure sollten nun prüfen, ob die Felder: Metatitel Stichworte (geringe Relevanz) Beschreibung ausgefüllt sind. Wenn nicht, sollten sie ausgefüllt werden oder bestehende Einträge auf Relevanz überprüft werden. Stichworte und Beschreibung "vererben" sich im Übrigen auf alle Unterseiten, insofern auf diesen keine eigenen Einträge vorgenommen worden sind. 69
Wenn Sie sich den Quelltext der Seite anzeigen lassen (in Firefox z.b. unter Ansicht, Strg+U), können Sie sehen, dass die eingetragenen Stichworte/Beschreibungen Eingang in den Quelltext gefunden haben. 70
Wenn Sie einen Metatitel eintragen, erscheint dieser anstelle des Seitentitels im Frontend: Auf der Titelleiste des Browsers und/oder dem Tab Die Seitentitel bleiben im Backend aber unverändert und werden durch die Metatitel nicht ersetzt. Mit Beschreibung" können Redakteure der willkürlichen Darstellung in Suchmaschinen entgegenwirken. Denn ohne einen Eintrag in Beschreibung nimmt eine Suchmaschine wahllos die ersten Texte auf einer Seite. Wir empfehlen: nicht länger als 160 Zeichen sein. mit relevanten Keywords (werden der Ergebnisliste fett gedruckt) relevante Keywords sollten möglichst am Anfang stehen üblich ist lesbarer Text in Satzform also mit Satzzeichen WICHTIG: Jede Seite lässt sich nur für wenige Suchbegriffe optimieren. Wir empfehlen 2-3. Auf einer Startseite wird zumeist die komplette Präsenz vorgestellt. Also Inhalte werden angerissen und Unterseiten in der Navigation geteasert. Für SEO bedeutet das, dass die Startseite NICHT für redaktionelle SEO Maßnahmen geeignet ist, außer für den eigenen Unternehmens- bzw. Organisationsname. Folgen Sie unseren Empfehlungen: 1. Wählen Sie die Seite, die Sie optimieren wollen. Definieren Sie die Stichworte, für die Sie diese Seite optimieren möchten. Achten Sie darauf, dass Sie Begriffe / Begriffskombinationen nutzen, nach denen Ihre potenziellen Kunden / Interessenten auch suchen (würden). Suchen Sie selbst nach diesen Stichworten auch keywords genannt und identifizieren Sie so Mitbewer- 71