Bühne zweispaltig mit Medien-Versatz

Bühne zweispaltig mit Medien-Versatz

Eine zweispaltige Bühne mitsamt eines Medien-Versatzes anlegen

Info
In der Vergangenheit hat es in unserer Produktwelt unter dem Produktbegriff destination.base bereits einige Darstellungmöglichkeiten von zweispaltigen Bühnen gegeben:

In dem Zusammenhang ist nun eine neue Form der Darstellung hinzugekommen. Die neue zweispaltige Bühne mit versetzten Medien-Elementen beschreibt ein Layout, bei dem Inhalte in zwei Spalten angeordnet sind, die visuell miteinander verbunden werden. Dabei können einzelne Elemente, beispielsweise ein Bild, leicht versetzt über beide Spalten hinweg platziert sein. So entsteht ein fließender Übergang zwischen den Bereichen, ohne die Struktur zu verlieren. Der Versatz kann dabei individuell festgelegt werden: nach oben, nach unten, nach links und nach rechts.

Darstellung im Frontend

Zweispaltige Bühne mit Medien-Versatz

Wer sich die neue Bühne einmal im Frontend ansehen möchte, gelangt hier zur Live-Demo: LINK

Zweispaltige Bühne mit Versatz oben



Zweispaltige Bühne mit Versatz unten



Zweispaltige Bühne mit Versatz links



Zweispaltige Bühne mit einem Versatz rechts



Pflege im Backend

Voraussetzungen

- Du hast bereits die Landingpage für das Modul in Deinem Seitenbaum angelegt.

Hinzufügen der neuen Bühne auf der Landingpage

1. Begebe Dich im ersten Schritt auf Deine bereits angelegte Landingpage und suche Dir die Position aus, an der Du Deine neue zweispaltige Bühne platzieren möchtest.

Klicke dort dann auf +Neuen Inhalt erstellen:




2. Es öffnet sich die Übersicht der destination.base Bühnen:


Wähle hier nun die neue Bühne destination.base Bühne (zweispaltig mit Versatz) aus.

Info
Besonderheit: bei dieser neuen Bühne braucht es keine weitere Rahmenbühne, die vorab platziert werden muss.

3. Es öffnet sich nun die Bearbeitungsansicht der zweispaltigen Versatz-Bühne:






Folgendes kann hier nun gepflegt werden:

  1. Layout: Hier kann nun zunächst entschieden werden, in welcher Ausrichtung der Versatz im Frontend der Website erscheinen soll:



  2. Farbschema je Versatz Art:
    Für oben/unten gilt:
    Farbschema für Hintergrund: Sofern im kundenspezifischen Projekt Farbschemas definiert worden sind, kann aus diesen auch gewählt werden, damit die zweispaltige Bühne in eben diesem Farbschema erscheint:



    Für rechts/links gilt:
    Farbschema Inhalt: Betrifft Farbschema NUR für den Inhaltsteil, d.h. Hintergrund- & Schriftfarbe.
    Farbschema Hintergrund: Betrifft das Farbschema für die gesamte Bühnenbreite, wobei bspw. bei der Auswahl bei Heller Schrift auf dunklem Hintergrund zu sehen ist, dass das Farbschema für die ganze Bühnenbreite verwendet wird. 
    Der Inhaltsteil liegt "über" diesem Hintergrund und beachtet die Farbauswahl von Farbschema Hintergrund.

  3. Überschrift: Hier kann nun eine Überschrift für die zweispaltige Bühne gepflegt werden.

  4. Typ der Überschrift: Bei dem Typen der Überschrift kann die H-Auszeichnung festgelegt werden:



  5. Stil der Überschrift: Mit dem Stil der Überschrift kann entschieden werden, in welcher Größe die Überschrift im Frontend der Website erscheinen soll:



  6. Text: Im Textfeld kann dann ein beliebiger Beschreibungstext hinzugefügt werden.

  7. Button-Link: Hier kann festgelegt werden, wohin ein optionaler Button verlinken soll.

  8. Text für Button-Link: Hier kann eingetragen werden, welcher Text auf dem optionalen Button erscheinen soll. 

    Beispiel eines Buttons:



  9. Icon für Button-Link: Wie im beispielhaften Button zu sehen, kann auch ein Icon für den Button ergänzt werden.

  10. Icon für das Element: Hier kann zudem ein Icon ausgewählt werden, welches dann optional über der Überschrift ausgegeben werden kann:



  11. Versetztes Medien-Element: Zuletzt kann dann noch die elementare Mediendatei für die zweispaltige Bühne hinzugefügt werden:



    Hierbei kann über den Button "Medien-Datei hinzufügen" auf die Dateiliste zugegriffen werden.

    Alternativ kann der Button "destination.one Medien hinzufügen" genutzt werden, sofern im Projekt die DAM-Anbindung gebucht worden ist. Mit diesem Button kann dann direkt auf die Mediendateien aus destination.data zugegriffen werden.

Wurden alle Bereiche innerhalb der Bühne gepflegt, ist es wichtig, dass der Fortschritt im oberen Bereich über das Diskettensymbol gespeichert wird.