Kontakt · Referenzen · Impressum
Home

 

 

  Handbuch SWE

Sie befinden sich in der Online Hilfe von SmartWebRedaktion.

 

Übersicht


Der Editor


Der Webexplorer


FTP Upload


Arbeitsschritte

 
   

KeySeven Support > Produkthandbücher > SmartWebRedaktion - Der Editor

 
   
 

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.

Eine Webseite zur Bearbeitung in den browsergestützten Editor geladen.

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:

  1. Eine Sprungmarke
  2. 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.

 

 
     
 
 
 

 

 

Home | Leistungen | Technologie | Produkte | Support |