Адаптивное видео для DLE
Хак, устанавливаемый через систему управления плагинами, решает проблему адаптивности видео под разные разрешения экрана, вставленных с помощью тега
[media=]
Установка:
1. Открыть engine/classes/parse.class.php и найти:
$url = $this->clear_url( urldecode( $url ) );
Добавить выше:
// Считаем стороны
$ar = $width / $height;
// В зависимости от сторон, устанавливаем css класс из bootstrap
$ar_mod = ( abs($ar-(4/3)) < abs($ar-(16/9)) ? 'embed-responsive-4by3' : 'embed-responsive-16by9');
Найти 2 раза:
return "<!--dle_media_begin:
Заменить на:
$html = "<!--dle_media_begin:
Найти 3 раза:
return '<!--dle_media_begin:'.$decode_url
Заменить на:
$html = '<!--dle_media_begin:'.$decode_url
Найти:
}
function build_url( $matches=array() ) {
Добавить выше, до фигурной скобки:
// Удаляем длину \ ширину из html
$html = preg_replace( '/(width|height)="\d*"\s/', '', $html );
// Возвращаем HTML
return '<div class="embed-responsive '.$ar_mod.'" data-aspectratio="'. number_format($ar, 5, '.').'">'.$html.'</div>';
2. Добавить в стили шаблона engine.css:
.embed-responsive {
position: relative;
display: block;
height: 0;
padding: 0;
overflow: hidden;
}
.embed-responsive iframe {
position: absolute;
top: 0;
left: 0;
bottom: 0;
height: 100%;
width: 100%;
border: 0;
}
.embed-responsive-16by9 {
padding-bottom: 56.25%;
}
.embed-responsive-4by3 {
padding-bottom: 75%;
}
3. Сделать перестроение публикаций.
Готово!
• Автор: Mofsy
• Источник
Посетители, находящиеся в группе Гость, не могут оставлять комментарии к данной публикации.