Hilfe:Online-Editor im Expertenmodus

Aus seminarwiki

Inhaltsverzeichnis

Funktionen des Online-Editors im Überblick

Mit dem Online-Editor lassen sich ohne Vorkenntnisse einfache Internetseiten erstellen. Mit ein wenig Geduld und Experimentierfreude lassen sich auch aufwändigere Layouts vornehmen.

Natürlich braucht auch unser Online-Editor ein wenig Übung und Einarbeitung. Sie haben aber den Vorteil, dass Sie jede gespeicherte html-Datei in Ihrem Raum sofort bearbeiten können - ohne sie erst hoch oder herunterzuladen zu müssen!

Viele Funktionen des Online-Editors sind Ihnen aus ihrer Textverarbeitung bekannt. Hier finden sie eine Übersicht über alle Befehle des Online-Editors:

Allgemeine Funktionen

Bild:Tinymce01.png Speichern. Die wichtigste Funktion, die sollten Sie häufig nutzen.
Bild:Tinymce02.png Neues Dokument. Erstellt ein neues Dokument
Bild:Tinymce26.png Letzte Änderungen rückgängig machen.
Bild:Tinymce27.png Rückgängig gemachte Aktionen wiederherstellen.
Bild:Tinymce20.png Suchen.
Bild:Tinymce21.png Suchen und ersetzen.
Bild:Tinymce33.png Hilfe zu den wichtigsten Funktionen.
Bild:Tinymce37.png Vorschau.
Bild:Tinymce62.png Drucken.
Bild:Tinymce65.png Vollbildmodus.
Bild:Tinymce66.png Eigenschaften des Dokuments (z.B. Dokumententitel, Standardschriftart, Hintergrundfarbe, etc.) anzeigen und bearbeiten.

Textformatierung

Bild:Tinymce03.png Fettschrift. Wenn Sie keinen Text markiert haben wird fortan in Fettschrift geschrieben. Wenn Sie Text markiert haben, können Sie diesen direkt in Fettschrift ausgeben.
Bild:Tinymce04.png Kursivschrift. Wenn Sie keinen Text markiert haben wird fortan kursiv geschrieben. Wenn Sie Text markiert haben, können Sie diesen direkt in Kursivschrift ausgeben.
Bild:Tinymce05.png Text unterstreichen. Wenn Sie keinen Text markiert haben wird fortan unterstrichen geschrieben. Wenn Sie Text markiert haben, können Sie diesen direkt unterstreichen.
Bild:Tinymce06.png Text durchstreichen. Wenn Sie keinen Text markiert haben wird fortan durchgestrichen geschrieben. Wenn Sie Text markiert haben, können Sie diesen durch einen Klick auf diesen Knopf direkt durchstreichen.
Bild:Tinymce38.png Textfarbe festlegen.
Bild:Tinymce39.png Texthintergrundfarbe festlegen.

Textlayout

Bild:Tinymce07.png Objekte linksbündig ausrichten.
Bild:Tinymce08.png Objekte zentriert ausrichten.
Bild:Tinymce09.png Objekte rechtsbündig ausrichten.
Bild:Tinymce10.png Objekte im Blocksatz ausrichten.
Bild:Tinymce22.png Eine Liste erstellen. Drücken Sie die Eingabetaste, um einen neuen Punkt zu erzeugen.
Bild:Tinymce23.png Eine nummerierte Liste erstellen. Drücken Sie die Eingabetaste, um die nächste Zahl zu erhalten.
Bild:Tinymce24.png Text ausrücken.
Bild:Tinymce25.png Text einrücken.
Bild:Tinymce55.png Text tiefer stellen.
Bild:Tinymce56.png Text höher stellen.

Formatvorlagen

Bild:Tinymce11.png CSS-Stile beinhalten Formatierungen mit Schriftart,-farbe, -hintergrundfarbe und -ausrichtung.
Bild:Tinymce12.png Diese Funktion beinhaltet die Formatvorlagenauswahl. Klicken Sie auf das Feld und wählen Sie aus den vorgegebenen Vorlagen beispielsweise "Überschrift 1" oder "Adresse" aus.
Bild:Tinymce13.png Hier können Sie eine Schriftfamilie auswählen.
Bild:Tinymce14.png Hier können Sie die Schriftgröße auswählen.

Eine Beispieldatei mit diesen Formatvorlagen finden Sie hier: Formatvorlagen

Einfügen

Allgemein

Bild:Tinymce15.png Markiertes Objekt ausschneiden.
Bild:Tinymce16.png Markiertes Objekt kopieren.
Bild:Tinymce35.png Aktuelles Datum einfügen.
Bild:Tinymce36.png Aktuelle Zeit einfügen.

Text

Bild:Tinymce17.png Kopierten Text mit Formatierungen einfügen.
Bild:Tinymce18.png Kopierten Text ohne Formatierungen einfügen.
Bild:Tinymce19.png Diese Funktion öffnet ein neues Fenster, in dem sich ein Eingabefeld befindet. In dieses können Sie Text aus Word einfügen, wobei nur die wichtigen Formatierungen übernommen werden. Word hinterlässt viele "unsichtbare" Formatierungen, die beim Kopieren innerhalb von Worddokumenten notwendig sind, die im Editor jedoch nur stören. Durch das Einfügen in das Eingabefeld werden diese Formatierungen entfernt.

Links

Bild:Tinymce28.png Objekt verlinken. Objekt kann z.B. Text oder ein Bild sein. Bitte beachten Sie hierbei, dass Sie das Objekt vorher markieren müssen, um dieses Symbol betätigen zu können. Sollten Sie bereits einen Link gesetzt haben, so können Sie durch Klicken auf dieses Icon den Link bearbeiten.
Bild:Tinymce29.png Link (siehe vorherigen Punkt) wieder aufheben.
Bild:Tinymce30.png Über das Ankersymbol können Sie einen Punkt in Ihrer Seite mit einem Anker versehen, auf den Sie direkt verlinken können. So läßt sich z.B. ein Inhaltsverzeichnis erstellen mit dem man einzelne Kapitel einer langen Seite direkt anspringen kann. Beispielseite

Bilder und Grafiken

Bild:Tinymce31.png Über dieses Symbol können Sie ein Bild in Ihre Webseite einfügen. Bitte beachten Sie, dass Sie keine Bilder direkt hochladen und einfügen können. Sie können Bilder nur verlinken. Aus diesem Grund muss sich das Bild bereits im Internet befinden, sprich: über eine Angabe von http:// erreichbar sein.
Bild:Tinymce52.png Horizontale Linie einfügen.
Bild:Tinymce61.png Horizontalen Balken einfügen.
Bild:Tinymce57.png Sonderzeichen einfügen.
Bild:Tinymce58.png Smilies einfügen.

Multimedia

Bild:Tinymce59.png Flash-Datei einfügen.
Bild:Tinymce60.png mp3-Audiodatei einfügen.

Tabellen

Bild:Tinymce41.png Tabelle einfügen.
Bild:Tinymce42.png Zeileneigenschaften.
Bild:Tinymce43.png Zelleneigenschaften.
Bild:Tinymce44.png Zeile oberhalb einfügen.
Bild:Tinymce45.png Zeile unterhalb einfügen.
Bild:Tinymce46.png Zeile entfernen.
Bild:Tinymce47.png Spalte links einfügen.
Bild:Tinymce48.png Spalte rechts einfügen.
Bild:Tinymce49.png Spalte entfernen.
Bild:Tinymce50.png Zelle teilen.
Bild:Tinymce51.png Zellen zusammenfügen.

Besondere Funktionen

Bild:Tinymce32.png HTML-Code bereinigen. Dabei werden unnötige Angaben entfernt, die z.B. Word beim Kopieren in den Editor hinterlässt.
Bild:Tinymce34.png Mit dem HTML-Icon können Sie direkt den Quelltext Ihrer Webseite bearbeiten, um beispielsweise Code einzufügen (z.B. von Youtube, Google Maps etc.) oder Formatierungen manuell anzupassen.
Bild:Tinymce53.png Formatierung löschen.
Bild:Tinymce63.png Text von links nach rechts.
Bild:Tinymce64.png Text von rechts nach links.

Verwandte Themen

War diese Erläuterung hilfreich / nicht hilfreich? Danke für die Rückmeldung!