Párszor belefutottam a problémába, hogy videomegosztóról be kell ágyazni a tartalmat, amihez vagy valamilyen shortcode kiegészítőt, vagy egyéb szerkesztő kiegészítőt használatam. Azonban előfordul, hogy 1-1 video miatt nincs kedvem feltenni egy komplett kiegészítőt (pláne azt is frissítgetni...)

Erre itt egy gyorsabb, egyszerűbb megoldás.

Az alábbi CSS-t helyezzük el a sablon CSS felülírásába (vagy template.css-be, vagy máshova, ahonnan a rendszer képes azt betölteni):

.video-responsive{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}
.video-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}

Majd a videó beágyazásnál használjuk ezt a formát (minta Youttube-al):

 

<div class="video-responsive">
    <iframe width="420" height="315" src="#" frameborder="0" allowfullscreen></iframe>
</div>