Der WYSIWYG-Editor im CMS

Ähnliche Dokumente
Text, Links und Downloads bearbeiten

Auf einer Seite werden maximal 10 Einträge angezeigt. Sind viele Einträge vorhanden, werden diese auf mehrere Seiten aufgeteilt.

Jimdo - Seitenelemente

Copyright icomedias GmbH icomedias Group

Der Editor. Lernplattform. Editorfenster vergrößern

RÖK Typo3 Dokumentation

Newsmodul 2.00 Handbuch

Fragen und Antworten zum Content Management System von wgmedia.de

ECDL Base kompakt. Ergänzungsmodul: Präsentation [mit Windows 7 und PowerPoint 2010], Syllabus 5. Thomas Alker. 1. Auflage, August 2014

Textbearbeitung im CKEditor

Wenn Sie einen Beitrag in Joomla V2.5 (mit JCE-Konfiguration) aufrufen, sehen Sie ein Editorfenster mit folgenden Icons:

Textverarbeitung: Die elementaren Formatierungen

Erstellen/Aktualisieren von HeBIS-Handbuchkapiteln

Tabellen. Mit gedrückter Maustaste können Sie die Randlinien ziehen. Die Maus wird dabei zum Doppelpfeil.

Notizen: ikonverlagsgesmbh redmond s Verlag / Edi Bauer 31

Word 2003: Grundlagen

Inhaltsverzeichnis Formatierungsmöglichkeiten Designs Ein Design zuweisen Einen einzelnen Designbestandteil hinzufügen...

Anleitung zur Pflege der Homepage über den Raiffeisen-Homepage-Manager

Der Editor und seine Funktionen

Erstellen eines neuen Dokumentes

WSCAR-Help Dokumente Version

Nur in schwarz angezeigten Verzeichnissen kann gespeichert werden!

Erzherzog Johann Jahr 2009

Tabellen. Mit gedrückter Maustaste können Sie die Randlinien ziehen. Die Maus wird dabei zum Doppelpfeil.

Dokumentation. Content-Manager

Word Grundkurs. Sommerkurs 2003

Bedienungsanleitung der Wissensdatenbank

Anleitung zur korrekten Formatierung von Forschungsberichten

Rezepte in der Klammer-Strich-Methode schreiben

Inhalte mit DNN Modul HTML bearbeiten

Diese Dokumentation richtet sich an eher unerfahrene Benutzer.

Editor. Übersicht. Lernplattform

Word öffnen und speichern

Handbuch für Redakteure (Firmenpark)

Inhaltsverzeichnisse. 1. Überschriften zuweisen. 2. Seitenzahlen einfügen. 3. Einen Seitenwechsel einfügen

Texte erstellen und bearbeiten mit Word 2007

Eine Linkliste in Word anlegen und zur Startseite des Browsers machen

Da die Bedienung des Editors viele Möglichkeiten aufweist, aber auch etwas Übung voraussetzt, haben wir ihm ein eigenes Unterkapitel gewidmet.

Formatierungsvariationen (0050a-Formatierung-Tabellen-ua.docx)

Kein Angst vor dem TinyMCE

3.1 Textformate. Sie verändern die Schriftart. Sie verändern die Schriftgröße. Den Text formatieren

Protokoll zu: Nummerierung und Aufzählung, Formatvorlagen zu Überschriften, Formatvorlagen zu Absätzen und Rahmen und Schattierungen

1. Anmeldung in das Content Management System WEBMIN CMS

PowerPoint Unterrichtsskript WIHOGA Dortmund. 1 Einführung und Formatierung Verschiedenes Folienmaster Animationen...

Inhalte mit DNN Modul HTML bearbeiten

1 Excel Schulung Andreas Todt

Dreamweaver Arbeiten mit HTML-Vorlagen

ANLEITUNG ZUR TEXTGESTALTUNG IN WORD 2003

Kurze Bedienungsanleitung für den Kompozer

TABULATOREN UND AUFZÄHLUNGEN

Webseite innerhalb der TYPO3-Oberfläche anzeigen. Datei Verzeichnisbaum und Dateien anzeigen und bearbeiten

Webseite innerhalb der TYPO3-Oberfläche anzeigen. Newsletter-Adressen verwalten. Datei Verzeichnisbaum und Dateien anzeigen und bearbeiten

Eine Seite formatieren. Folien formatieren Arbeitsbereich Ausführen. Folien auswählen. Folien einfügen. Autopilot. Folienübergänge und Animationen

Aufgabe 3 Word 2013 (Musterlösung)

Hilfe zur Dokumentenverwaltung

Mit der Maus im Menü links auf den Menüpunkt 'Seiten' gehen und auf 'Erstellen klicken.

Mit ihrem CMS-System haben sie folgende Möglichkeiten:

Anleitung für einen Eintrag einer Tätigkeit (News, Einsatz, Sonstiges) in unserer Homepage

RÖK Typo3 Dokumentation

Kennen, können, beherrschen lernen was gebraucht wird

Tabellen bearbeiten. Excel Grundlagen ZID/Dagmar Serb V.02/Sept. 2015

[Arbeiten mit dem Nvu Composer]

5. Die Open Office.org Writer-Hilfe Die Open Office.org Writer-Hilfe verwenden...45

Mein Computerheft. Arbeiten mit Writer. Name: Ich kann ein Schreibprogramm öffnen und Texte schreiben. Öffne 00o4Kids mit einem Doppelklick!

Artikel schreiben auf LSB-Homepage

Kennen, können, beherrschen lernen was gebraucht wird

MBF III 342- Zentrale. Abschlüsse

Tabellen in Word. 1. Erstellen von Tabellen. 2. Erscheinungsbild und Eigenschaften 3. Zellinhalte 4. Arbeiten mit Tabellen. Bezug: Office 2010

Lange Texte formatieren

Wir fragen um! 26. Gebrauchsanweisung: Szenario Abkürzung. 1. Du hast eine Umfrage gemacht, die Fragen und Antworten liegen neben dir bereit.

ECDL / ICDL Textverarbeitung

Bitte schenken Sie den unterstrichenen Passagen besondere Aufmerksamkeit, sie enthalten wichtige Hinweise.

Erstellen einer News

Benötigte Hard- oder Software. Präsentationsprogramm PowerPoint. Anmerkung: Die Anleitung ist optimiert für Microsoft PowerPoint 13.

Umsetzen einer skalierbaren horizontalen Navigation:

Bedienungsanleitung. Content-Management-System GORILLA

4 Inhalt bearbeiten und anlegen

Inhaltsverzeichnis HÄUFIGKEITSTABELLEN... 1

Sobald Sie in Moodle einen Textbeitrag verfassen möchten, erhalten Sie Zugang zu folgendem HTML- Texteditor:

MINDMAPS ERSTELLEN MIT BUBBL.US

HILFE ZUM ÄNDERN VON INHALTEN

Tabulatoren in Word 7

Inhaltsverzeichnisse

Im Original veränderbare Word-Dateien

Scoutsystems Software Sammler-Scout Kurzanleitung

Symbolleiste Menü Einfügen

Im Original veränderbare Word-Dateien

Erklärung der Gliederungsansicht und die zugehörige Symbolleiste. Änderung der Formatvorlagen für die Überschriften.

Swissmem ebooks ebook Funktionen Software Version 4.x (PC)

User-Manual für Autoren

Microsoft Access Arbeiten mit Tabellen. Anja Aue

Transkript:

1/9 Für Inhalte, die länger als 255 Zeichen sein können, steht im CMS ein sog. WYSIWYG-Editor ("what you see is what you get") zur Verfügung. Die mittels der Symbole angebotenen Funktionen repräsentieren HTML-Kodierungen und sind nicht mit Formatierungen in Word oder anderen Textverarbeitungsprogrammen zu vergleichen. Der Editor Nicht alle Funktionen des Editors werden beim Bearbeiten von Inhalten im HeBIS-CMS benötigt. Viele Formatierungsmöglichkeiten sind überflüssig, da sie durch die Vorlage, in der die Objekte dargestellt werden, bereits definiert sind. Tipp: Alle Symbole sind mit einem Alternativtext versehen, den man lesen kann, wenn man mit der Maus zu dem Symbol fährt! Nicht benutzt werden sollen: Schriftname und Schriftgröße Schriftstil (außer "Überschrift 3") Vorder- und Hintergrundfarbe Schriftformatierungen F = Fettdruck K = Kursiv U = unterstrichen (bitte möglichst nicht benutzen)

A 2 = tiefgestellt A 2 = hochgestellt A = durchgestrichen 2/9 Textausrichtung linksbündig zentriert rechtsbündig Blocksatz (funktioniert in HTML eingeschränkt) Listen, Nummerierungen, Textein- und -ausrückungen Unnummerierte Liste Mit diesem Symbol erstellt man Listen wie diese: Zum Beenden einer Liste genügt, wie in Word, das zweifache Betätigen der Return-Taste, um wieder auf der normalen Textebene weiterzuschreiben. Zur weiteren Untergliederung einer unnummerierten Liste benutzt man den Button "Einrücken": Ergebnis: texttexttext texttexttext (Für tiefere Gliederungen den Button "Einrücken" mehrfach benutzen!) Um eine Gliederungstiefe wieder zu entfernen, den Eintrag also auf eine höhere Gliederungstiefe zu stellen, verwendet man den Button "Ausrücken": Tipp: Am besten schreibt man zuerst die Zeilen, die Aufzählungszeichen bekommen sollen, untereinander weg (mit Return-Taste am Ende eines Listeneintrags) und benutzt anschließend die Listen-Symbole.

3/9 Nummerierte Listen Die Funktionsweise ist dieselbe, das Ergebnis sieht hierbei so aus: 1. texttexttext 2. texttexttext 3. texttexttext Nach Einrückungen (tieferen Untergliederung) sieht eine nummerierte Liste so aus: 1. texttexttext 1. texttexttext 2. texttexttext 2. texttexttext 3. texttexttext Links und Grafiken einfügen Hyperlink einfügen/korrigieren Nachdem man einen Text markiert hat, benutzt man das Symbol, um einen Internet-Link einzufügen. Auch zum Korrigieren bestehender Links verwendet man dieses Symbol. Es erscheint folgender Bildschirm:

4/9 Externer Link: URL eintragen, i. d. R. Link zu einem anderen Server (mit dem Button "Auswählen" erhält man den eigenen Server angezeigt und kann Dateien auswählen, die nicht Bestandteil des CMS sind. Diese Dokumente sind im Dateimanager durch schwarze Schrift gekennzeichnet, CMS-interne Dokumente sind blau.) Anker: Link zu einer vorher definierten Sprungmarke (definiert mit ) setzen Interner Link: Über den Button "Auswählen" erhält man im Dateimanager alle Dokumente des CMS angezeigt. E-Mail: Hier wird die E-Mail-Adresse eingetragen. Beim Klick auf den Link wird automatisch eine neue E-Mail erzeugt. Objekt: Über den Button "Auswählen" kann man ein Objekt der gleichen Klasse verlinken (z. B. in einem Cocktailartikel auf einen anderen verweisen). An dieser Stelle kann nicht zu Objekten anderer Klassen verlinkt werden (z. B. in einem Cocktailartikel auf ein Handbuch-Kapitel). Will man auf ein Objekt aus einer anderen Klasse verweisen, muss man den "Externen Link" benutzen. Dazu sucht man sich im Internetangebot das Objekt aus, markiert mit Strg+C die URL in der Adresszeile des Browsers, geht in das Hyperlink-Fenster und trägt den URL mit Strg+V in die entsprechende Zeile ein. Den Ausdruck "http://smirnoff.rz.uni-frankfurt.de" bzw. "http://www.hebis.de" (der Schrägstrich nach de muss unbedingt stehenbleiben!!) wird entfernt. CSS Style: Wird nicht verwendet Linkziel: Wird nicht benötigt Hyperlink löschen Man markiert den Text, der den Hyperlink enthält und klickt anschließend auf diesen Button. Danach ist der Hyperlink entfernt. Anker einfügen Diese Funktion dient dazu, in langen Texten sog. Sprungmarken einzufügen (z. B. zum Erstellen eines Inhaltsverzeichnisses für den nachfolgenden Text). Man platziert den Cursor im Editor an eine Stelle vor dem Text, zu dem man springen möchte und klickt dann auf das Symbol. Es erscheint der folgende Bildschirm: Hier gibt man den Namen der Sprungmarke ein, auf den später mit dem Symbol verlinkt wird. Im Hyperlink-Bildschirm taucht der hier eingegebene Name der Sprungmarke dann im Pulldown- Menü hinter "Anker" auf und kann ausgewählt werden.

5/9 Grafik einfügen Im Textfeld können auch Bilder eingefügt werden. Nach dem Klick auf das Grafik-Symbol erscheint dieser Bildschirm: Im Allgemeinen sollte eine webedition-interne Grafik verwendet werden, die man durch den Button "Auswählen" aus dem Dokumentenverzeichnis "images" 1 heraussucht. Der Bild-URL hinter "webedition-externe Grafik" sollte möglichst nicht verwendet werden (urheberrechtliche Gründe). Die Felder Breite, Höhe, Horizontaler Abstand, Vertikaler Abstand brauchen nicht ausgefüllt werden. Trägt man bestimmte Pixelzahlen für Breite oder Höhe ein, kann es sein, dass die Grafik verzerrt wiedergegeben wird. Deshalb sollte in diese Felder nichts eingetragen werden. So wird gewährleistet, dass die Grafik in ihrer originalen Größe angezeigt wird. Rand: mit 0 besetzen Name: nicht erforderlich Ausrichtung: keine Umstellung nötig (Default = linksbündig) Alternativer Text: Eintragen, was die Grafik darstellen soll (bitte kurzer Text!) Horizontale Linie einfügen Bitte nicht verwenden! 1 Wie man Grafiken ins CMS importiert, damit man sie als "interne Grafiken" verlinken kann, steht im Kapitel 3.4 des webedition-handbuchs.

6/9 Horizontale Linien werden gelegentlich zum Gliedern von Texten verwendet. Im HeBIS- Internetangebot werden sie nicht eingesetzt. Tabellen Neue Tabelle einfügen Nach Klick auf das Symbol erscheint ein neuer Bildschirm: Zeilen: Anzahl der benötigten Zeilen eintragen (später können Zeilen hinzugefügt oder entfernt werden) Spalten: Anzahl der benötigten Spalten eintragen (können später ebenfalls hinzugefügt oder entfernt werden) Rand: 1 bei Tabellen mit Rand 0 bei Tabellen ohne Rand (z. B. statt Tabulatoren einzusetzen) Innenabstand: 3 eintragen, damit der Text nicht zu dicht am Rand klebt Zellabstand: 0 eintragen, beeinflusst die Rahmenstärke Hintergrundfarbe: wird nicht verwendet Breite: Prozentzahl zwischen 0 und 100 eintragen, je nach dem, ob die Tabelle die gesamte Breite des Textes einnehmen soll oder nicht. Höhe: kann unbesetzt bleiben Ausrichtung: braucht nicht verändert werden (Default = linksbündig) CSS Style: keine verwendet für Tabellen Tabelleneigenschaften bearbeiten Mit dem Klick auf das Symbol erhält man obigen Bildschirm erneut, wobei die eingestellten Eigenschaften der markierten Tabelle angezeigt werden und angepasst werden können.

7/9 Eigenschaften einer Zelle bearbeiten Damit sich eine Tabelle wie gewünscht verhält, kann man hier detailliert für eine Zelle festlegen, welche Eigenschaften sie haben soll. Dazu die Zelle mit der Maus anklicken. Nach dem Klick auf das Symbol erhält man folgenden Bildschirm: Breite: bestimmt die Breite einer Zelle und sollte in jeder Spalte für je eine Zelle in Prozent festgelegt werden, so dass sich die Prozente auf 100 summieren. Damit beeinflusst man die Spaltenbreite in der Tabelle. Höhe: falls eine bestimmte Zeilenhöhe gewünscht ist (meist nicht erforderlich) Spannweite: hier trägt man die Anzahl der Spalten ein, über die sich eine Zelle erstrecken soll (Zusammenfügen von Zellen) horizontale Ausrichtung: legt fest, ob der Zelleninhalt, linksbündig, rechtsbündig, zentriert angezeigt werden soll vertikale Ausrichtung: legt fest, ob Zelleninhalte oben bündig, unten bündig oder zentriert angezeigt werden sollen Hintergrundfarbe: Beim Klick auf die Zeile erscheint ein Farbwähler. In die Zeile darunter trägt man die RGB-Farbnummer ein. Folgende Farben sind erlaubt: dunkelstes Gelb: FFE59A mittleres Gelb: FFFACD hellstes Gelb: FFFFF0 CSS Style: greift nicht auf die HeBIS-eigenen Styles für Tabellenzellen zu und wird deshalb nicht verwendet Spalten einfügen (rechts) (links) Vor dem Klicken auf diese Symbole muss eine Zelle markiert sein, dann wird die Spalte entsprechend links oder rechts davon eingefügt. Zeilen einfügen (oberhalb) (unterhalb) Auch diese Funktionen werden ab Cursorposition in der Tabelle ausgeführt.

8/9 Spaltenspannweite erhöhen Ab Cursorposition wird die Zeile rechts daneben mit der markierten Zelle verbunden. Diese Funktion kann über mehrere Spalten hinweg verwendet werden. (Word: Funktion "Zellen verbinden") Im Bildschirm "Zelleigenschaften" steht dann "Spannweite: x" (je nach Anzahl der Spalten, über die sich die zusammengeführte Zelle erstreckt). Spaltenspannweite erniedrigen Verbundene Zellen können mit dieser Funktion wieder geteilt werden. (Word: Funktion "Zellen teilen") RTF-Import Bei bereits vorhandenen Texten kann man sich die Schreibarbeit sparen, indem man die Funktion RTF-Import benutzt. Dateien im RTF- und im TXT-Format können verwendet werden. Tipp: Man kann DOC-Texte als RTF abspeichern, damit man sie verwenden kann. Im folgenden Bildschirm kann man die Datei von der eigenen Festplatte auswählen, die importiert werden soll. Bitte die Checkboxen unterhalb der Dateiauswahl nicht ankreuzen. Schriftarten, Schriftgrößen und Schriftfarben werden durch die CMS-Templates bestimmt. Als nächstes erscheint eine Vorschau, die allerdings wenig nützt, weil sie im HTML-Code wiedergegeben ist. Nach dem Bestätigen des Imports wird der Text im WYSIWYG-Editor angezeigt und kann ggf. weiter bearbeitet werden. Grafiken und Tabellen werden aus den importierten RTF- oder TXT-Dateien nicht übernommen! Editor im Fullscreen-Modus öffnen Bei umfangreichen Texten bietet es sich an, im Vollbild-Modus zu arbeiten. Dann nimmt der Editor den gesamten Bildschirm ein und ein größeres Edit-Fenster steht zur Verfügung.

9/9 Kopieren, Ausschneiden, Einfügen Diese Funktionen sind hinlänglich bekannt und erfüllen auch hier keinen anderen Zweck. Rückgängig, Wiederherstellen Mit der Funktion "Rückgängig" können mehrere Schritte wieder aufgehoben werden. Mit "Wiederherstellen" stellt man rückgängig gemachte Aktionen wieder her. "Rückgängig" und "Wiederherstellen" funktionieren nicht, wenn man zwischenzeitlich in einen anderen Ansichtsmodus (z. B. Vollbild) gewechselt hat. Versteckte Ränder Funktion unbekannt Umschalter "Quellcode bearbeiten"/"wysiwyg-editor" Mit dem Klick auf den Bleistift schaltet man in den Quellcode-Modus um. Hier können die HTML- Tags direkt bearbeitet werden. In der HTML-Ansicht erscheint anstelle des Bleistifts als Symbol das Auge, mit dem man zurück in den WYSIWYG-Modus wechselt.