Einen neuen SiteStyle erstellen

Transkript

1 Einen neuen SiteStyle erstellen Ein SiteStyle ist eine Sammlung von Grafik- und Textelementen, die auf alle Seiten Ihrer in Corel Website Creator X6 erstellten Website angewendet werden. SiteStyles können jederzeit geändert werden, um das Erscheinungsbild Ihrer Website effizient zu ändern. In diesem Tutorial werden wir einen einfachen SiteStyle erstellen, indem wir Grafikelemente verwenden und geringfügige Textformatänderungen anwenden. Schwierigkeitsgrad: Anfänger Voraussetzung: Style.zip Vorbereitung Öffnen Sie Corel Website Creator X6 und wählen Sie im Menü Datei Neue Site > Leere Site. Geben Sie Ihrer Site den Namen style_tes

2 Schritt 1 Wählen auf der Ansichtsleiste Sie die Designansicht. Schritt 2 Wählen Sie im Styles-Explorer Neuer leerer SiteStyle. Schritt 3 Geben Sie Ihrem neuen SiteStyle den Namen MeinStyle.

3 Schritt 4 Wenden Sie den neuen SiteStyle auf die Site an, indem Sie auf der Ansichtsleiste auf die Schaltfläche Format festlegen klicken. Schritt 5 Wählen Sie das Bannerelement, indem Sie auf den Bannerplatzhalter klicken. Wählen Sie die Schaltfläche Durchsuchen in der Default-Eigenschaftenpalette für das Banner, um ein neues Bannerbild zu wählen. Schritt 6 Suchen Sie die Grafikdatei banner.jpg im Abschnitt Materialien des Tutorials.

4 Schritt 7 Wählen Sie den Standardzustand für die Primäre Navigationsschaltfläche. Wählen Sie die Schaltfläche Durchsuchen in der Default-Eigenschaftenpalette für die Navigation, um eine neue Schaltflächengrafik zu wählen. Schritt 8 Suchen Sie die Bilddatei p_regular.jpg im Abschnitt Materialien des Tutorials. Schritt 9 Wiederholen Sie diese Schritte für die restlichen verfügbaren Zustände anhand der folgenden Matrix: Standard-Rollover p_regularover.jpg Hervorgehoben p_highlighted.jpg Hervorgehobenes p_highlightedover.jpg Aktualisieren Sie außerdem die Grafiken für die sekundäre Navigationsleiste. Befolgen Sie dazu die oben genannten Schritte und verwenden Sie die folgende Matrix: Standard s_regular.gif Standard-Rollover s_regularover. gif Hervorgehoben s_highlighted. gif Hervorgehobenes Rollover s_highlightedover. gif

5 Schritt 10 Wählen Sie nun das Element Seiten-Hintergrund. Schritt 11 Wählen Sie auf der Palette Seiten-Hintergrund-Eigenschaften die Schaltfläche Durchsuchen und wählen Sie die Grafikdatei Background.jpg im Abschnitt Materialien des Tutorials. Schritt 12 Als nächsten wählen Sie das Datenlisten-Icon.

6 Schritt 13 Wählen Sie auf der Palette Datenlisten-Icon-Eigenschaften die Schaltfläche Durchsuchen und wählen Sie die Grafikdatei dataicon.gif im Abschnitt Materialien des Tutorials. Schritt 14 Wählen Sie nun das Element Style-Linie.

7 Schritt 15 Wählen Sie auf der Palette Style-Linien-Eigenschaften die Schaltfläche Durchsuchen und wählen Sie die Grafikdatei line.gif im Abschnitt Materialien des Tutorials. Tipp: Das Hintergrundbild in unserem Tutorial hat einen Gradienten. Wenn Sie einen neuen leeren SiteStyle erstellen, wir das Hintergrundbild automatisch auf der vertikalen und horizontalen Achse wiederholt. Wir möchten, dass das Bild nur horizontal wiederholt wird. Das lässt sich einfach ändern. Schritt 16 Wählen Sie noch in der Designansicht die Registerkarte Selektoren.

8 Schritt 17 Wählen Sie unter den Optionen für Andere Selektoren das Element BODY. Schritt 18 Wählen Sie unter CSS Standard (ganz rechts) die Registerkarte Hintergrund.

9 Schritt 19 Entfernen Sie die Markierung aus der Option Wiederholen Vertikal. Der neue SiteStyle ist nun fertig. Für jeden SiteStyle stehen mehrere Text- und Grafikoptionen zur Verfügung. Diese können zur individuellen Einstellung bedarfsgemäß geändert werden. Zum Abschluss Sie wissen nun, wie Sie in Corel Website Creator X6 einen einfachen SiteStyle erstellen. Sie können beliebig viele SiteStyles für Ihre Projekte und Websites erstellen.