| |
 |
Neu: Unsere Produktseiten für Kunden und Partner auf www.smartwebredaktion.de |
|
| |
Lernen Sie unser Produkt SmartWebRedaktion und seine vielseitigen Einsatzmöglichkeiten jetzt kennen. |
| |
 |
Themen auf dieser Seite |
|
| |
Der Editor (Übersicht)
Hier finden Sie eine kurze Zusammenfassung, wie Sie mit dem Editor arbeiten
Der Editor (Kontextmenü)
Hier finden Sie eine Übersicht über die umfangreichen Möglichkeiten, Ihre Seite mit dem komfortablen Kontextmenü zu bearbeiten.
Der Editor (Formatierungs- und Funtionsschaltflächen)
Hier finden Sie eine Liste aller verfügbaren Schaltflächen für die WYSIWYG Bearbeitung Ihrer Webseite
Der Editor (Sprungmarkenmenü)
Hier finden Sie eine Anleitung, wie Sie Sprungmarken in Ihrer Seite bearbeiten können
|
|
| |
 |
Der Editor (Übersicht) |
|
| |
Je nachdem, welches Produkt Sie einsetzen, nutzen Sie den Editor in unterschiedlichen Kontexten. Der Editor ist implementiert in den Produkten:
- SmartWebEditor
- SmartWebRedaktion
- SmartNews
Die Bearbeitung erfolgt dabei immer nach dem gleichen Schema und mit der gleichen Oberfläche, die sich in die hier dargestellten Bereiche gliedert.

Wenn Sie im Webexplorer eine Datei zur Bearbeitung ausgewählt haben, wird diese automatisch im Editorfenster geöffnet. Hier sehen Sie die Datei so, wie sie auch in Ihrem Browser dargestellt wird, wenn Sie Ihre Website ganz normal öffnen. Der einzige Unterschied besteht darin, dass der Editor beim Start das Dokument in der Strukturansicht lädt, also die vorhandenen Tabellen im Dokument hervorhebt. Nach dem Öffnen ist Ihre Datei sofort bereit zur Bearbeitung.
Sie können nun mit der Maus an jede Stelle der Seite klicken und über Ihre Tastatur beliebige Eingaben machen. Neuen Text können Sie entweder direkt eintippen oder aus anderen Anwendungen kopieren und einfügen. Dazu können Sie auch Tastaturkürzel verwenden.
Für die Bearbeitung der Eigenschaften eines bestimmten HTML-Elements, starten Sie das Kontextmenü durch Klick mit der rechten Maustaste an der entsprechenden Stelle Ihres Dokuments. Das Element wird dann -soweit möglich- mit einem farbigen Hintergrund hervorgehoben und das Kontextmenü bietet Ihnen die gängigsten Eigenschaften des HTML-Elements zur Bearbeitung an.
Weiterführende Informationen:
|
|
| |
 |
Der Editor (Schaltflächen) |
|
| |
Die speziellen Funktionen des Editors
Die Schaltflächen des Editors nutzen Sie folgendermaßen:
Um einem Bereich eine Formatierung zuzuweisen oder eine Formatierung zu entfernen, markieren Sie
Ihn mit der Maus und klicken dann auf den entsprechenden Button des Editors.
Um ein Element (bspw. einen Absatz oder ein Bild) einzufügen, klicken Sie mit der Maus an die
entsprechende Stelle in der Seite und wählen dann den entsprechenden Button des Editors.
Ein Link benötigt immer ein sichtbares Element auf Ihrer Seite, das der Benutzer später klicken
kann. Um einen Link einzufügen müssen Sie also einen Text oder ein Bild markieren und dann den
entsprechenden Button wählen.
|
Ein- und Ausschalten der Layoutansicht. Hier werden alle Tabellen und Tabellenzellen der Seite mit Rahmen angezeigt, sodass Sie die Struktur der Seite sehen können. Die Funktion ändert nichts am Quellcode Ihrer Datei und die Ansicht wird beim Speichern nicht übernommen. |
 |
Änderungen speichern. Diese Funktion speichert Ihre Änderungen an der gerade geöffneten Datei. Ist die Datei online, so ist die Änderung nach dem Speichern ebenfalls sofort online. Um eine Bearbeitungsversion zu erstellen wählen Sie bitte die Funktion "Kopie speichern". |
 |
Kopie Speichern. Die Funktion legt eine neue Datei mit dem Namen Kopie_[bisherigerDateiname] an. Bitte beachten Sie, dass Sie weiterhin mit der Originaldatei arbeiten. Die neu erstellte Kopie, können Sie über den Webexplorer zur Bearbeitung aufrufen.
Die Funktion eignet sich besonders gut, um eine Bearbeitungsversion anzulegen, die für den Webbesucher nicht sichtbar ist und erst zu einem späteren Zeitpunkt veröffentlicht werden soll. |
 |
Bild einfügen. Fügt ein Bild an der Cursorposition ein. Stellen Sie bitte sicher, dass Sie vor Aufruf des Menüs an die gewünschte Position im Editorfenster geklickt haben. Das Bild können Sie nach dem Einfügen per Drag and Drop auch an andere Positionen verschieben. Im Menü können Sie ein beliebiges Bild aus Ihrem Image Verzeichnis auswählen. Um Bilder einfügen zu können, müssen Sie diese vorher auf Ihren Webserver uploaden. |
 |
Hyperlink einfügen. Setzt einen Hyperlink auf ein markiertes Element oder bearbeitet einen vorhandenen Hyperlink. Sie können zwischen verschiedenen Linkktypen wählen:
- HTTP - Wählen Sie diesen Typ, um auf eine andere Website zu verlinken.
- mailto - Wählen Sie diesen Typ, um eine Emailadresse einzugeben, an die eine Nachricht verschickt werden soll.
- anderer - Wählen Sie diesen Typ, um einen relativen Link anzulegen, oder um auf ein Sprungmarkenziel innerhalb der Seite zu verweisen. Notieren Sie für die Verknüpfung mit einer Sprungmarke als Link #[Sprungmarkennamen] also bspw. #Ziel1.
|
 |
Hyperlink entfernen. Entfernt einen vorhandenen Link an der Cursorposition. |
|
Download-Link einfügen. Fügt einen Downloadlink ein. Markieren Sie dazu zunächst einen Text oder ein Element in Ihrem HTML-Dokument und starten Sie dann diese Funktion mit der Sie eine Datei auf Ihrem Webspace per Klick auswählen können. |
 |
Markierte Elemente werden gelöscht. Sie können dazu auch die "Entfernen" Taste Ihrer Tastatur benutzen. |
 |
Die letzte(n) Aktion(en) werden Klick für Klick rückgängig gemacht. |
 |
Markierter Text wird fett formatiert. |
 |
Markierter Text wird kursiv formatiert. |
 |
Markierter Text wird unterstrichen formatiert. |
 |
Markierte Elemente werden linksbündig ausgerichtet. |
 |
Markierte Elemente werden rechtsbündig ausgerichtet. |
 |
Markierte Elemente werden zentriert ausgerichtet. |
 |
Markierte Elemente werden mit einer Hintergrundfarbe versehen. Diese können Sie bequem aus einer Farbpalette auswählen. |
 |
Markierter Text wird mt einer Farbe versehen (Schriftfarbe). Diese können Sie bequem aus einer Farbpalette auswählen. |
 |
Alle Formatierungen für einen markierten Bereich werden entfernt. |
 |
Fügt an der Cursor-Position einen neuen Absatz ein. Sie können einen Absatz aber auch wie gewohnt durch drücken der Enter-Taste einfügen. Um lediglich einen Zeilenumbruch einzufügen, benutzen Sie die Tastenkombination Shift + Enter |
 |
Markierte Elemente werden nach links eingerückt. |
 |
Markierte Elemente werden nach rechts eingerückt. |
 |
Fügt an der Cursorposition eine ungeordnete Liste (Aufzählungszeichen) ein. |
 |
Fügt an der Cursorposition eine geordnete Liste (Nummeriert) ein. |
 |
Fügt an der Cursorposition eine horizontale Linie ein. |
|
|
| |
 |
Der Editor Kontextmenü |
|
| |
Das Kontextmenü bietet Ihnen die Möglichkeit, umfangreiche Formatierungen und Änderungen an Ihrer Webseite vorzunehmen.
Lesen Sie daher bitte diesen Abschnitt besonders sorgfältig, bevor Sie dieses Tool nutzen.
Änderungen, die Sie hier vornehmen, können nicht über die "Undo"-Schaltfläche zurück genommen werden, sondern müssen -falls erforderlich- wiederum über das Kontextmenü korrigiert werden. Wenn Sie sich bei der Bearbeitung noch nicht sicher sind, empfehlen wir daher zunächst eine Sicherungskopie mit der der Funktion "Kopie speichern" zu erstellen, die Sie im Zweifelsfalle mit zwei Klicks wieder laden können.
Ein Element auswählen
Klicken Sie wie gewohnt mit der linken Maustaste in Ihre zur Bearbeitung geöffnete Datei. Der Editor zeigt Ihnen dann in der Statuszeile an, auf welchem HTML-Element (Tag) Sie sich befinden. Das gewählte Element wird -soweit möglich- mit einem farbig gestrichelten Rahmen angezeigt.
Beim Klick in die Seite wird gleichzeitig das Kontextmenü für das entsprechende HTML-Element angezeigt. Das Menü besteht normalerweise aus 2, beim Element "Tabelle" aus 3 Abschnitten. Gleichzeitig wird das gewählte Element in der geöffneten Datei farbig hinterlegt.
Kopfbereich Kontextmenü
In der Kopfzeile ganz rechts zeigt Ihnen das Menü zur Sicherheit nochmals an, welches Element Sie gerade bearbeiten. Links werden die diesem Element übergeordneten Elemente (Eltern-Elemente) als Link angezeigt. Sie können diese Links klicken, um den Bearbeitungsfokus direkt auf das entsprechende übergeordnete Element zu versetzen. Nutzen Sie diese Funktion insbesondere um Elemente zur Bearbeitung auszuwählen, die Sie nicht per Mausklick markieren können.
Mittlerer Bereich des Kontextmenüs (Eigenschafteswerte setzen)
Je nachdem, welches Element Sie gewählt haben, können Sie in diesem Bereich dessen Eigenschaften bestimmen. Dabei stehen Ihnen unsere Kombi-Eingabefelder zur Verfügung, die es Ihnen ermöglichen zwischen freier Eingabe von Werten und einer Vorauswahl an möglichen Standardwerten zu wechseln.
Referenz Menüwerte
| Bezeichnung |
Vorauswahl |
Erläuterung |
| Adresse |
Alle im Dokument bereits vorhandenen Adressen |
Legt die Zieladresse einer Verknüpfung fest (meist Hyperlink) |
| Quelle |
Alle im Dokument bereits vorhandenen Quellen |
Nur Bild. Legt den Pfad zu einer Bildquelle fest. |
| Rahmen |
Standardwerte |
Gibt die Rahmendicke eines Elements an. 0 = kein Rahmen. |
| Breite |
Standardwerte |
Legt die Breite eines Elements in Pixel fest. |
| Höhe |
Standardwerte |
Legt die Höhe eines Elements in Pixel fest. |
| Padding |
Standardwerte |
Nur Tabelle. Legt den Abstand zwischen Zellenrand und Zelleninhalt in Pixeln fest. |
| Spacing |
Standardwerte |
Nur Tabelle. Legt den Abstand der Zellen untereinander in Pixeln fest. |
| Ausrichtung X |
Standardwerte |
Legt die horizontale Ausrichtung eines Elements bezogen auf das übergeordnete Element fest. |
| Ausrichtung Y |
Standardwerte |
Nur Tabellenzelle (TD). Legt die vertikale Ausrichtung des Zelleninhaltes fest. |
| Hg. Farbe |
Farbpalette |
Legt die Hintergrundfarbe eines Elements fest. |
| Klasse |
Alle im Dokument für dieses Element bereits vorhandenen Klassen |
Ordnet dem Element die Eigenschaften einer bestimmten Formatvorlage (Klasse) zu. |
| Unterstr. |
Standardwerte |
Ordnet dem Text innerhalb eines Elements verschiedene Arten von Untersteichungen zu. |
Ist das gewählte Element eine Tabelle (Table), so stehen am Ende des Menüs zusätzlich die Funktionen zum Entfernen / Hizufügen von Spalten und Reihen zur Verfügung.
Bitte beachten Sie, dass beim Entfernen von Spalten und Reihen einer Tabelle auch deren Inhalte entfernt werden.
|
|
| |
|
|
 |
Der Editor - Sprungmarkenmenü |
|
| |
Sprungmarken anzeigen lassen, bearbeiten und einfügen
Um innerhalb Ihrer Webseite Links benutzen zu können, mit denen der Benutzer an eine andere Stelle Ihrer Seite springen kann (bspw. bei langen Texten zurück an den Anfang der Seite), benötigen Sie sogenannte Sprungmarken.
Dabei stellt jede Sprungmarke ein Ziel innerhalb Ihres Dokumentes dar, an das Sie mittels eines Hyperlinks springen können. Sie benötigen also für diese Funktionalität:
- Eine Sprungmarke
- Einen Hyperlink, der auf diese Sprungmarke verweist
Sprungmarken sind in der normalen Browseranischt in der Regel nicht sichtbar. Das Menü bietet Ihnen daher die Möglichkeit, vorhandene Sprungmarken im Dokument sichtbar zu machen.

|
Die Anzeigefunktion zeigt die Sprungmarken im Dokument an. Ist die Funktion aktiviert ( ), so wird jede im Dokument gefundene Sprungmarke mit dem Sprungmarkensymbol ( ) im Dokument angezeigt. Um die Sprungmarken wieder zu verbergen, klicken Sie bitte den Anzeige-Button erneut.
Während der Anzeigemodus aktiv ist, können Sie den Namen der jeweiligen Sprungmarke sehen, indem Sie einfach mit der Maus über das Sprungmarkensymbol ( ) fahren. Der Name wird dann eingeblendet.
Tipp: Die markierten Sprungmarken können Sie mit der Maus einfach an eine andere Stelle des Dokuments ziehen.
|
 |
Erzeugt eine Sprungmarke an der aktuellen Cursorposition (es darf kein Bild oder Text markiert sein). Den gewünschten Namen können Sie in der Dialogbox angeben, die sich bei Klick auf diesen Button öffnet. Wird die Sprungmarke eingefügt, so schaltet sich -falls nicht ohnehin schon aktiviert- automatisch die Anzeigefunktion ein. Sie sollten die neue Sprungmarke dann sofort sehen.
Tipp: Die erzeugten Sprungmarken sind später in der Browseransicht komplett unsichtbar und erzeugen keinen Umbruch und keine Einrückung. Sie können die Sprungmarke also ruhig auch am Beginn einer Zeile o.ä. einfügen.
|
 |
Erzeugt einen Hyperlink auf einem markierten Bild oder Text, der wenn er später geklickt wird, die aktuelle Seite an die Position einer ausgewählten Sprungmarke in Ihrer Seite scrollt (Bspw. ein Link am Seitenende: Nach oben).
Die Sprungmarke zu der gescrollt werden soll können Sie in der Dialogbox angeben, die sich bei Klick auf diesen Button öffnet. Hier werden Ihnen alle bereits vorhandenen Sprungamrken im aktuellen Dokument zur Auswahl angeboten.
|
 |
Entfernt ein Sprungmarkenziel. Im Anzeigemodus kann die hervorgehobene Sprungmarke ( ) auch durch Klick markiert und direkt mit dem Entfernen Button des Editors bzw. Ihrer Tastatur gelöscht werden. |
|
|
| |
|
|
| |
| |