Video Background in WBB4

    Hallo zusammen, ich "darf" mich grade mit WBB4 rumschlagen und soll einen Weg finden ein Video als Hintergrundbild ein zubinden. Ich habe dazu auch schon hier im Forum was gefunden, komme damit aber nicht klar :(
    CSS und HTML ist eigentlich nicht so ein Problem für mich aber bei WBB wirkt es unglaublich kompliziert mit diesen tpl's. Hat jemand vielleicht eine Idiotensichere Anleitung? Der Stil auf dem ich das ganze Aufbauen soll ist ShapeShifter von cls-design.
    Ich habe den HTML 5 Code und den CSS Code für den Videobackground nur hab ich jetzt keine Ahnung wo ich den HTML Teil platzieren soll.

    Okaaaaay...die Lizens ist gekauft und auf der Hestellerseite steht das man, solange die Copyright Hinweise nicht entfernt werden, auf eigene Gefahr machen kann was man will. Also wer soll mich da dann in wie fern freischalten?

    Wenn du die WBB4 Lizenz hier gekauft hast, das Geld bei Woltlab angekommen ist, dann bekommst du ein grünen Badge "Kunde".
    Wirst somit automatisch freigeschaltet.

    Klar die Copyright Hinweise darfst du, sofern du keine Branded free lizenz kaufst, nicht entfernen.
    Was du dann für dich persönlich mit dem Code im Hintergrund anstellst ist natürlich deine sache.

    Du erstellst ein Template, fügst

    Code: backgroundVideo
    <div style="position: fixed; z-index: -99; width: 100%; height: 100%">
  <iframe frameborder="0" height="100%" width="100%" 
    src="https://youtube.com/embed/videoID?autoplay=1&controls=0&showinfo=0&autohide=1">
  </iframe>
</div>

    ein (videoID muss ersetzt werden durch das jeweilige Video)
    Und includest es in das Template documentHeader mit {include file="backgroundVideo"} - Einfach am Ende einfügen.

    Ist jetzt ein Beispiel mit nem YT Video. Kannst auch ein Video auf deinem Server hochladen und es via html5 abspielen lassen


    HTML
    <video width="100%" height="100%" autoplay>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!

Register Yourself Login