Page 1 of 1

responsive Videos von YouTube in phpWCMS einbinden

Posted: Thu 24. Mar 2016, 09:49
by kukki
Allen bekannt ist die einfache Variante, indem man sich den Code bei YouTube generieren lässt und dann im CP HTML einbindet. Für einen unbeleckten Redakteur, dem die entsprechenden Grundkenntnisse fehlen, ist das der einfachste Weg, ohne die Hilfe eines Webdesigners in Anspruch zu nehmen.

:idea: Aufwendiger wird dann schon die Einbindung in ein responsives Layout, da dürfte jeder Fachlaie überfordert sein. Da ich gerade eine solche Website für "Self-Made-Redakteure" auf responsiv umgestellt habe, musste auch eine einfache Lösung her für Videos.

Ganz einfach, man erstellt einfach ein neues HTML-CP und lege das im Verzeichnis template/inc_cntpart/html ab. Ausprobieren - simpel, einfach ohne Probleme, weil der Redakteur wie bisher den YouTube-Code nur einsetzen muss. :arrow:

Code: Select all

<!-- CSS:
.respo-video {position: relative; padding-bottom: 56%; padding-top: 30px; height: 0; overflow: hidden; }
.respo-video iframe, .respo-video object, .respo-video embed {position: absolute; top: 0;	left: 0; width: 100%; height: 100%; }  -->
[TITLE]<h3>{TITLE}</h3>[/TITLE]
[SUBTITLE]<h4>{SUBTITLE}</h4>[/SUBTITLE]
[HTML]<div class="respo-video">{HTML}</div>[/HTML]

Re: responsive Videos von YouTube einbinden

Posted: Thu 24. Mar 2016, 11:22
by top
Hey danke,

das werde ich die nächsten Tage tatsächlich brauchen.

Ich hatte eine ähnliche Lösung vor nicht all zu langer Zeit für eine statische Seite gefunden. So brauche ich mir jetzt keine Gedanken machen wie es einfach in phpwcms integrieren lässt. Ich gebe Rückmeldung ob es problemlos geklappt hat.

Frohe Ostern,
top

Re: responsive Videos von YouTube einbinden

Posted: Thu 24. Mar 2016, 15:14
by Oliver Georgi

Re: responsive Videos von YouTube einbinden

Posted: Mon 25. Apr 2016, 10:42
by kukki
Zwischenzeitlich wurden weitere Webseiten auf responsives Layout umgestellt und dort wurde das CP HTML5/Flash Media-Player benutzt, das Video wird einmal jährlich gewechselt und auf dem Server abgelegt. Durch das automatische Vorladen und gleichzeitige Abspielen ist dieses CP sehr empfehlenswert.

:?: Und wie bekommt man das ganze Ding responsive :?:

Vorausgesetzt man hat bereits - wie bei mir eine responsive Vorlage als CSS-file, da braucht man nur noch folgende Anweisung als neues CP ablegen - es werden nur die width und height -Angaben aus dem CP überschrieben und schon klapps auch mit der schönen Nachbarin :mrgreen:

Code: Select all

<!-- CSS: video {    height: auto !important;  width: 100% !important; } -->
[TITLE]<h3>{TITLE}</h3>[/TITLE]
[SUBTITLE]<h4>{SUBTITLE}</h4>[/SUBTITLE]
<div class="respo-video">{PLAYER}</div>

Re: responsive Videos von YouTube u. phpWCMS einbinden

Posted: Fri 23. Sep 2016, 17:29
by photojo
So, ich greife den Thread nochmal auf.

@ Oliver zu http://getbootstrap.com/components/#responsive-embed
Ich kriege das Autoplay nicht abgestellt?


@ Kukki
Welche Größe für das Video stellst du im CP ein?


Danke.

Re: responsive Videos von YouTube u. phpWCMS einbinden

Posted: Fri 23. Sep 2016, 17:49
by kukki
Größe wie bereits angegeben in CSS (Siehe oben), damit dehnt sich das Teil im umgebenden DIV aus.
Autoplay hat nichts mit responsiv zu tun, das muss man u.a. mit dem

Code: Select all

autoplay=0
im HTML-Code des <iframe> ablegen.

Oder was meinst Du dann :?:

Re: responsive Videos von YouTube in phpWCMS einbinden

Posted: Fri 23. Sep 2016, 18:39
by photojo
Danke. Klar, autoplay hat nichts mit responsive zu tun. Und das autoplay=0 im iframe-tag klappt eben auch nicht. Daher auch diese Frage. Ich dachte, weil du in letzter Zeit das häufiger verwendet hast, hättest du das gleiche Problem gehabt.

Re: responsive Videos von YouTube in phpWCMS einbinden

Posted: Fri 23. Sep 2016, 18:47
by photojo
Habe nochmal alles überprüft. Jetzt klappt es. :D