Der Hauptinhalt der meisten Internetseiten ist Text. Eine Internetseite wird über den reinen Fließtext hinaus mit Bildern, Links und Multimedia ergänzt. Mit Zwischenüberschriften gliedern Sie einen Text in logische Abschnitte und erhöhen die Lesbarkeit.
Grundsätzlich steht Ihnen für die Texteingabe der Richtext-Editor zur Verfügung, der Ihnen alle gewohnten Formatierungsmöglichkeiten eines Office-Programms wie Word oder OpenOffice bietet. Zusätzlich können Sie Texte in Word oder OpenOffice erstellen, in den Richtext-Editor einfügen und weiter bearbeiten.
Es gibt den Richtext-Editor in zwei Varianten. Für die Hauptinhalte verfügt der Richtext-Editor über alle Funktionen, für Teaser, die an Oberseiten weitergeleitet werden, gibt es eine eingeschränkte Variante.
Wenn Sie den Richtext-Editor deaktivieren, kann Text nicht durch den Richtext-Editor formatiert werden. Das kann sinnvoll sein, wenn Sie HTML-Elemente mit CSS formatieren möchten oder die Formatierungen aus Word oder OpenOffice nicht übernehmen wollen. Nachdem Sie Texte aus Word oder OpenOffice eingefügt haben, können Sie den Richtext-Editor wieder aktivieren, um die Texte zu formatieren.
Sie finden den Richtext-Editor im Menü Ändern, indem Sie eine Seite wählen und auf klicken. Beachten Sie bei der Auswahl der Seite, dass nicht jede Ansicht Text beinhaltet, wie z.B. die Ansicht URL-Weiterleitung.
Die Symbole des Richtext-Editors sind mit Tooltips versehen. Wenn Sie den Mauszeiger über das Symbol halten, erscheint der Name des Symbols.
Table 7.14. Icons im Richtext-Editor
![]() | * speichern des Inhalts |
![]() | * letzte Änderung rückgängig machen |
![]() | * rückgängig gemachte Änderung wiederherstellen |
![]() | * HTML-Code bearbeiten * öffnet den Quellcode des Inhalts in einem Pop-up-Fenster |
![]() | * Richtext-Editor im Vollbild anzeigen * bei einem weiteren Klick erscheint wieder die Standardansicht |
![]() | * zeigt im Textfeld die HTML-Tags an, indem um die verwendeten Tags ein Rahmen mit gestrichelten Linien gezogen wird |
![]() | * Textelemente suchen |
![]() | * Textelemente suchen und ersetzen |
![]() | * Text ohne Formatierung als einfachen Text einfügen |
![]() | * Quellcode aufräumen * bereinigt HTML-Code, indem ungültige Formatierungen und ungültiger HTML-Code entfernt wird |
![]() | * Schrift von links nach rechts |
![]() | * Schrift von rechts nach links |
![]() | * entfernt Formatierung von markiertem Text |
![]() | * Schriftauszeichnung fett |
![]() | * Schriftauszeichnung kursiv |
![]() | * Drop-down-Menü mit Formatvorlagen |
![]() | * Multimedia einbetten oder bearbeiten * Video- und Audiodateien einfügenWeitere Informationen zum Einfügen von Multimediadateien finden Sie in Kapitel Multimedia einfügen. |
![]() | * verlinkt den markierten Text z.B. mit einer URL * eingefügten Link bearbeitenWeitere Informationen zum Verlinken von Text finden Sie in Kapitel Text verlinken. |
![]() | * löscht einen Link |
![]() | * Anker einfügen oder bearbeiten * Sprungmarke innerhalb des Textes |
![]() | * Datei aus der Mediendatenbank als Download-Link einfügen oder bearbeiten |
![]() | * Bild einfügen oder bearbeitenWeitere Informationen zum Einfügen von Bildern finden Sie in Kapitel Bild einfügen und verlinken. |
![]() | * dynamisches Bild einfügen oder bearbeitenWeitere Informationen zu dynamischen Bildern finden Sie in Kapitel Dynamisches Bild einfügen. |
![]() | * papaya Addon-Tag einfügen oder bearbeitenMit papaya Addon-Tags werden je nach Anforderung individuelle Inhalte eingefügt. Dafür werden die papaya Addon-Tags extra programmiert. In der Standardeinstellung ist lediglich ein Beispiel zu finden. |
![]() | * Absatz linksbündig ausrichten |
![]() | * Absatz zentriert ausrichten |
![]() | * Absatz rechtsbündig ausrichten |
![]() | * Absatz im Blocksatz |
![]() | * Text tiefstellen, z.B. als Index |
![]() | * Text hochstellen, z.B. als Exponent |
![]() | * markierter Text wird als Zitat formatiert |
![]() | * markierter Text wird als eingefügter Text formatiert * Text wird unterstrichen |
![]() | * markierter Text wird als gelöschter Text formatiert * Text wird durchgestrichen |
![]() | * markierten Text als Abkürzung formatierenWeitere Informationen zu Abkürzungen finden Sie in Kapitel Textelemente mit Tooltips erweitern. |
![]() | * markierten Text als Akronym formatierenWeitere Informationen zu Akronymen finden Sie in Kapitel Textelemente mit Tooltips erweitern. |
![]() | * Sonderzeichen einfügen |
![]() | * Trennlinie einfügen |
![]() | * Liste mit Gliederungspunkten einfügen |
![]() | * nummerierte Liste einfügen |
![]() | * markierten Text nach links ausrücken |
![]() | * markierten Text nach rechts einrücken |
![]() | * Tabelle einfügen oder bearbeitenWeitere Informationen zu Tabellen und ihren Funktionen finden Sie in Kapitel Tabellen einfügen und bearbeiten. |
![]() | * Tabellenzeile bearbeiten |
![]() | * Tabellenzelle bearbeiten |
![]() | * Tabellenzeile oberhalb der markierten Zeile einfügen |
![]() | * Tabellenzeile unterhalb der markierten Zeile einfügen |
![]() | * markierte Tabellenzeile löschen |
![]() | * Spalte links von der markierten Spalte einfügen |
![]() | * Spalte rechts von der markierten Spalte einfügen |
![]() | * markierte Spalte löschen |
![]() | * markierte, verbundene Zellen trennen |
![]() | * markierte Zellen miteinander verbinden |
Grundsätzlich gibt es zwei Möglichkeiten Text aus Word oder OpenOffice in den Richtext-Editor einzufügen. Sie können Text
Wenn Text mit Formatierung in den Richtext-Editor eingefügt wird, kann das zu unerwünschten Ergebnissen führen. Beachten Sie, dass
Um Formatierungen zu entfernen, können Sie
Tooltips zeigen Beschreibungen eines Textelements, wenn Sie den Mauszeiger über das Textelement halten. Die Symbole des Richtext-Editors sind z.B. mit Tooltips versehen. Sie können Tooltips für Abkürzungen oder Akronyme Ihres Textes verwenden.
Table 7.15. Details zu den Fenstern Abkürzung und Akronym
Titel | * Beschreibung der Abkürzung oder des Akronyms, die im Tooltip erscheinen soll |
ID | * eindeutige Kennzeichnung der Abkürzung oder des Akronyms, um Verwechslungen zu vermeiden |
Klasse | * CSS Klasse, welche die Abkürzung formatiert |
Format | * CSS Stil, um das HTML-Element <abbr> zu formatieren |
Schriftrichtung | Textrichtung von * Links nach rechts * Rechts nach links |
Sprache | Sprachkürzel nach ISO 639-1, z.B. de für Deutsch und en für Englisch |
Der Tabelleneditor ist das umfangreichste Werkzeug des Richtext-Editors. Mit ihm ist es möglich, Tabellen zu erstellen und bearbeiten wie Sie es von Textbearbeitungsprogrammen wie Word oder OpenOffice gewohnt sind.
Sie können
Table 7.16. Details zum Reiter Allgemein im Fenster Tabelle einfügen/bearbeiten
Spalten | * Anzahl der Spalten, welche die Tabelle enthalten soll |
Zeilen | * Anzahl der Zeilen, welche die Tabelle enthalten soll |
Abstand innerhalb der Zellen | * Abstand des Inhalts der Zelle zum Rahmen der Zelle * Angabe in Pixeln |
Zellenabstand | * Abstand des Rahmens der Zelle zum Abstand des Rahmens der umliegenden Zellen * Angabe in Pixeln |
Ausrichtung | Die Ausrichtung gibt die Position der Tabelle auf der Seite an. * Links: Ausrichtung am linken Seitenrand * Mittig: Ausrichtung in der Mitte der Seite * Rechts: Ausrichtung am rechten Seitenrand |
Rahmen | * Liniendicke des Rahmens * Angabe in Pixeln * wird kein Wert angegeben, wird kein Rahmen dargestellt |
Breite | * Angabe der Breite in Pixeln (px) oder Prozent (%) * wird kein Wert angegeben, passt sich die Breite an den Inhalt an |
Höhe | * Angabe der Breite in Pixeln (px) oder Prozent (%) * wird kein Wert angegeben, passt sich die Höhe an den Inhalt an |
Klasse | * CSS Klasse, welche die Tabelle formatiert |
Beschriftung der Tabelle | * aktiviertes Häkchen fügt eine Kopfzeile ein, in welcher der Titel der Tabelle eingegeben werden kann |
Table 7.17. Details zum Reiter Erweitert des Fensters Tabelle einfügen/bearbeiten
Table 7.18. Details zum Reiter Allgemein im Fenster Eigenschaften der Zeile
Gruppierung | Gibt den Teil der Tabelle an, dessen Eigenschaften bearbeitet werden sollen. * Tabellenkopf: HTML-Element <thead> * Tabelleninhalt: HTML-Element <tbody> * Tabellenfuß: HTML-Element <tfoot> |
Ausrichtung | Gibt die horizontale Ausrichtung des Inhalts der Zellen an. * Mittig * Links * Rechts |
Vertikale Ausrichtung | Gibt die vertikale Ausrichtung des Inhalts der Zellen an. * Oben * Mittig * Unten |
CSS Klasse | * CSS Klasse, welche die Tabelle formatiert |
Höhe | * Angabe der Zeilenhöhe in Pixeln |
Drop-down-Menü | * Diese Zeile verändern * Ungerade Zeilen verändern * Gerade Zeilen verändern * Alle Zeilen verändern |
Table 7.19. Details zum Reiter Erweitert der Fenster Eigenschaften der Zeile und Eigenschaften der Zelle
Der Reiter Erweitert des Fensters Eigenschaften der Zelle ist identisch mit dem des Fensters Eigenschaften einer Zeile.
Table 7.20. Details zum Reiter Allgemein im Fenster Eigenschaften der Zelle
Ausrichtung | Gibt die horizontale Ausrichtung des Inhalts der Zellen an. * Mittig * Links * Rechts |
Zellentyp | * Textzelle: HTML-Element <td> * Überschrift: HTML-Element <th> |
Vertikale Ausrichtung | Gibt die vertikale Ausrichtung des Inhalts der Zellen an. * Oben * Mittig * Unten |
Bezug | Der bezug greift auf Spalten- und Zeilenüberschriften ein. * HTML-Element <th> * Spalte: HTML-Attribut <th scope=col> * Zeile: HTML-Attribut <th scope=row> * Vertikal gruppieren: HTML-Attribut <th scope=rowgroup> * Horizontal gruppieren: HTML-Attribut <th scope=colgroup> |
Breite | * Angabe der Zellenbreite in Pixeln * wird für die gesamte Spalte übernommen |
Höhe | * Angabe der Zellenhöhe in Pixeln * wird für die gesamte Zeile übernommen |
CSS Klasse | * CSS Klasse, die den Text formatiert |
Drop-down-Menü | * Diese Zelle verändern * Alle Zellen in dieser Zeile verändern * Alle Zellen in dieser Spalte aktualisieren * Alle Zellen der Tabelle verändern |
Im Richtext-Editor können Sie Text mit E-Mail-Adressen, eigenen oder externen Webseiten verlinken sowie Text als Download-Link formatieren.
Table 7.21. Details zum Reiter Seite im Fenster Link einfügen/bearbeiten
Seiten-ID | * Seite, zu welcher der Link führen soll |
Text | * Text, der als Link formatiert werden soll |
Titel | * Name des Links |
CSS Klasse | * CSS Klasse, die den Link formatiert |
Linkziel | Das Linkziel gibt an, wie der Link geöffnet werden soll. * Aktuelles Fenster * Neues Fenster |
Linkziel als Pop-up öffnen | * aktiviertes Häkchen öffnet den Link in einem Pop-up-Fenster |
Breite | * Breite des Pop-up-Fensters * Angabe in Pixeln |
Höhe | * Höhe des Pop-up-Fensters * Angabe in Pixeln |
Scrollbar | * aktiviertes Häkchen ermöglicht es, im Pop-up-Fenster zu scrollen |
Größe änderbar | * aktiviertes Häkchen ermöglicht es dem Nutzer, die Größe des Pop-up-Fensters anzupassen |
Toolbar | * aktiviertes Häkchen blendet die Toolbar des Internet-Browsers ein |
Table 7.22. Details zum Reiter URL im Fenster Link einfügen/bearbeiten
URL | * Adresse, zu welcher der Link führen soll |
Linktext | * Text, der als Link formatiert werden soll |
Linktitel | * Name des Links |
CSS Klasse | * CSS Klasse, die den Link formatiert |
Linkziel | Das Linkziel gibt an, wie der Link geöffnet werden soll. * Aktuelles Fenster * Neues Fenster |
Linkziel als Pop-up öffnen | * aktiviertes Häkchen öffnet den Link in einem Pop-up-Fenster |
Breite | * Breite des Pop-up-Fensters * Angabe in Pixeln |
Höhe | * Höhe des Pop-up-Fensters * Angabe in Pixeln |
Scrollbar | * aktiviertes Häkchen ermöglicht es, im Pop-up-Fenster zu scrollen |
Größe änderbar | * aktiviertes Häkchen ermöglicht es dem Nutzer, die Größe des Pop-up-Fensters anzupassen |
Toolbar | * aktiviertes Häkchen blendet die Toolbar des Internet-Browsers ein |
Table 7.23. Details zum Reiter E-Mail im Fenster Link einfügen/bearbeiten
E-Mail-Adresse | * E-Mail-Adresse, an die E-Mail verschickt werden soll |
E-Mail-Betreff | * Text wird in der Betreffzeile der E-Mail eingefügt |
Text | * Text, der als Link formatiert werden soll |
Titel | * Name des Links |
CSS Klasse | * CSS Klasse, die den Link formatiert |
Table 7.24. Details zum Fenster Datei einfügen/bearbeiten
Linktitel | * Text, der als Link formatiert werden soll |
Quickinfo | * eingegebener Text erscheint, wenn der Mauszeiger über den Link gehalten wird |
Linkziel | Das Linkziel gibt an, wie der Link geöffnet werden soll. * Aktuelles Fenster * Neues Fenster |
In papaya CMS verwalten Sie Bilder in der Mediendatenbank auf dem Server. Wenn Sie Bilder in Ihre Artikel einfügen, können Sie grundsätzlich Größe, Position, Seitenabstände, Textumfluss und Alternativtext bestimmen. Fügen Sie Bilder als einfaches Bild in den Text ein oder formatieren Sie ein Bild als Link.
Beachten Sie bei der Arbeit mit Bildern für das Internet folgende Punkte:
Table 7.25. Details zum Reiter Datei im Fenster Bild einfügen/bearbeiten
Table 7.26. Details zum Reiter Link im Fenster Bild einfügen/bearbeiten
In papaya CMS verwalten Sie dynamische Bilder im Menü Bilder. Dynamische Bilder enthalten Parameter, die immer wieder neu generiert werden. Ein Beispiel für dynamische Bilder sind Captcha-Grafiken, mit denen überprüft wird, ob ein Formular im Internet automatisch ausgefüllt wird oder von einem Menschen.
Um ein dynamisches Bild einzufügen, müssen Sie zunächst das dynamische Bild im Menü Bilder definieren.
Weitere Informationen wie Sie dynamische Bilder verwalten, finden Sie in Kapitel Menü Bilder.
Beachten Sie bei der Arbeit mit Bildern für das Internet folgende Punkte:
In papaya CMS verwalten Sie Multimediadateien wie Audio- und Videodateien in der Mediendatenbank auf dem Server. Wenn Sie Multimediadateien in Ihre Artikel einfügen, können Sie grundsätzlich Größe, Position, Seitenabstände und Qualität bestimmen.
Folgende Dateiformate können Sie für Audiodateien einsetzen:
Folgende Dateiformate können Sie für Video- und andere Multimediadateien einsetzen:
Das Modul Multimedia ist ein Modul des Anbieters TinyMCE. Weitere Informationen zu den Einstellungen im Fenster Multimedia-Inhalte einfügen/bearbeiten entnehmen Sie bitte der Dokumentation von TinyMCE unter http://www.tinymce.com/wiki.php.