Hi,
mich stört das Youtube-Element auch - so, wie es ist.
Deshalb habe ich folgendes getan (wahrscheinlich nicht update-sicher, aber für meine Zwecke reichts):
Ein Template innerhalb von Contao verändert:
ce_player
HTML-Code:
<?php $this->extend('block_searchable'); ?>
<?php $this->block('content'); ?>
<!-- indexer::stop -->
<?php if ($this->isVideo): ?>
<iframe <?= $this->size ?> src="<?php foreach ($this->files as $file): ?><?= $file->path ?><?php endforeach; ?>" frameborder="0" allowfullscreen></iframe>
<?php endif; ?>
<!-- indexer::continue -->
<?php $this->endblock(); ?>
Und dazu dann noch in "/system/modules/core/elements/ContentYouTube.php" in Zeile 81 folgendes geschrieben:
HTML-Code:
$objFile->path = 'https://www.youtube.com/embed/' . $this->youtube;
Und schwupps, hat man das "original" Youtube-Embed-Template.
Dazu habe ich noch ein kleines JS geschrieben, damit sich der iFrame immer responsive anpasst.
Wen es interessiert:
HTML-Code:
function resizeYoutube(){
var iframeWidth = $(window).width();
if(iframeWidth < 960 && actualWindowWidth > 767){
iframeWidth = 768;
// meine 768er Variante
}
else if(iframeWidth < 768){
iframeWidth = iframeWidth * 0.875;
// meine mobile Variante, die links und rechts einen Abstand von 6.25vw (sprich 6,25% der Bildschirmgröße) hat.
// Dadurch ergibt sich 100% - (2*6.25%) = 87.5%
}
var iframeHeight = iframeWidth * 0.5625;
// Höhe proportional zur Breite (Original Youtube: 560x315)
$("#container .full-width .ce_youtube iframe").each(function(){
$(this).width(iframeWidth).height(iframeHeight);
});
}
Fertig.