Zeilenstil Fenster

Schritt 4 - Seiten > Befehle der Werkzeugleiste und Raster >

Zeilenstil Fenster

Previous pageReturn to chapter overviewNext page
Versteckten Text zeigen/verstecken

Mit den Optionen dieses Dialogfensters, das über die Schaltfläche Zeilenstil in der Werkzeugleiste des Layout-Schemas im Fenster Erstellen der Seiten geöffnet wird, können Sie die Grafik einer Zeile, also eines horizontalen Streifens festlegen, auf dem sich eine Gruppe von Objekten auf einer Seite befindet.

Dieses Dialogfenster ist in die folgenden Bereiche gegliedert:

▪Allgemein
▪Full Height
Klicken Sie um zu erweitern/minimierenAnleitung: Funktionen im Bereich Allgemein

Der Bereich enthält:

▪ein Raster, das die Seitenkonfiguration wiedergibt, wie sie im Fenster Erstellen der Seiten festgelegt wurde;
▪eine Werkzeugleiste;
▪die Liste der verfügbaren Optionen.

Markieren Sie die Zeile, die Sie bearbeiten möchten, und formatieren Sie sie mit den verfügbaren Optionen. Die markierte Zeile wird blau dargestellt und ihre Nummer in Fettschrift hervorgehoben.

Neben jeder Zeile sehen Sie einen ausgefüllten Punkt oder leeren Kreis, je nachdem, ob die Zeile bereits konfiguriert wurde oder nicht.

Mehrere aneinander grenzende Zeilen können verbunden werden, um sie identisch zu formatieren. Je nachdem, wie die Objekte im Raster positioniert oder bei responsiven Websites angeordnet sind, können bestimmte Zellen automatisch verbunden werden.

Die obige Werkzeugleiste enthält die folgenden Optionen:

Ausschneiden, Kopieren und Einfügen

Sie können einen Stil aus einer Zeile kopieren oder ausschneiden und auf einer anderen Zeile einfügen. Sie finden diese Befehle auch im Kontextmenü finden, das sich beim Klicken mit der rechten Maustaste auf der Zeile öffnet.

Auf die Breite des Browserfensters erweitern

So können Sie den Stil der Zeile auf der ganzen Breite des Browserfensters erweitern.

Die Zeile, für denen die Funktion Erweitern aktiv ist, sind auf dem Raster des Seitenlayouts einfach zu finden, weil diese breiter als die Spalten der Seite sind. Wenn Sie wieder auf Auf die Breite des Browserfensters erweitern klicken, passt sich die Zeilenbreite an der Seite und nicht mehr am Browserfenster an.

Anker

So können richten Sie einen Anker auf einer Zeile ein. Beim Klicken auf der Pfeile, die neben der Schaltfläche zu finden ist, finden Sie die folgenden Optionen: Anker einfügen..., Bearbeiten... und Entfernen.

Ein Anker ist ein Bezugspunkt, der die Position eines Objekts innerhalb der Seite identifiziert. Anker werden verwendet, um den jeweiligen Objekten oder Zeilen Direktlinks zuzuweisen.

Overlay

Sie können einen farbigen Filter definieren, egal welche Hintergrundoption Sie ausgewählt haben. Im folgenden Fenster finden Sie diese Parameter

▪Farbe: Farbe des Hintergrundfilters.
▪Deckkraft: Deckungsgrad der Filterfarbe. Je kleiner der eingestellte Wert ist, desto geringer wird die Deckkraft des Filters, das heißt, der Zeilenhintergrund wird stärker durchscheinen.
▪Farbübergang aktivieren: Mit dieser Option kann das Overlay des Hintergrundes animiert werden. Diese Animation besteht in einer Farbübergangsschleife von der Anfangsfarbe zur Endfarbe, sofern vorgesehen, über die Zwischenfarbe

Effekt

Einen Parallaxe-Effekt wird für die ausgewählte Zeile aktiviert. Der Parallaxe-Effekte ist eine visuelle Technik, um einen 3D-Tiefeindruck zu schaffen und um Ihr grafisches Layout zu bereichern. Mit diesem Effekt bewegen sich die Bilder mit unterschiedlicher Geschwindigkeit und aus verschiedenen Perspektiven: Dadurch wird das Scrollen der Seite zu einer beeindruckenden Erfahrung für Ihre Besucher.

Sie haben verschiedene Arten von Parallaxe-Effekte zur Verfügung:

▪Parallaxe;
▪Parallaxe umgekehrt;
▪Parallaxe fix.

Der Parallaxe-Effekt basiert sich auf der Bewegung von Bildern mit unterschiedlichen Geschwindigkeiten. Auf diesem Grund kann er auf einem einfarbigen Hintergrund nicht aktiviert werden.

Nachdem Sie die Zeile oder Zeilengruppe, die Sie bearbeiten möchten, markiert haben, können Sie den Hintergrund definieren. Folgende Optionen stehen zur Auswahl:

Farbig: Der Hintergrund der Zeile ist einfarbig.

Verlauf: Der Hintergrund der Zeile wird mit einem Farbverlauf ausgefüllt, für den Sie die Anfangs- und Endfarbe sowie die Richtung festlegen können.

Bild: Der Hintergrund der Zeile wird mit einem importierten Bild ausgefüllt.

Bildliste: Als Hintergrund der Zeile wird eine SlideShow mit durchlaufenden Bildern eingestellt.

Animation: Eine Animation wird als Zeilenhintergrund eingestellt.

Video: Als Hintergrund des Zeile wird ein Video eingebunden.

Karte: Als Hintergrund der Zeile wird eine Karte eingefügt.

Je nach Hintergrundtyp können im Bereich Einstellungen unterschiedliche Optionen eingestellt werden. Folgende Optionen können zur Verfügung stehen:

▪Farbe: Hier können Sie die Hintergrundfarbe festlegen.
▪Anfangsfarbe / Endfarbe: Legen Sie hier die Anfangs- und die Endfarbe für den Farbverlauf des Zellenhintergrundes fest.
▪Diffusion: Hier können Sie festlegen, ob im Farbverlauf die Anfangs- oder die Endfarbe dominieren soll. Hierzu geben Sie an, in welchem Abstand (in %) der Übergang von der einen zur anderen Farbe erfolgen soll.
▪Richtung: Stellen Sie die Größe des Winkels ein, in dem der Farbverlauf ausgerichtet werden soll.
▪Lokale Datei: Wählen Sie hier das Bild für den Hintergrund der Zelle aus. Sie können Dateien in den Formaten JPG, GIF und PNG verwenden. Das Bild kann entweder aus der Online-Bibliothek, die mit der Schaltfläche geöffnet wird, oder mit der Schaltfläche Datei auswählen in einem lokalen Verzeichnis gewählt werden.
▪Anordnung: Hier können Sie festlegen, ob das ausgewählte Hintergrundbild wiederholt werden soll. Das Bild kann nur horizontal, nur vertikal oder in beide Richtungen wiederholt werden, bis es den zur Verfügung stehenden Platz ausfüllt.
▪Ausrichtung: Legen Sie hier fest, wie das eingefügte Hintergrundbild zur Zeile ausgerichtet werden soll.
▪Hinzufügen ... / Entfernen: Ermöglicht die Zusammenstellung einer Liste von Bildern, die als Zeilenhintergrund verwendet werden sollen. Es können Bilddateien (in den Formaten .JPG, .GIF, .PNG) hinzugefügt oder vorhandene entfernt werden.

Mit Klick auf das Dreieck auf der Schaltfläche Hinzufügen... wird ein Submenü mit folgenden Optionen eingeblendet: Bild hinzufügen... und Bild aus Online-Bibliothek....

Mit Klick auf Bild aus Online-Bibliothek... öffnet sich ein Fenster mit einer Online-Bibliothek, in der Sie aus mehreren Millionen kostenloser und Premium-Fotos wählen und diese importieren können.

▪Nach oben / Nach unten: ändert die Reihenfolge der Bilder in der Liste, verschiebt das markierte Bild nach oben oder unten.
▪Anzeige: Übergangsmodus zwischen den Bildern, die als Zeilenhintergrund eingestellt wurden. Folgende Optionen stehen zur Auswahl:
•Bilder nacheinander nach Zeit: Die Bilder werden nacheinander mit dem eingestellten Effekt angezeigt. Die Zeit für den Übergang aus einem Bild auf das andere kann auch frei definiert werden.
•Bilder nacheinander beim Scrollen: Die Bilder werden einzeln angezeigt, ohne Übergangseffekt. Welches Bild angezeigt wird, hängt von der Scrollposition auf der Seite ab.
•Bilder überlagert: Alle Bilder werden gleichzeitig und übereinander angezeigt. Für diese Option werden Bilder im Format .PNG mit Transparenzen und Parallaxe-Effekt empfohlen.
▪Videotyp: Legen Sie hier fest, welcher Videotyp ob für das Hintergrundvideo der Zeile verwendet werden soll: Lokale Datei, URL oder Datei im Internet oder YouTube-Video.
▪Lokale Datei / URL oder Datei im Internet / URL des YouTube-Videos: Je nach gewähltem Videotyp können Sie hier die zu importierende Videodatei auswählen oder die URL eingeben, an der das Video online abgerufen werden soll.
▪Cover: Zuweisung eines Vorschaubildes für das Video. Auch in diesem Fall kann das entweder in der Online-Bibliothek, die mit der Schaltfläche geöffnet wird, oder mit der Schaltfläche Datei auswählen in einem lokalen Verzeichnis gewählt werden.

Das Vorschaubild wird vor dem Video angezeigt und nach dem Start der Wiedergabe mit Auflösungs-Effekt ausgeblendet. Die Konfiguration eines Vorschaubildes ist somit besonders für die Anzeige an Mobilgeräten nützlich, da die Videowiedergabe nicht automatisch startet.

▪Adresse: Adresse, die auf der als Zeilenhintergrund eingestellten Karte angezeigt werden soll.
▪Stil: Anzeigemodus für die Karte. Zur Auswahl stehen: Straßenkarte, Satellit, Hybrid und Gelände.
▪Zoomfaktor: Zoom-Faktor für die Kartenanzeige.
▪Deckkraft: Legen Sie hier die Deckkraft der Hintergrundfarbe / des Farbverlaufs / des Hintergrundbildes / des Videos / der Karte fest. Je kleiner der eingestellte Wert ist, desto geringer wird die Deckkraft, das heißt, die Hintergrundfarbe der Zeile wird transparenter und lässt den Hintergrund der Seite stärker durchscheine
Klicken Sie um zu erweitern/minimierenAnleitung: Funktionen im Bereich Full Height

Mit den Funktionen in diesem Bereich können Sie festlegen, dass jede Zeile (oder Gruppe verbundenen Zeilen) immer mindestens die Höhe des Browserfensters hat, unabhängig von der Höhe der enthaltenen Elemente. Auf diese Weise werden die Zeilen bei der Navigation auf der Seite wie Slides dargestellt, die je nach gewähltem Übergangseffekt aufeinander folgen oder sich überlagern.

Wenn jede Zeile die Höhe des Browserfensters haben soll, aktivieren Sie zuerst die Option Full Height-Anzeige für alle Zeilen dieser Seite aktivieren.

Definieren Sie danach, wie man von einer Zeile auf eine andere wechseln kann:

Automatisch scrollen: Sobald beim Scrollen der Seite die neue Zeile sichtbar wird, scrollt die Seite automatisch weiter, bis die Zeile vollständig angezeigt wird.

Schließlich können Sie auch einige Navigationsbefehle einstellen:

▪Scroll-Down-Schaltflächen anzeigen: Mit dieser Option können Sie im unteren Bereich der Zeile eine Schaltfläche einblenden, mit der die Seite automatisch gescrollt werden kann, um die nächste Zeile anzuzeigen.
▪Button-Anzeige: Verfügbar, wenn Sie die Option Scroll-Down-Schaltflächen anzeigen aktiviert haben. Hier können Sie festlegen, ob die Scroll-Schaltflächen Immer sichtbar oder Sichtbar bei Mauskontakt sein sollen.
▪Button-Stil: Verfügbar, wenn die Option Scroll-Down-Schaltflächen anzeigen aktiviert wurde. Hier können Sie für die Gestaltung des Buttons ein Bild importieren oder eins aus der Standardbibliothek auswählen.
▪Cursor anzeigen: Mit dieser Option wird eine grafische Anzeige eingeblendet, die den Betrachter über die Anzahl und/oder Position der Zeilen informiert, in die die Seite gegliedert ist. Der Betrachter kann direkt auf die Positionsanzeigen klicken, um durch die Seite zu scrollen und die gewünschte Zeile in den Vordergrund zu bringen.
▪Button-Stil: Verfügbar, wenn die Option Cursor anzeigen aktiviert wurde, ermöglicht die Auswahl verschiedener grafischer Elemente für die Gestaltung des Anzeigesymbols.
▪Ausrichtung: Verfügbar, wenn die Option Cursor anzeigen aktiviert wurde, hier können Sie festlegen, wie die Anzeige zur Seite ausgerichtet werden soll.

 


Anleitungen lesen:

-

So arbeiten Sie an den Zeilen des Rasters des Seitenlayouts


Horizontale Streifen mit einer Hintergrundfarbe oder einem Hintergrundbild im Zeilenstil erstellen

-

So stellen Sie einen Link auf einem Anker ein

-

So erstellen Sie einen Parallaxe-Effekt

-

Die Funktion Full Height für die Erstellung eines vertikalen Bildlaufs anwenden