Данная модификация позволяет исправить недостатки старых версий ббкода и создать адаптивный плеер через iframe.
После добавления bbcode на страницу будет добавлен скриншот из этого видео, при клике на него будет подгружен сам iframe с видео. В свою очередь это позволит немного уменьшить вес страницы и подгрузить остатки только если вы хотите посмотреть видео и нажали на иконку на скриншоте.
Первым делом нам нужно изменить старый ббкод, если у вас его не было, то создать:
Использование BBCode
Код: Выделить всё
[youtube]http://www.youtube.com/watch?v={SIMPLETEXT}[/youtube]
Замена HTML
Код: Выделить всё
<div class="youtube-container-parent"><div class="youtube-container-child"><div class="youtube-video" data-id="{SIMPLETEXT}"></div></div></div>
Подсказка
Код: Выделить всё
Ссылка на видео [youtube]http://www.youtube.com/watch?v=V94lUearVU0[/youtube]
Далее скачиваем архив
и закачиваем к себе на форум в одноимённые папки вашего используемого стиля.
Для форумов в нашей системе в менеджер картинок.
Открываем
stylesheet.css
и в конец файла добавляем:Код: Выделить всё
@import url("adaptive-youtube.css");
Для форумов в нашей системе в тему стиля (
content.css
) перед:Код: Выделить всё
/* Attachments
----------------------------------------*/
Плюс не забудьте указать точный путь до изображения, если он отличается от уже заданного. Для форумов на phpbb 3.1.x ничего менять не надо.
Открываем
overall_footer.html
и перед </body>
добавляем:Код: Выделить всё
<script type="text/javascript" src="{T_TEMPLATE_PATH}/adaptive-youtube.js"></script>
Для форумов в нашей системе указываем путь полученный в менеджере картинок.
Для форумов на phpbb 3.1.x, находим:
Код: Выделить всё
<!-- EVENT overall_footer_after -->
добавляем перед:
Код: Выделить всё
<!-- INCLUDEJS adaptive-youtube.js -->
Пример такого ббкода можно посмотреть на нашем форуме:

Вариант на jquery - Адаптивный bbcode YouTube.