Konfiguration

Die Administration der InfoBoxen erfolgt über den Menüpunkt Inhalte --> Info-Lightbox.

In der Übersicht hat man nun die Möglichkeit, neue Boxen hinzuzufügen oder Bestehende zu (de-)aktivieren, zu bearbeiten oder zu löschen.

Beim Hinzufügen oder Bearbeiten öffnet sich die Detailansicht der InfoBox mit folgendem Inhalt:

  • Aktiv
    Nur die aktiv geschalteten Boxen werden im Frontend angezeigt.
  • Titel
    Hier hier angegebene Titel dient nur der Administration und besseren Übersicht im Backend. Er wird im Frontend nicht zu sehen sein.
  • Überschrift
    Der hier eingetragene Text wird im Frontend als Überschrift der sich öffnenden InfoBox erscheinen.
  • Inhalt
    Hier wird der eigentliche Inhalt der InfoBox als HTML-Code definiert. Dies kann über den Richtext-Editor in der Live-Ansicht oder aber mittels des entsprechenden Buttons direkt im HTML-Source erfolgen.
  • Start & Ende
    Die InfoBox wird im Frontend nur dann zu sehen sein, wenn der Aufruf der Seite in dem hier definierten Zeitraum erfolgt.
  • Breite des Fensters in px (optional)
    An dieser Stelle kann die Breite des Box-Inhalts angegeben werden. Ohne eine Eingabe wird die Standard-Breite von 800px genutzt.
  • Anzeigedauer in Sekunden (optional)
    Erfolgt hier keine Eingabe, kann der User die Box durch einen Klick auf das X oder außerhalb der Box jederzeit schließen. Wenn jedoch ein Wert angegeben ist, so wird die Box in diesem Zeitraum nicht wegzuklicken sein. Er kann die Box erst nach Ablauf der vorgegebenen Anzeigedauer schließen.
  • Sperrzeit (in Minuten, optional)
    Jede der Boxen wird im Standard-Fall nur einmal pro Session angezeigt. Wird an dieser Stelle ein Wert angegeben, dann wird die Box nur für X Minuten nach der ersten Anzeige unterdrückt und erst bei einem danach stattfindenden Aufruf wieder angezeigt. Danach startet die Sperrzeit von Neuem.
  • Kategorie(n)
    Über den Button wird eine Auflistung der im Shop vorhandenen Kategorien geöffnet, in der eine oder mehrere Kategorien ausgewählt werden können, in denen später die Anzeige der Box erfolgen wird.
  • Unterkategorien einbeziehen
    Wenn dieser Schalter aktiviert ist, so wird die Anzeige der Box auch in allen Unterkategorien der ausgewählten Kategorie(n) erfolgen.

Lightbox per Link aufrufen

LightBoxen können über einen Link aufgerufen werden. Dazu müssen zwei Data-Attribute in den Link platziert werden:

  • data-nilbaction="open"
  • data-nilbid="1337"

Das Attribut "data-nilbid" enthält die ID der aufzurufenden LightBox. Anstelle von Links können auch DIVs verwendet werden.

Optional können folgende Attribute gesetzt werden:

  • data-nilbwidth="600" (Breite der LightBox in px)
  • data-nilbduration="10" (Dauer in Sekunden, bis die LightBox geschlossen werden kann)
  • data-nilbdelay="2" (Dauer in Sekunden, bis sich die LightBox öffnet)

Beispiel:

<a href="#" data-nilbaction="open" data-nilbid="1337" data-nilbdelay="2">Beispiel</a>

So können auch von den den Einkaufswelten-Elementen direkt auf die LightBoxen direkt verlinkt werden.

Lightbox per JS aufrufen

LightBoxen können per JavaScript aufgerufen werden. Dazu müssen zwei Data-Attribute in den Link platziert werden:

  • data-nilbAction="open"
  • data-nilbid="1337"

Das Attribut "data-nilbid" enthält die ID der aufzurufenden LightBox. Anstelle von Links können auch DIVs verwendet werden.

Optional können folgende Attribute gesetzt werden:

  • data-nilbwidth="600" (Breite der LightBox in px)
  • data-nilbduration="10" (Dauer in Sekunden, bis die LightBox geschlossen werden kann)
  • data-nilbdelay="2" (Dauer in Sekunden, bis sich die LightBox öffnet)

Beispiel:

<a href="#" data-nilbAction="open" data-nilbid="1337" data-nilbdelay="2" id="ELEMENTID">Beispiel</a> <script type="text/javascript">$(document).ready(function () {$('#ELEMENTID').click(); });</script>