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

[ErikPshat]

BB-код [MEDIA] by VEG (http://veg.by/ru/projects/bbmedia/vbulletin/media/)

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

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


maps.google.com (https://maps.google.com/maps?hl=ru) (карты, панорамы)
dermandar.com (http://www.dermandar.com/) (панорамы)
picasaweb.google.com/ (https://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 пользователю достаточно поместить ссылку на страницу видео между парными тегами:

http://www.youtube.com/watch?v=vFWWmbHozYQ&feature=player_embedded

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

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

http://www.youtube.com/watch?v=vFWWmbHozYQ&feature=player_embedded

В панели редактирования нажимаете значёк http://www.pspx.ru/forum/cleardoc/editor/media.gif


Открывается окно ввода опции. Туда вы должны вписать, через запятую, ширину и высоту вставляемого объекта:

7845


И между тегами потом вставляете ссылку.

Например для Видео будет примерно так:

[MEDIA="640,360"]http://www.youtube.com/watch?v=vFWWmbHozYQ&feature=player_embedded


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

http://www.youtube.com/watch?v=vFWWmbHozYQ&feature=player_embedded


Ну и имейте в виду, что видео бывает 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, это можно подсмотреть проинспектировав плеер правой кнопкой на странице.

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

http://www.youtube.com/watch?v=vFWWmbHozYQ

[ErikPshat]

dermandar.com (http://www.dermandar.com/) (панорамы) есть увеличение и перемещение.

http://www.dermandar.com/p/bidWNn/battery-sony-psp

[ErikPshat]

picasaweb.google.com (https://picasaweb.google.com/) (слайдшоу из галереи)

https://picasaweb.google.com/113456187286461399322/12011#slideshow/5658514793771505922

[ErikPshat]

maps.google.com (https://maps.google.com/maps?hl=ru) (карты, панорамы)

https://maps.google.com/maps?hl=ru&ll=55.752855,37.622418&spn=0.001268,0.002411&t=h&layer=c&cbll=55.752886,37.622513&panoid=NfUfd_qeAbU-Y2PXwrqFeQ&cbp=13,143.85,,0,-13.77&z=19

[KirJan-DeSign]

ErikPshat,
эм...а как-бы это прикручивать к форуму в плане оформления тем?
есть только одна мысль:
СДЕЛАТЬ АУДИО-ГИД к инструкциям форума. или кхм....видео - репортаж...

[vash]

KirJan-DeSign, я не ErikPshat, немного вопрос не понял: как-чего прикручивать, вроде всё ясно, в чём подвох?

[COOLERbyPSP]

http://soundcloud.com/tak-4/sinister-evolution

Неплохо вписывается.
http://www.yapfiles.ru/files/482087/00.gif

[ErikPshat]

Кстати, если вы не можете рассчитать размер плеера, то просто оставьте опцию пустой. Вернее, при запросе вставки опции введите любое значение, а потом удалите, т.е., чтобы значение осталось пустым.

[MEDIA=""]http://soundcloud.com/tak-4/sinister-evolution

http://soundcloud.com/tak-4/sinister-evolution

[COOLERbyPSP]

Только он растянет до краёв. Не знаю, как с остальными.

[ErikPshat]

Да вроде размер подгоняется автоматически:

http://www.youtube.com/watch?v=KhMDzyPwDcA&feature=g-logo-xit

http://www.youtube.com/watch?v=KhMDzyPwDcA&feature=g-logo-xit

[vash]

он растянет до краёв
В зависимости от хостинга, на который идёт ссылка, внешний вид плеера меняется.

[ErikPshat]

http://prostopleer.com/i/prostopleer-logo.png

http://prostopleer.com/tracks/478493519jd

[ErikPshat]

http://www.yapfiles.ru/images/top-logo-files.png


http://www.yapfiles.ru/static/play.swf?st=aMDAzMDY3ODQt1d55&allowscriptaccess=always


Работает предлагаемая на сайте ссылка, выдаваемая внутри BB-кода.

[ErikPshat]

Как бы вот эти радиоканалы в какой-нибудь флеш-плеер замутить?

http://online.radiorecord.ru:8100/rr_ogg // Radio Record
http://online.radiorecord.ru:8102/tm_ogg // Trancemission Radio
http://online.radiorecord.ru:8102/ps_ogg // Pirate Station
http://online.radiorecord.ru:8102/vip_ogg // VIP Mix
http://online.radiorecord.ru:8102/teo_ogg // Teodor Hardstyle
http://online.radiorecord.ru:8102/dc_ogg // Record Dancecore
http://online.radiorecord.ru:8102/brks_ogg // Record Breaks
http://online.radiorecord.ru:8102/chil_ogg // Record Chill-Out
http://online.radiorecord.ru:8102/dub_ogg // Record Dubstep
http://online.radiorecord.ru:8102/sd90_ogg // Супердискотека 90-х
http://online.radiorecord.ru:8102/club_ogg // Record Club
http://online.radiorecord.ru:8102/mdl_ogg // Медляк FM
http://online.radiorecord.ru:8102/gop_ogg // Гоп FM

[vash]

ErikPshat, не знаю как кто, а я расширениями Оперы пользуюсь, там радио есть. А объявы в чате любой посетитель форума может оставить? А то страшно становиться, чего там наворотить можно не зная, а уж зная...

[ErikPshat]

А объявы в чате любой посетитель форума может оставить? А то страшно становиться, чего там наворотить можно не зная, а уж зная...Не, объявы могут вешать только модераторы.
Обычные местные ваще даже правую колонку чата не видят ))

[ErikPshat]

Тест 720p (960,720)

https://www.google.com/maps/place/%D0%9D%D0%B0%D0%B7%D0%B0%D1%80%D0%BE%D0%B2%D0%BE/@56.004601,90.3582972,7471m/data=!3m1!1e3!4m19!1m13!4m12!1m6!1m2!1s0x5cd53ce9524ba3c3:0x7864cca095398122!2z0 J3QsNC30LDRgNC-0LLQvg!2m2!1d90.36819!2d55.99683!1m3!2m2!1d90.4026508!2d56.0132915!3e0!3m4!1s0x5 cd53ce9524ba3c3:0x7864cca095398122!8m2!3d55.99683!4d90.36819?hl=ru-RU