[FAQ] bb-код [MEDIA] - вставляем аудио, видео, карты, панорамы и другое мультимедиа

[ErikPshat]

BB-код [MEDIA] by VEG

vBulletin [media] — это универсальный BBCode для vBulletin 3 и 4 версий, который даёт пользователем возможность вставлять в сообщения аудио, видео, карты, панорамы и другое мультимедиа. Поддерживаются сервисы youtube.com, vimeo.com, soundcloud.com, maps.google.com, picasaweb.google.com и несколько десятков других. Данный BBCode является частью проекта BB [media], в который входит большое количество мультимедийных BBCode для различных движков форумов.

Поддерживаемые медиа-сервисы

• maps.google.com (карты, панорамы)
• dermandar.com (панорамы)
• picasaweb.google.com/ (слайдшоу из галереи)

Поддерживаемые аудио-сервисы

• soundcloud.com — ссылка на страницу трека и ссылка из кода встраивания
• promodj.com — ссылка на страницу трека, ссылка на скачивание и ссылка из кода встраивания
• pleer.com — ссылка на трек и ссылки из кода встраивания (новый и старый вариант)
• video.yandex.ru — только ссылка из кода встраивания на аудио
• music.yandex.ru — ссылка на страницу с треком (только для тех треков, что поддерживают это)
• yapfiles.ru — только ссылка из кода встраивания на аудио
• файлы WAV, MP3, OGG, OGA, AAC и M4A через HTML5 <audio>

Поддерживаемые видео-сервисы

• youtube.com (youtu.be) — плейлисты также поддерживаются
• vimeo.com
• rutube.ru — только адрес из кода встраивания
• vk.com (vkontakte.ru) — только адрес из кода встраивания
• facebook.com
• video.mail.ru
• smotri.com
• dailymotion.com
• ustream.tv — поддерживаются и записи, и трансляции
• twitch.tv — поддерживаются и записи, и трансляции
• video.qip.ru
• ted.com
• vine.co
• coub.com
• video.yandex.ru — только адрес из кода встраивания
• video.bigmir.net
• tvigle.ru — только адрес из кода встраивания
• video.online.ua
• video.sibnet.ru
• yapfiles.ru — только адрес из кода встраивания BBCode (для видео и музыки)
• megogo.net
• intv.ru
• lovi.tv
• metacafe.com
• veevr.com
• myvideo.de
• clipfish.de
• own3d.tv
• hulu.com — только адрес из кода встраивания
• pinkbike.com
• mpora.com
• файлы WebM, OGV и MP4 через HTML5 <video>

---

Пример использования

Для вставки видео с YouTube пользователю достаточно поместить ссылку на страницу видео между парными тегами:

• [media=480,360]http://www.youtube.com/watch?v=vFWWmbHozYQ&feature=player_embedded[/media]

Как видите, нет необходимости чистить адреса от мусорных параметров — наш BBCode сам разберётся что к чему.

В сообщении эта конструкция отобразится в виде плеера:

vBulletin [media]

1. В панели редактирования нажимаете значёк
   
   
2. Открывается окно ввода опции. Туда вы должны вписать, через запятую, ширину и высоту вставляемого объекта:
   
   media.png
   
   
3. И между тегами потом вставляете ссылку.
   
   Например для Видео будет примерно так:
   • [MEDIA="640,360"]http://www.youtube.com/watch?v=vFWWmbHozYQ&feature=player_embedded[/MEDIA]
   
   
   Результат

   Скрипт сам автоматически отсеет лишний мусор в ссылке, как в данном случае вот этот: (&feature=player_embedded)
   
   

   vBulletin [media]

Ну и имейте в виду, что видео бывает 4:3 (1,333) или 16:9 (1,768).
На Youtube плеер формата 16:9, но иногда видео бывает там с чёрными плосками по краям, а это значит, что просто видео залили туда формата 4:3
Затем, вы должны учитывать, что видео обычно бывает 240p, 360p 720p, 1080p - это соотношения сторон 320х240 (4:3), 480х360 (4:3), 640x360 (HD 16:9), 960х720 (4:3), 1280х720 (HD 16:9), 1920х1080 (HD 16:9).
Поэтому нужно уметь определять размер видео и правильно подбирать размер для вставки в опцию BB-кода.

Аудио-плеер, например у muzebra - 395х42, это можно подсмотреть проинспектировав плеер правой кнопкой на странице.

В остальном же, вы можете подобрать правильный размер просто экспериментальным путём, через предварительный просмотр.
Либо можете умышленно уменьшить размер или увеличить относительно оригинала, например:

vBulletin [media]