| INHALT | ||
1 Einführung |
||
| 1.1 Willkommen | ||
| 1.2 Vor dem Start | ||
| 1.3 Arbeiten mit SWE | ||
| 1.4 Funktionen | ||
2 Erste Schritte |
||
| 2.1 Themen im Kapitel Erste Schritte | ||
| 2.2 Zugang zum Editor | ||
| 2.3 Datei Auswählen | ||
| 2.4 Datei zum Bearbeiten Öffnen | ||
| 2.5 Seite bearbeiten - Text | ||
| 2.6 Seite bearbeiten - vorformatierte Elemente (bspw. Links) | ||
3 Der Webexplorer |
||
| 3.1 Übersicht Webexplorer | ||
| 3.2 Ordner umbenennen | ||
| 3.3 Ordner löschen | ||
| 3.4 Datei-Upload | ||
| 3.5 Sicherungskopie | ||
4 Der Editor |
||
| 4.1 Themen im Hilfebereich Editor | ||
| 4.2 Übersicht | ||
| 4.3 Schaltflächen | ||
| 4.4 Kontextmenü | ||
| 4.5 Tastaturkürzel (Shortcuts) | ||
| 4.6 Sprungmarken Menü | ||
5 Nutzungsbedingungen |
||
| 5.1 Bitte sorgfältig lesen | ||
| 1 Einführung | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| 1.1 Willkommen | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Herzlich Willkommen in Ihrer SmartWebRedaktion Hilfe! Wir freuen uns, dass Sie sich für ein Produkt von KeySeven entschieden haben und wünschen Ihnen erfolgreiches Arbeiten mit Ihrem neuen SmartWebEditor. Sollte es einmal Probleme geben, schauen Sie bitte zunächst in dieser Hilfe nach einer Lösung. Sollten Sie hier wider Erwarten keine Lösung finden, wenden Sie sich einfach per mail an uns. PS: Diese Hilfe wird bequem mit SmartHelper erstellt und gepflegt! |
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 1.2 Vor dem Start | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Bitte beachten Sie unbedingt diese Hinweise, sie sind für die störungsfreie Arbeit mit SWE grundlegend! | ||||||||||||||||||||||||||||||||||||||||||||||||||||
|
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 1.3 Arbeiten mit SWE | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Lesen Sie hier übersichtsartig, wie der SmartWebEditor funktioniert. | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Mit dem SmartWebEditor (SWE) bearbeiten Sie Ihre Webseiten direkt dort, wo sie gebraucht werden: Auf Ihrem Webspace. Das Programm startet mit einer Ansicht aller Dateien und Ordner, die sich auf Ihrem Webspace befinden (der Webexplorer). Sie wählen durch Klick die Datei aus, die Sie bearbeiten möchten. Die gewählte Datei wird im Vorschaumodus geöffnet und kann nun von Ihnen aktualisiert werden (der Editor). Neuen Text schreiben Sie z.B. einfach in die Seite hinein oder Sie kopieren einen Text aus einer Anwendung auf Ihrem PC und fügen ihn an die gewünschte Stelle (Copy & Paste). Speichern. Fertig. |
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 1.4 Funktionen | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Die Bearbeitungsfunktionen im Überblick | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| SmartWebEditor ist ein Tool, dessen Funktionen für die einfache Pflege, Änderung und inhaltliche Erweiterung Ihrer vorhandenen Website ausgelegt sind. Sie können damit Ihre Seiten direkt im Browser öffnen und bearbeiten. Dabei stehen im Augenblick folgende Bearbeitungsfunktionen zur Verfügung:
Für HTML-Dateien steht auf Wunsch eine Quelltextansicht zur Verfügung. Hier sind prinzipiell alle denkbaren Änderungen möglich. Diese Funktion sollte ausschliesslich von Profis benutzt werden, da hier die Seite unbrauchbar gemacht werden könnte. Daneben bietet SmartWebEditor die Funktionalität eines FTP-Clients. Sie können also gezielt Dateien (Bilder, Texte, Webseiten) von Ihrem lokalen Rechner in ein beliebiges Verzeichnis auf Ihrem Server kopieren und Dateien auf dem Server löschen.
|
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 2 Erste Schritte | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| 2.1 Themen im Kapitel Erste Schritte | ||||||||||||||||||||||||||||||||||||||||||||||||||||
Folgende Themen finden Sie in diesem Kapitel:
|
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 2.2 Zugang zum Editor | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Wie gelange ich zu meinem SWE? | ||||||||||||||||||||||||||||||||||||||||||||||||||||
Als lizensierter SWE Benutzer haben Sie alle notwendigen Zugangsdaten erhalten. Sie benötigen:
Ihre Anwendung befindet sich üblicherweise in einem Unterverzeichnis Ihrer Website. Um in die Anwendung zu gelangen müssen Sie in Ihrem Browser zunächst die Datei aufrufen, über die Sie sich einloggen können. Falls Sie Probleme beim Login haben sollten:
|
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 2.3 Datei Auswählen | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Bevor Sie mit SWE Änderungen an einer Ihrer Seiten vornehmen können, müssen Sie diese im Editor öffnen. | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Um Ihre Seiten mit SWE zu bearbeiten, sollten Sie wissen, wie die entsprechenden Dateien heissen. Wenn Ihre Website durch KeySeven erstellt wurde, sollten die Dateien auf Ihrem Webspace so benannt sein, dass Sie bereits am Namen erkennen können, welche Datei die gesuchte ist. Falls die Namen nicht eindeutig sein sollten, gehen Sie bitte folgendermassen vor:
|
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 2.4 Datei zum Bearbeiten Öffnen | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Die zu bearbeitende Datei in die Editoransicht laden! | ||||||||||||||||||||||||||||||||||||||||||||||||||||
Nach dem Einloggen gelangen Sie automatisch in den Webexplorer (Website Verwaltung). Hier werden die Dateien Ihrer Website analog zur Darstellung in Ihrem Windows Explorer in Form einer Baumstruktur dargestellt. Klicken Sie nun auf dieses Icon ( ) hinter der entsprechenden Datei, um sie zum Bearbeiten zu Öffnen. (Ist dieses Icon nicht sichtbar, so kann die Datei nicht zur Bearbeitung geöffnet werden: Dateityp von der Bearbeitung ausgeschlossen).Die Datei öffnet sich nun in der eigentlichen Editoransicht. Die Bedeutung der einzelnen Buttons des Editors ist hier erklärt. |
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 2.5 Seite bearbeiten - Text | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Text in der Webseite bearbeiten und formatieren, neuen Text hinzufügen. | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Texte bearbeiten Sie so, wie Sie es aus den meisten Textverarbeitungsprogrammen gewohnt sind: Neue Texte fügen Sie direkt mit Hilfe der Tastatur an der Cursorposition ein, oder Sie nutzen die Möglichkeit, Texte mit Copy and Paste in der Seite abzulegen Um einzelne Buchstaben, Wörter oder ganze Textabschnitte zu formatieren, müssen Sie diese zunächst markieren. Danach wählen Sie die gewünschte Formatierung, die Sie dem markierten Bereich zuordnen wollen, aus der Leiste mit den Schaltflächen oder, soweit möglich, Sie weisen eine Foramtierung per Shortcut zu. Wichtig: Wenn Sie Text direkt aus Textverarbeitungprogrammen wie z.B. Microsoft Word kopieren und in Ihre Datei einfügen, werden neben dem reinen Text noch eine Vielzahl unerwünschter Steuerzeichen u.ä. mit in die Datei übernommen. Dies kann den Quelltext Ihrer Datei schädigen und die Darstellung in bestimmten Browsern beeinträchtigen. Um dies zu verhindern sollten Sie den kopierten Text zunächst in Ihrem System-Editor einfügen, dort erneut markieren und kopieren und erst dann in Ihrer Webseite einfügen. Der System-Editor (Notepad) ist ein Standardprogramm, das Sie üblicherweise über Start / Programme / Zubehör öffnen können. |
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 2.6 Seite bearbeiten - vorformatierte Elemente (bspw. Links) | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Was ist bei der Bearbeitung vorformatierter Textbereiche zu beachten? (Gilt für Hyperlinks, Überschriften und Formatierungen wie Fett, Kursiv, farbiger Text etc.). | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Mit dem Smartwebeditor bearbeiten Sie letztendlich den HTML-Quellcode Ihrer Webseite. Um das Vorgehen beim Bearbeiten bereits formatierter Elemente besser zu verstehen, ist es hilfreich, sich etwas grundlegendes über HTML klar zu machen: HTML besteht aus einer Mischung von Text, der in auch im Code der Seite als Text abgespeichert wird und den sogenannten HTML-Tags, die den jeweiligen Text umschließen und ihm bestimmte Formatierungseigenschaften zuweisen. Dabei ist auch ein Hyperlink im weitesten Sinne als Formatierung zu verstehen, da der entsprechende Tag dem Browser mitteilt, dass a) dieser Text klickbar ist und b) beim Klick auf diesen Text eine bestimmte Internetadresse aufgerufen werden soll. Formatierung und Text bilden also eine Sinneinheit, wenngleich Sie im Quellcode getrennt sind. Praktisch bedeutet das: Wenn Sie einen Link im Editor komplett entfernen (oder präziser gesagt: Einen kompletten Text, dem ein Link zugeordnet ist), so wird der zugehörige Tag, der die Link-Informationen enthält aus der Sicht des Editors obsolet und ebenfalls entfernt. Schreiben Sie nun an der gleichen Stelle neuen Text in die Seite, so wird dieser auch nur als Text dargestellt, solange Sie ihm keinen Link zuweisen (Wie Sie einem Text einen Link zuweisen ist im Kapitel Editor / Schaltflächen beschrieben). Um nur den Text eines formatierten Bereiches auszutauschen, ohne dabei die Formatierungsinformationen zu verlieren, gehen Sie bitte folgendermaßen vor: Entfernen Sie nicht den gesamten (formatierten) Text, sondern lassen Sie zumindest zwei Buchstaben stehen. Schreiben Sie nun Ihren neuen Text zwischen diese beiden Buchstaben. Entfernen Sie danach die nicht mehr benötigten Buchstaben des alten Textes. So stellen Sie sicher, dass zu jeder Zeit der Bearbeitung Text vorhanden ist, auf den sich der Formatierungstag beziehen kann und er nicht automatisch entfernt wird. (Diese Vorgehensweise könnte Ihnen aus Word bekannt sein, wenn Sie dort mit Überschriftenformatierungen arbeiten). |
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 3 Der Webexplorer | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| 3.1 Übersicht Webexplorer | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Alle Funktionen des Webexplorers kurz zusammen gefasst. | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Nach dem Login gelangen Sie auf eine Seite, die Ihnen einen Überblick der Verzeichnisse und Dateien auf Ihrem Webserver gibt. Die Ansicht ist an den Windows-Datei-Explorer angelehnt und wird ganz ähnlich bedient. In der linken Spalte sehen Sie folgende Symbole:
Nach den Symbolen folgen die Namen der Ordner bzw. Dateien, ihre jeweilige Größe (nur bei Dateien) und das Erstelldatum. Rechts neben diesen Angaben folgen Symbole für verschiedene Funktionen, die mit dem Ordner bzw. der Datei durchgeführt werden können.
|
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 3.2 Ordner umbenennen | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Hinweise zu dieser Funktion. | ||||||||||||||||||||||||||||||||||||||||||||||||||||
Diese Funktion sollten Sie bevorzugt für neu angelegte Ordner benutzen. Wenn Sie bereits bestehende Ordner umbenennen, so besteht die Möglichkeit, das Hyperlinks in Ihrer Website nicht mehr funktionieren, da der Pfad nicht mehr korrekt ist. |
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 3.3 Ordner löschen | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Hinweise zu dieser Funktion. | ||||||||||||||||||||||||||||||||||||||||||||||||||||
Aus Sicherheitsgründen wird diese Funktion nur ausgeführt, wenn der Ordner keine Unterordner oder Dateien enthält. Um einen Ordner zu löschen müssen Sie daher zunächst alle untergeordneten Elemente entfernen. |
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 3.4 Datei-Upload | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Hinweise zu dieser Funktion. | ||||||||||||||||||||||||||||||||||||||||||||||||||||
Immer wenn Sie in Ihrer Website neue Dateien hinzufügen möchten, benötigen Sie eine Möglichkeit, diese von Ihrem lokalen Rechner auf den Webserver zu kopieren bzw. zu übertragen. Das können sowohl Bilddateien sein, die Sie in Ihre Website einbinden wollen, als auch Textdateien, die Sie zum Download anbieten möchten oder auch neu erstellte Webseiten, die in Ihr Web integriert werden sollen. Dazu wird im allgemeinen das File Transfer Protokoll verwendet.SmartWebEditor bietet Ihnen hier die notwendige Funktionalität, um dies zu bewerkstelligen ohne dazu eine zusätzliche Software installieren zu müssen. Starten Sie den Upload und folgen Sie dann den Anweisungen des Dialoges. |
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 3.5 Sicherungskopie | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Hinweise zu dieser Funktion. | ||||||||||||||||||||||||||||||||||||||||||||||||||||
Diese Funktion erstellt eine Sicherungskopie, die aufgrund ihres Namens vom System nicht als Webseitendatei erkannt und daher auch nicht zur Bearbeitung angeboten wird.Die Sicherungskopie verwendet den Namen der Originaldatei und hängt an diesen mit Unterstrich das Datum und die Endung .bkm an. Sollten Sie diese Datei aktivieren wollen, so nutzen Sie die Funktion "umbenennen" und entfernen dabei die komplette Endung. |
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 4 Der Editor | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| 4.1 Themen im Hilfebereich Editor | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Folgende Hilfethemen stehen zur Verfügung Versionsinformation: Die Hilfe berücksichtigt die Funktionen der WYSIWYG Oberfläche Version 2.5.2.0.
|
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 4.2 Übersicht | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Grundfunktionen des Editors | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Je nachdem, welches Produkt Sie einsetzen, nutzen Sie den Editor in unterschiedlichen Kontexten. Der Editor ist implementiert in den Produkten:
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: Tastaturkürzel Textbearbeitung
|
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 4.3 Schaltflächen | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Die Schaltflächen dienen zur direkten Formatierung, zum Einfügen von Elementen und zum Aufrufen spezieller Funktionen des Editors. | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| (Lesen Sie auch das Übersichtsthema mit wichtigen Hinweisen) Die Funktionselemente 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.
|
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 4.4 Kontextmenü | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Das Kontextmenü des Editors befindet sich rechts neben der zur Bearbeitung geöffneten Datei. Lesen Sie hier, wie Sie damit Arbeiten. | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| 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
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. |
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 4.5 Tastaturkürzel (Shortcuts) | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Hier finden Sie eine Übersicht der wichtigsten Tastaturkürzel für schnelleres Arbeiten. | ||||||||||||||||||||||||||||||||||||||||||||||||||||
Bitte beachten Sie, dass vor dem Einsatz der Tastaturkürzel der Fokus in die zu bearbeitende Seite bzw. auf das zu bearbeitende Element gesetzt werden muss. Das tun Sie, indem Sie mit der Maus in die Seite klicken, bzw. das Element wie gewohnt markieren.
|
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 4.6 Sprungmarken Menü | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Das Menü ermöglicht die einfache Erstellung und Anzeige von Sprungmarken (Anchors) in Ihrer Webseite und bietet die Möglichkeit bequem einen Hyperlink zu erstellen, der auf eine Sprungmarke verweist. | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Sprungmarken anzeigen lassen, bearbeiten und einfügen
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.
|
||||||||||||||||||||||||||||||||||||||||||||||||||||
| 5 Nutzungsbedingungen | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| 5.1 Bitte sorgfältig lesen | ||||||||||||||||||||||||||||||||||||||||||||||||||||
| Nutzungsbedingungen: Für die Nutzung der Software SmartWebEditor benötigt der Benutzer den Internet Explorer® 6 (mit oder ohne SP1) von Microsoft® als Browser. KeySeven kann keine Gewährleistung übernehmen, dass SmartWebEditor auch mit zukünftigen Versionen und Service-Packs dieses Browsers noch funktioniert bzw. vollständig funktioniert. Ansonsten gelten die Bedingungen des Softwareüberlasungsvertrages. |
||||||||||||||||||||||||||||||||||||||||||||||||||||