HTML-Editor

Allgemeines

Der HTML-Editor ist ein WYSIWYG-Editor (Erklärung unten), mit dem Sie HTML-Bereiche designen können. Dabei ist es wichtig daran zu denken, dass Sie in aller Regel keine eigenständige HTML-Seite bearbeiten, sondern Teilstücke, die innerhalb des Mauve Shopsystems angezeigt werden. Deshalb speichert der Editor Angaben, die außerhalb der <body>...</body> Tags gemacht werden nicht.

An den folgenden Stellen in Mauve System3 ist es möglich, Texte mit dem HTML Editor zu bearbeiten:

(WYSIWYG = What You See Is What You Get. Es bedeutet, dass die Bearbeitungen des Textes und des Designs genau so übernommen werden, wie man sie im Editor sieht.)

Links

Um einen Link zu erstellen gehen Sie wie folgt vor:

Markieren Sie das Wort oder das Element, das Sie mit einem Link versehen wollen.
Klicken Sie auf das Icon Hyperlink.
Im Hyperlink Editor müssen Sie mindestens in der URL-Box die Adresse der Website angeben, auf die der Link verweisen soll.
Optional können Sie auch Angaben machen, ob der Link in einem neuen Fenster geöffnet werden soll (Target: _blank).

Um einen Link zu entfernen gehen Sie wie folgt vor:

Markieren Sie den zu löschenden Link.
Klicken Sie das Link-Icon an.
Klicken innerhalb des Dialogs unten links den Button Remove Link an.

Mit einem Klick auf Check URL können Sie die angegebene Adresse überprüfen. Diese wird in Ihrem Standard-Browser aufgerufen.

Bild einfügen

Um ein Bild einzufügen gehen Sie wie folgt vor:

Setzen Sie den Cursor (Mauszeiger) an die gewünschte Stelle, an der das Bild eingefügt werden soll.
Wenn Sie ein bereits auf den Mauve Webserver hochgeladenes Bild einfügen möchten, klicken Sie auf das Icon Bild einfügen. Es wird der Dialog Dokument hinzufügen angezeigt. Wählen Sie dort das einzufügende Dokument aus und Klicken Sie auf OK.
Wenn Sie ein Bild aus einer anderen Quelle einfügen möchten, klicken Sie auf den Pfeil neben dem Icon Bild einfügen und wählen Sie Bild aus Web einfügen aus. Geben Sie im erscheinenden Dialog Bild vom Web einfügen die entsprechende URL ein.

Um die Eigenschaften eines eingefügten Bildes zu ändern

Markieren Sie das Bild, und rufen per Rechtsklick das Kontextmenü auf.
Wählen Sie dort den Menüpunkt Bild Eigenschaften aus.
In diesem können Sie z.B. die Größe ändern.

Tabellen

Zum Einfügen einer Tabelle setzen Sie den Cursor (Mauszeiger) an die gewünschte Stelle, an dem die Tabelle eingefügt werden soll. Über das Tabellen Icon haben Sie die Möglichkeit, in einem Raster auszuwählen, wieviele Zeilen und Spalten die Tabelle haben soll.

Die Anzahl der Zeilen und Spalten kann auch im nachhinein geändert werden. Dazu klicken Sie die Tabelle mit der rechten Maustaste an und wählen in dem Menü die gewünschte Option.

Die Breite der einzelnen Spalten passt sich an den Inhalt der Zellen an. Dies können Sie verhindern, in dem Sie in dem Kontextmenü der Tabelle die Option "Statische Tabelle" auswählen. Danach erhalten zunächst alle Spalten die gleiche Breite. Sie können die Breite der Spalten verändern, indem Sie bei gedrückter linker Maustaste die entsprechenden Rahmen der Tabelle nach links und rechts verschieben.

Erweiterte Funktionen

Durch Klick auf den Button öffnen Sie das HTML-Dokument im Expertenmodus.

Im oberen Bereich finden Sie eine Reihe weiterer Möglichkeiten zur Textformatierung. Bewegen Sie einfach den Mauspfeil über den jeweiligen Button, um Infos über dessen Funktion zu erhalten.

Unterhalb des Textfensters finden Sie die Leiste .
- Bearbeiten (linkes Symbol) Die HTML-Seite wird im WYSIWYG-Editor angezeigt und kann dort bearbeitet werden
- HTML (mittleres Symbol) Die HTML-Seite wird im Quelltext angezeigt. Dort können Sie den HTML-Quelltext direkt bearbeiten. Beachten Sie, dass falsche Eingaben hier gravierende Konsequenzen haben könn, bis dahin, das der komplette HTML-Bereich nicht mehr angezeigt werden kann. Um in diesem Bereich Änderungen vorzunehmen sind XHTML-Kenntnisse zwingend erforderlich. Beachten Sie bitte auch die Hinweise zu Java-Script.
- Vorschau (rechtes Symbol) Der HTML-Text wird in einem Vorschau-Fenster angezeigt. Verwendet wird hierfür der aktuell auf dem jeweiligen System installierte Internet Explorer.

Änderungen im Bearbeiten-Modus werden sofort in den HTML Quelltext übernommen, Änderungen an dem HTML Quelltext finden sich ohne weitere Aktion auch im Bearbeiten Fenster.

Übername formatierter Texte aus Fremdprogrammen

Sie können formatierte Texte aus Fremdprogrammen übernehmen, es besteht dabei aber immer das Risiko, dass Zeichen eingefügt werden, die die Darstellung der Webseite auf bestimmten Browser-Varianten stören.
Deshalb kann es wenn Sie formatierte Texte, z.B. aus Microsoft Word oder aus Webseiten, in den HTML-Editor kopieren, zu einer fehlerhaften Darstellung der Inhalte im Webshop kommen. Um dies rückgängig zu machen, drücken Sie Strg + A (alles auswählen) und entfernen Sie den Inhalt. Speichern Sie Ihren Text in einem Texteditor zwischen, wodurch alle Formatierungen entfernt werden. Sie können den Text nun erneut markieren, kopieren und in den HTML-Editor einfügen.

Falls die Shop-Darstellung danach immer noch fehlerhaft sein sollte, überprüfen Sie den Quelltext auf fehlerhafte/unsinnige Texteinträge.

Hinweise zu Java-Script

Im HTML-Editor bearbeiten Sie in aller Regel keine eigenständige HTML-Seite, sondern Teilstücke, die innerhalb des Mauve Shopsystems angezeigt werden. Deshalb speichert der Editor Angaben, die außerhalb der <body>...</body> Tags gemacht werden nicht.
Wenn Sie also Javascript in den Header-Bereich schreiben wird dieses nicht gespeichert. Damit Javascript mitgespeichert wird, bringen Sie dieses am besten direkt nach dem öffnenden <body>-Tag unter.

Drucken

Aktuell unterstützt der HTML-Editor keinen Druck von gerenderten Seiten. Alternativ kann aber das Windows Snipping Tool oder ein anderes Programm zum Erstellen von Screenshots genutzt werden, um das Dokument als Bild zu speichern, welches dann gedruckt werden kann. Des Weiteren kann die Druckfunktion des Browser genutzt werden, um HTML-Seiten zu drucken.

Siehe auch: Anwender