htmlka Справочник по html

25 июня, 2009

Вставка Аудио

Filed under: — wildmale @ 19:54

1. Обзор сервисов.

  • MPSound.ru — музыкальный хостинг с функцией социальной сети, созданием плейлистов и функцией статистики популярности треков. Размещение треков в блоге с помощью кода плеера:

  • muzicons.com — не закачивает файлы с компа, вставка аудио по прямым ссылкам на файл или через встроенный поисковик, выглядит так:

  • www.jetune.ru — в полной мере работает только для юзеров России. Чтоб выложить трек, надо на сайте найти (без регистрации) или закачать своего исполнителя (с регистрацией), кликнуть на конкретный трек и получить код плеера:

  • prostopleer.com — загружай или ищи на сайте музыку и получай код плеера:


    Некоторые файлообменники имеют аудиоплееры для mp3-файлов

    Типичные представители сетевой фауны:

  • divshare.com Регистрируемся. Жмем «Upload new file», загружаем трек. Клик на «dashboard» (вверху), появится файл. На него правой кнопкой мыши, выбираем «share», копируем «Embed Playlist» и вставляем:

  • box.net после закачки файла (по клику на shared) выдаст ссылку на страницу для прослушивания и скачивания файла наподобие:
    www.box.net/shared/zf1uk007vy


    2. Учимся "ловить рыбу"

    Поняв принцип, можно забыть о подобных сервисах, которые часто закрываются, удаляют файлы, меняют условия и т.д.
    Код для вставки музыки в блог состоит из двух главных компонентов — флеш-плеер (файл *.swf в виде http://../player.swf) и аудиофайл (в виде http://../song.mp3) — остальное HTML, то бишь буковки.
    Выглядит примерно так:
    <object data="http://../player.swf" type="application/x-shockwave-flash" width="240" height="64">
    <param name="movie" value="http://../player.swf">
    <param name="menu" value="false">
    <param name="scale" value="noscale">
    <param name="flashvars" value="src=http://../song.mp3&amp;autostart=no">
    </object>

    Я залил сюда флеш-плеер и получил:
    https://htmlka.com/wp-content/uploads/2009/06/webplayer.swf
    затем загрузил трек:
    https://htmlka.com/wp-content/uploads/2009/06/08-caravan.mp3
    Вставил эти ссылки в код выше:

    Полный код безобразия:

    Если в этот код вставите свой mp3 файл вида http://…./song.mp3 ("прямая ссылка"), он будет играть вашу музыку:).

  • width и height определят размеры плеера.
    Если назначить height=16, получим:

    Чтоб исключить сбой кодировок, избегайте кириллицы и пробелов в названиях треков.
    Переименовывайте файлы перед закачкой их на хостинг.
    Примеры:
    моя песня.mp3 (нельзя в плеер, будет глюк)
    moya_pesnya.mp3 (можно юзать)

  • Можно вставлять плейлисты:

    — навигация по трекам

  • Делаем такой плеер с плейлистом:
    1. Загружаем на хостинг аудиофайлы и составляем такой список треков:
    <file src="sound1.mp3"/>
    <file src="sound2.mp3"/>
    <file src="sound3.mp3"/>

    2. Копируем образец кода плейлиста ОТСЮДА
    (всё, что под чертой)
    3. Открываем на компе программу Блокнот, вставляем туда этот код.
    4. Вместо примера списка треков вставляем свой заготовленный список треков.
    5. Жмем «Файл-Сохранить как». Называем файл playlist.xml и сохраняем.
    (назвать можно как угодно, главное — на латинице и .xml)
    6. Файл playlist.xml грузим на хостинг, ссылку на него ставим в код плеера там, где в плеере с одним треком стоит ссылка на mp3-файл: http://site/song.mp3
    7. Вставляем полученный код плеера в блог.


  • Другой плеер, «складной»:

    Код копируем, ставим ссылку на свой mp3 вместо ВАШ_ФАЙЛ и слушаем:


  • Компакт-плеер:

    Cтавим ссылку на свой mp3 вместо ВАШ_ФАЙЛ (в двух местах!):


    Вот хостинг с прямыми ссылками на файл: My-Files.RU


  • DropBox — быстрая регистрация, 2 ГБ.
    Подробная инструкция к Dropbox

    Поисковик по mp3-файлам:
    beemp3.com |


    В начало ↑

  • Комментариев нет

    No comments yet.

    RSS feed for comments on this post. TrackBack URL

    Sorry, the comment form is closed at this time.

    Powered by WordPress