Template-Gestaltung

Schritt 1 - Allgemeine Einstellungen >

Template-Gestaltung

Previous pageReturn to chapter overviewNext page
Versteckten Text zeigen/verstecken

Nachdem Sie sich dafür entschieden haben, an einer vordefinierten Vorlage, einer eigenen Vorlage oder einer neuen Vorlage zu arbeiten, über das Fenster Auswahl des Templates und nachdem Sie den Template-Stil festgelegt haben, können Sie dank der in diesem Fenster angebotenen Funktionen die Vorlage selbst noch weiter anpassen, indem Sie zum Beispiel am Header oder an der Fußzeile arbeiten und Texte, Bilder, Flash-Animationen, Slideshows, HTML-Code, Suchfelder und Links hinzufügen.

Die verfügbaren Schaltflächen für die Gestaltung des Header und der Fußzeile sind identisch.

In den Bereichen Header oder Fußzeile ist als Hintergrund eine Flash-Animation eingefügt, die unter Template-Gestaltung nicht verändert werden kann.

Klicken Sie um zu erweitern/minimierenAnleitung: Aufbau des Vorlagen-Editors

Das Fenster Template-Gestaltung enthält einen Grafik-Editor, in dem unter der Werkzeugleiste automatisch das Hintergrundbild des Headers oder der Fußzeile des ausgewählten Templates (vordefinierte oder eigene Vorlage)) angezeigt wird: Das Bild wird im Maßstab 1:1 angezeigt und die Ansicht kann, sofern erforderlich, mit der horizontalen Bildlaufleiste verschoben werden. In diesem Bild werden alle mit den verfügbaren Funktionen vorgenommenen Änderungen in Echtzeit angezeigt.

Gleich unter dem Bild befindet sich eine Statusleiste mit folgenden Daten:

Position: X- und Y-Koordinaten der Position der oberen rechten Ecke des ausgewählten Objekts, in Bezug auf den vom Header oder der Fußzeile eingenommenen Seitenbereich..
Größe: Breite und Höhe des ausgewählten Objekts in Pixeln.

Wenn Struktur der Vorlage definiert wurde, wurde als Menütyp die Option eingestellt. Horizontal - Menü im Header auf dem Bild des Header wird eine graue schraffierte Fläche angezeigt, die den Umrissen des Menüs entspricht. Das Vorhandensein dieser Fläche verhindert die Anordnung anderer Objekte nicht, sie muss aber berücksichtigt werden, um ein unerwünschtes Überlappen der Objekte zu verhindern.

Klicken Sie um zu erweitern/minimierenAnleitung: Die Optionen in der Werkzeugleiste

Mit den Schaltflächen in der Werkzeugleiste können Sie neue Objekte in den Header und die Fußzeile Ihres Templates einfügen und einige Einstellungen vornehmen. Nachdem ein Objekt eingefügt wurde, kann es markiert und mit den Optionen in dem nach dem Objekt benannten Bereich bearbeitet werden.

Ausschneiden [Strg+X] - Kopieren [Strg+C] - Einfügen [Strg+V]

Zum Ausschneiden, Kopieren oder Einfügen des ausgewählten Objekts.

Abbrechen [Strg+Z]

Zum Annullieren der zuletzt durchgeführten Operation.

In den Vordergrund - In den Hintergrund

Mit diesen Funktionen kann das ausgewählte Objekt jeweils in den Vordergrund oder Hintergrund, also über oder unter andere Objekte verschoben werden.

Link zuweisen

Mit dieser Funktion können Sie markierten Text, ein Bild oder ausgewählte Bilder einer Slideshow verlinken. Die Einstellungen für den Hyperlink können Sie im Dialogfenster Link vornehmen.

Position und Größe

In dem sich öffnenden Dialogfenster können Sie die Koordinaten für die Position und die Größe des markierten Objekts festlegen. Die standardmäßig aktivierte Option Größenverhältnis beibehalten bewirkt, dass beim Vergrößern oder Verkleinern die Proportionen des Objekts beibehalten werden.

Text einfügen - Bild einfügen - Flash-Animation einfügen - Slideshow einfügen - HTML-Code einfügen - Suchfeld einfügen

Mit diesen Optionen können Sie die jeweils genannte Funktion ausführen.

Eine Slideshow ist eine Sequenz aus Bildern, die automatisch wiedergegeben wird. Dies eignet sich beispielsweise für die Gestaltung von Werbebannern.

In Form von HTML-Code kann jede Art von Inhalt eingefügt werden. Auf diese Weise haben Sie Möglichkeiten, die über die der Schaltflächen weit hinaus gehen.

Die Suchfunktion nutzt eine interne Suchmaschine, über die der Benutzer in allen Inhalten der Website recherchieren kann.

Flash-Animationen und HTML-Code-Objekte sind nur sichtbar, wenn die Website im Browser geöffnet wird.

Klicken Sie um zu erweitern/minimierenAnleitung: Die Optionen im Bereich Header / Fußzeile

im Tab Header und Fußzeile das Hintergrundbild anklicken, stehen Ihnen in den jeweiligen Bereichen Header / Fußzeile darunter folgende Optionen zur Verfügung:

Bilddatei im Format JPG speichern: Text- und Bildobjekte, die während der Erstellung der Website als Header/Fußzeile eingefügt werden, vereinen sich mit dem verwendeten Hintergrundbild und das Ergebnis wird automatisch als neue Datei im Format PNG gespeichert. Im Format PNG bleiben eventuell eingestellte Transparenzen erhalten. Bestehen keine besonderen Anforderungen im Hinblick auf Transparenzen, können Sie die Option Bilddatei im Format JPG speichern, um die Dateigröße des Hintergrundbildes zu reduzieren.
Klicken Sie um zu erweitern/minimierenAnleitung: Die Optionen im Bereich Text

Wenn Sie ein Text-Objekt markieren, das in den Header oder die Fußzeile eingefügt wurde, stehen im Bereich Text folgende Optionen zur Verfügung:

Inhalt: Geben Sie hier den gewünschten Text ein.
Schriftart: Hier können Sie die Schriftart, den Schriftschnitt und die Schriftgröße in Punkten festlegen.
Textfarbe / Hintergrundfarbe: Hier kann die Text- und die Hintergrundfarbe für den eingegebenen Text festgelegt werden.
Bilddatei im Format PNG speichern: Bei Aktivierung dieser Option wird der eingefügte Text nicht in das Hintergrundbild des Header / der Fußzeile sondern als separate .PNG-Datei mit transparentem Hintergrund gespeichert. In diesem Fall wird der ursprüngliche Text auch automatisch als Alternativtext (ALT text) des .PNG-Datei zugewiesen.
Klicken Sie um zu erweitern/minimierenAnleitung: Die Optionen im Bereich Bild

Wenn Sie ein Bild-Objekt markieren, das in den Header oder die Fußzeile eingefügt wurde, stehen im Bereich Bild folgende Optionen zur Verfügung:

Bilddatei: Pfad zur Bilddatei, die eingefügt werden soll. Sie können Dateien in den Formaten JPG, GIF, PNG, BMP, PSD, TIF, DIB, PCX, RLE, TGA und WMF verwenden.
Bild bei Mauskontakt: Hier können Sie eine zweite, von der ersten verschiedene, Bilddatei auswählen, die bei Kontakt des Mauszeigers eingeblendet wird. Diese Option eignet sich besonders für die Erstellung von Buttons mit Aktiv- und Inaktiv-Status (Mouseover Effekt).
Transparenz aktivieren: Mit dieser Option kann eine bestimmte Farbe im Bild transparent, also unsichtbar gemacht werden.
Transparente Farbe: Mit Klick auf die Schaltfläche können Sie die Farbe festlegen die im Bild unsichtbar sein soll, wenn die Option Transparenz aktivieren gewählt wurde. In diesem Fall ist die Pipettenfunktion besonders nützlich, da die gewünschte Farbe damit direkt aus dem Bild übernommen werden kann.
Toleranz: Hier können Sie für die Transparenz einen Toleranzfaktor festlegen. Je höher der Toleranzwert eingestellt wird, desto größer ist der durchsichtige Bereich des Bildes.
Klicken Sie um zu erweitern/minimierenAnleitung: Die Optionen im Bereich Flash-Animation

Wenn Sie eine Flash-Animation markieren, die in den Header oder die Fußzeile eingefügt wurde, stehen im Bereich Flash-Animation folgende Optionen zur Verfügung:

Animationsdatei: eingefügt wurde, stehen im Bereich Flash-Animation folgende Optionen zur Verfügung:
Transparenter Hintergrund: Mit dieser Option wird der Hintergrund der Animation unsichtbar.
Klicken Sie um zu erweitern/minimierenAnleitung: Die Optionen im Bereich Slideshow

Wenn Sie ein Slideshow-Objekt markieren, das in den Header oder die Fußzeile eingefügt wurde, stehen im Bereich Slideshow folgende Optionen zur Verfügung:

Liste der anzuzeigenden Bilder: Liste der Bilder, aus denen sich die Slideshow zusammensetzt. Von jedem Bild werden der Pfad zur entsprechenden Bilddatei und, sofern vorhanden, der angewendete Effekt und der zugewiesene Link angezeigt. Wenn Sie eine Datei aus der Liste auswählen, wird eine Vorschau angezeigt. Für die Mehrfachauswahl halten Sie auf der Tastatur gleichzeitig zum Klick die Taste Strg oder Umschalt gedrückt.
Hinzufügen... / Entfernen: Mit diesen Schaltflächen können Sie jeweils neue Bilder hinzufügen oder in der Liste für die Slideshow ausgewählte Bilder löschen. Im Dialogfenster Datei auswählen können auch mehrere Bilder gleichzeitig ausgewählt werden.
Nach oben / Nach unten: Mit diesen Schaltflächen können Sie ein in der Liste der anzuzeigenden Bilder ausgewähltes Bild vor oder hinter ein benachbartes verschieben.
Effekt...: Mit dieser Schaltfläche öffnen Sie das Dialogfenster Effekteigenschaften in dem Sie Einblend-, Bewegungs- und Zoom-Effekte für die Fotos in der Liste der anzuzeigenden Bilder definieren können.
Automatische Wiedergabe: Bei Aktivierung dieser Option wird die Slideshow automatisch wiedergegeben.
Zufallsanzeige: Bei Aktivierung dieser Option werden die Bilder der Slideshow nicht wie in der Liste der anzuzeigenden Bilder, sondern in zufälliger Reihenfolge wiedergegeben.
Aufzählungszeichen der Navigation anzeigen: bestimmt, dass bei Slideshow ein grafischer Indikator erscheint, der den Benutzer über die Anzahl oder/und Position der Bilder, aus denen er besteht, informiert.
Cursor-Stil: ist verfügbar, falls die Option Aufzählungszeichen der Navigation anzeigenaktiviert wurde und erlaubt es aus verschiedenen grafischen Sets auszuwählen, um das Aussehen des Indikators festzulegen.
Ausrichtung: ist verfügbar, falls die Option Aufzählungszeichen der Navigation anzeigenaktiviert wurde und erlaubt es, den Indikator an den Bildern der Slideshowauszurichten.
Klicken Sie um zu erweitern/minimierenAnleitung: Die Optionen im Bereich HTML-Code

Wenn Sie ein HTML-Code -Objekt markieren, das in den Header oder die Fußzeile eingefügt wurde, stehen im Bereich HTML-Code folgende Optionen zur Verfügung:

HTML-Code: Geben Sie oder fügen Sie in dieses Feld den HTML-Code des zu erstellenden Objekts ein. In der Werkzeugleiste stehe folgende Optionen zur Verfügung:

Ausschneiden [CTRL+X] - Kopieren [CTRL+C] - Einfügen [CTRL+V]

Ausschneiden, Kopieren und Einfügen von ausgewähltem Text.

Abbrechen [Strg+Z] - Wiederherstellen [ALT+UMSCHALT+BACKSPACE]

Zum Annullieren/Wiederherstellen der zuletzt durchgeführten/annullierten Operation.

Widgets einfügen

Fügt den Code des ausgewählten Widgets ein: Klicken Sie auf den Pfeil neben der Schaltfläche, um die Liste aller verfügbaren Widgets.

Bildlaufleisten anzeigen: aktiviert die Anzeige der Scrollbars.
Klicken Sie um zu erweitern/minimierenAnleitung: Die Optionen im Bereich Suchfeld

Wenn Sie ein Suchfeld markieren, das in den Header oder die Fußzeile eingefügt wurde, stehen im Bereich Suchfeld folgende Optionen zur Verfügung:

Button-Beschriftung: Geben Sie hier die gewünschte Beschriftung für den Such-Button ein.
Schriftart: Legen Sie die Schriftart, den Schriftschnitt und die Schriftgröße in Punkten fest.
Feldfarben: Legen Sie die Text- und die Hintergrundfarbe für das Suchfeld fest.
Buttonfarben: Legen Sie die Text- und die Hintergrundfarbe für den Button fest.

Wenn Sie in den Header / die Fußzeile Ihres Templates ein Suchfeld einfügen, wird automatisch die Spezialseite „Suche“ in die Sitemaps eingefügt. Sie können diese Seite auswählen und das Fenster Eigenschaften der Seite öffnen, um die Haupteigenschaften festzulegen.
Die Ergebnisse der über die Website durchgeführten Suche erscheinen auf Seiten, die automatisch vom Programm erstellt werden. Die grafische Gestaltung dieser Seiten richtet sich nach den Einstellungen für den Textstil (siehe Textstil im Schritt 1 - Template-Stil).
Klicken Sie um zu erweitern/minimierenAnleitung: Die Optionen im Bereich Effekte

Wenn Sie ein Objekt vom Typ Text,  Bild oder Slideshow auswählen, das in den Header oder die Fußzeile eingefügt wurde, stehen Ihnen im Bereich Effekte folgende Optionen zur Verfügung:

Effekttyp: Hier können Sie einen oder mehrere Effekte auswählen und aktivieren, die auf das markierte Objekt angewendet werden sollen.

Auf jedes Text-, Bild- oder Slideshow-Objekt können auch mehrere Effekte gleichzeitig angewendet werden und jeder der Effekte ist individuell konfigurierbar:

Effekt

Einstellungen

Schatten

 

 

Diffusion: Hiermit können Sie die Breite des Schattens festlegen.
Farbe: Im Dialogfenster Farbe können Sie aus der Farbpalette die Farbe des Schattens auswählen.
Abstand X / Abstand Y: Hier legen Sie fest, wie weit der Schatten horizontal bzw. vertikal zum Objekt verschoben dargestellt werden soll. Bei Eingabe eines positiven Wertes, wird der Schatten nach rechts bzw. unten verschoben, bei Eingabe eines negativen Wertes entsprechend nach links bzw. oben.

Spiegelung

 

Diffusion: definieren Sie hier die Breite der anzuwendenden Spiegelung.
Abstand: Hier können Sie festlegen, wie weit die Spiegelung vom Objekt entfernt sein soll.

Farbiger Rand

 

Breite: Breite des anzuwendenden Rahmen
Farbe: Im Dialogfenster Farbe können Sie aus der Farbpalette die Farbe des anzuwendenden Rahmens auswählen.

Äußerer Glanz

 

Diffusion: Breite des Glanzeffekts.
Farbe: Im Dialogfenster Farbe können Sie aus der Farbpalette die Farbe des Glanzeffekts auswählen..

Plastischer Rand

 

 

Tiefe: Legen Sie hier fest, wie tief der plastische Effekt sein soll.
Diffusion: Breite des plastischen Randes
Winkel: Definieren Sie hier den Winkel des plastischen Randes.

Drehung

Winkel: Hier können Sie festlegen, um welchen Winkel (im Uhrzeigersinn) das Objekt gedreht werden soll.

Deckkraft

Deckkraft: Mit einem Wert von 0 bis 255 können Sie die Deckkraft des Bildes verändern. Je näher der Wert an 0 liegt, desto geringer ist die Deckkraft und desto transparenter wird das Bild.

Weichzeichnung

Diffusion: Intensität der Weichzeichnung.

Welle

 

Diffusion: Definieren Sie hier die Breite des Welleneffekts.
Häufigkeit: Legen Sie hier fest, wie häufig der Welleneffekt wiederkehren soll

Perspektive

 

Horizontal: Einstellung des horizontalen Fluchtwinkels für den Effekt der Perspektive nach rechts (positive Werte) bzw. nach links (negative Werte).
Vertikal: Einstellung des vertikalen Fluchtwinkels für den Effekt der Perspektive nach unten (positive Werte) bzw. nach oben (negative Werte).

Verzerrung

 

Horizontal: Einstellung des Punktes, zu dem die Verzerrung auf horizontaler Ebene nach rechts (positive Werte) bzw. nach links (negative Werte) erfolgen soll.
Vertikal: Einstellung des Punktes, zu dem die Verzerrung auf vertikaler Ebene nach unten (positive Werte) bzw. nach oben (negative Werte) erfolgen soll.

 

 


Praktische Anwendung:

-

Die Arbeit mit Vorlagen

-

Wo finde ich neue Vorlagen für WebSite X5 ?


Zusatzinformationen:

-

Funktionsprinzip der internen Suchmaschine von WebSite X5