Was ist ein Promo-Header?


Um Ihre Marke/ Branding mehr in den Vordergrund zu stellen, ermöglicht Ihnen Streamboxy über Standard Bedienelemente, einen eigenen Header zu definieren.

Hier können mithilfe von HTML jegliche Inhalte eingebunden werden (hier Beispiel "Your Brand" mit Bild und überlappendem Logo). 

Der Header befindet sich überhalb der eigentlichen Seite, über der oberen Navigationsleiste.


Beachten Sie, dass der Header aus Platzgründen nicht in der mobilen Version von Streamboxy angezeigt wird.



Kompletter Bildschirm: 




Header-Ausschnitt:


 


Wo finde ich die Promo-Header Einstellungen?


Aussehen für alle Events des Tenants festlegen

Die Konfiguration des des Promo Headers finden Sie in den Tenant Einstellungen (in der linken unteren Ecke Ihres Tenants) unter dem Reiter "Aussehen" und dort unter dem Punkt "Eigener Promo-Header".

Diese Einstellungen gelten für alle Events des Tenants bzw. Mandanten, solange in einzelnen Events keine eigene Definition festgelegt wurde.





Aussehen für ein einzelnes Event festlegen

Die Konfiguration des Promo-Headers für ein einzelnes Event finden Sie in den Event Einstellungen ("Event bearbeiten") unter dem Reiter "Aussehen" und unter dem Punkt "Eigener Promo-Header".

Diese Einstellungen gelten für das gesamte einzelne Event incl. aller Breakout-Räume.






Wie konfiguriere ich einen eigenen Promo-Header?


Unter dem Punkt "Eigener Promo-Header" gibt es zwei zu befüllende Felder:


  1. Header: Hier können Sie individuelle HTML-Inhalte definieren, welche in dem Header angezeigt werden sollen. Falls Sie Bilder verwenden möchten, müssen Sie diese aktuell noch eigenständig online stellen und verlinken.

  2. Header-Höhe: Hier können Sie definieren, wie viele Pixel der Header hoch sein soll.
    Bitte beachten Sie, dass insbesondere bei kleineren Auflösungen, sehr hohe Header viele Platz von der eigentlichen Seite wegnehmen.





Beispiel Code


Für einen schnellen Einstieg, können Sie unseren Beispiel - "YourBrand" - Header verwenden und anpassen:


<div title="DreieckHintergrundMuster" style="height: 100px; background: #edf0f3; position: relative;">
<div id="trianglesContainer"></div>
</div>

<div title="YourBrandLogo" style="position: fixed; top: 25px; left: 5vmax; z-index: 102;"><img height="50" src="https://commonstaticfilesprod.blob.core.windows.net/yourbranddemo/your%20brand%20logo%20(1).png"></div>

<div title="LogoOhneText" style="position: fixed; top: 45px; right: 17vmax; z-index: 102;"><img height="80" src="https://commonstaticfilesprod.blob.core.windows.net/assets/LogoOhneText.png"></div>


</div>



Die Höhe ("height") des Headers im Code (in der ersten Code-Zeile: "height: 100px")  sollte identisch hoch mit der Header Höhe ("Header height") auf der Oberfläche des "Eigenen Promo Header" sein. 




Bitte beachten: Es wird kein Support für die Einbettung von externen Codes übernommen. 





Weitere Beispiele für einen Eigenen Promo-Header: