суббота, 14 февраля 2009 г.

Простой mp3 плеер для блога



Если Вам необходимо добавить аудиоматериалы (подкаст, музыка) на свой блог, то это можно сделать используя простенький flash mp3 плеер. Этот плеер представляет собой всего лишь маленькую кнопочку "play" около каждой прямой ссылки на mp3-файл. Установка и настройка этого плеера очень проста и под силу каждому.




Итак, для установки плеера в сообщение блога необходимо:

  1. При создании сообщения перейти в режим Изменить HTML
  2. Первой строкой сообщения вставить следующий код:
  3. <script type="text/javascript" src="http://googlepage.googlepages.com/player.js"></script>
  4. Указать прямую ссылку на mp3-файл в интернете
  5. <a href="http://www.fileden.com/files/2009/2/12/2318764/Music/Psyche_low.mp3" rel="nofollow">Psyche</a>

В результате возле каждого mp3-файла появится кнопка при нажатии на которую начнётся воспроизведение аудио.



Вот что получилось у меня.


Camp - Tell Me How
Return to Yourself
Lovers and Friends




Если Вы планируете размещать аудиоматериалы чаще, то вставьте код <script type="text/javascript" src="http://googlepage.googlepages.com/player.js"></script> в шаблон блога, перед тегом </head>




Вы можете скачать исходные файлы плеера и установить их на другом хостинге.



Источник: Blogger Templates

61 коммент.:

prokof'evna комментирует...

Давно искала подобный материол для Blogspot(a).
Было время, хотела открыть блог з отсканированными старыми семейными фото. И чтобы там негромко звучала музыка.
Наверное, при этом нужно код плеера вставить в другое место шаблона?

IvanXP комментирует...

Данный плеер не умеет самостоятельно запускаться и ждёт клика пользователя. Думаю стоит поискать другое решение. Например, если Вы хотите, чтобы музыка играла на всём блоге, а не только на отдельных сообщениях, то можно добавить в боковую панель виджет Last.fm (http://www.lastfm.ru/widgets)
Это так, для примера. На самом деле решений масса.

blogger4you комментирует...

Спасибо за интересную статью и прекрасную музыку Chris Spheeris - я ее тоже просто обожаю!

Света

IvanXP комментирует...

Мне тоже нравится, но пока в моей коллекции только вот эти композиции.

Ваня

IvanXP комментирует...

Кстати, Света. У тебя на блоге я видел простенький плеер с песней "Уезжаю в Ленингад". Поискал про это плеер у тебя на блоге, ничего не нашёл. Но хотелось бы узнать про него подробнее.

blogger4you комментирует...

А у меня его диск есть - 15 композиций, могу куда-нибудь выложить :).

Что до плеера в моем блоге. На Яндексе у меня лежит флэш-объект вот по такому адресу: http://junglebook2007.narod.ru/audio/player.swf
а дальше есть код в котором ты настраиваешь цвета плеера и указываешь где лежит mp3-файл.

А вот пример кода:

<object id="audioplayer1" data="http://junglebook2007.narod.ru/audio/player.swf" wmode="transparent" type="application/x-shockwave-flash" width="180" height="16"> <param value="http://junglebook2007.narod.ru/audio/player.swf" name="movie"> <param value="playerID=1&amp;bg=0x67452E&amp;leftbg=0xB3B3B3&amp;lefticon=0xoooooo&amp;rightbg=0x67452E&amp;rightbghover=0x999999&amp;rightcon=0xoooooo&amp;righticonhover=0xffffff&amp;text=0x666666&amp;slider=0x8CA4C0&amp;track=0x8CA4C0&amp;border=0x666666&amp;loader=0x9FFFB8&amp;loop=no&amp;autostart=no&amp;soundFile=http://bards.pp.ru/Suhanov/Kareta/01_Zelenaya_kareta.mp3&amp;" name="FlashVars"> <param value="high" name="quality"> <param value="false" name="menu"> <param value="transparent" name="wmode"> </object>

Единственное, может лучше этот swf-файл скопировать куда-нибудь к себе, а может и так ничего ;).

Света

ExyTab комментирует...

а де лучше хранить мп3 файли (в сети)?

IvanXP комментирует...

Я использовал www.fileden.com.
# 1GB
# A 50mb максимальный размер файла
# 5GB в месяц трафика
# Прямые ссылки

IvanXP комментирует...

Re:blogger4you
Света, спасибо за плеер.
Буду ждать Chris Spheeris, желательно в FLAC (losless) или в другом, удобном тебе формате. Конечно, же плохо заниматься пиратством, но очень хочется :-)

blogger4you комментирует...

А на мой (советский) взгляд плохо не давать людям доступ к информации, к произведениям искусства и т.д.

На вряд ли я в ближайшее время займусь переводом этих треков во что-то приличное, а mp3 были не очень давно сделаны.. так что в ближайшее время ;).

Света

Leonid Zaplatnikov комментирует...

Спасибо за полезную статью.

миК комментирует...

Интересное стечение обстоятельств и интересов. Я тоже ищу по этому поводу инфу. Вот нашел, буду пробовать. Спасибо.

blogger4you комментирует...

Сотворила: The Best of Chris Spheeris: 1990-2000!

Файлы залила на www.fileden.com как ты и советуешь. Только первая композиция иногда почему-то не проигрывается :(.

Света

IvanXP комментирует...

Спасибо Света!
Но, я не советовал заливать музыку на fileave.com - там всего 50 МБ. Это для мелких файлов - favicon, картинки шаблона и прочее.
Ой, ссылка не открывается.

IvanXP комментирует...

А нет, все нормально, открылась.
Спасибо!

blogger4you комментирует...

Ваня, а mp3 ты куда бы посоветовал класть?

Кстати, я как приличный человек, в ссылке на музыкальную страничку в предыдущем комменте nofollow поставила ;).

Света

IvanXP комментирует...

Я нашёл www.fileden.com. Об этом я написал ранее, смотри повыше. А за nofollow спасибо.Только я удивлён как это ты HTML в комментарий вставила. Я несколько раз пытался, мне Blogger запрещал вставлять HTML.

blogger4you комментирует...

Понятно! fileden.com - fileave.com звучит почти одинакового -- вот я и ошиблась ;)

Ты прав, в общем, в комментариях HTML не разрешается, но ссылки и немного разметки на уровне b и i тегов можно, а вот уже туда цвета вставить не получается.

Света

lenor.tk комментирует...

А если 5 gb трафика мало, да и 100 gb за 5 долларов это я по поводу www.fileden.com Ещё что-нибуть есть похожее?

IvanXP комментирует...

Re:lenor.tk
Видимо, есть. Я не искал, т.к. был рад и этому.

Sveety-Lana комментирует...

Не получается. вроде все делаю, как надо. Файлы хранятся на другом обменнике. но имеет разве это значение?
Вот: В чем моя ошибка-то?
Кнопочки зеленой нет. Прослушать прямо в блоге нельзя.

помогите.
1.
ваш скрипт. Тут не могу его опубликовать - запрет, не может быть принят.


2. файлы оттуда:
www.4shared.com/file/

Sveety-Lana комментирует...

И у вас я больше не вижу этой кнопки, а раньше была. Нажимаю на ссылку, идет скачка.
А не прослушивание.

IvanXP комментирует...

Одной из причин этого может быть большое количество Java-скриптов на странице. Я убрал один скрипт и "кнопочки" снова появились.
Что касается www.4shared.com/file/, то как я понял, там нет прямых ссылок на файлы, а нужно пройти несколько страниц, подождать несколько секунд и только потом начать скачивать. Такие файлообменники не подходят.

Наденька комментирует...

Всё получилось, спасибо!

Александр комментирует...

У меня ваш код в блоге не встаёт,выдаёт постаянно ошибку.

IvanXP комментирует...

Давай-те разбираться. Уточните на каком этапе и какая ошибка. В принципе нет ничего сложного - всего одна строчка кода, которую достаточно скопировать и вставить у себя в исходный код сообщения или шаблон блога.

Frazy комментирует...

Народ срочно нужна помощь!!!
Почему у меня в плеере http://junglebook2007.narod.ru/audio/player.swf
песни нормально воспроизводятся, а в руга пишет error?? браузеры опера , мозила(как и у меня)
вот адрес блога http://freemusiconly.blogspot.com/

HELP!!!!

newsea комментирует...

а как быть, если формат аудиофайла по ссылке не mp3, а wav?
или все равно?

IvanXP комментирует...

А, попробуйте. Если будет проигрываться, замечательно, нет - конвертируйте в mp3.

Bigmmsi комментирует...

Отличный, полезный, нужный пост!

IvanXP комментирует...

Между прочим, самый популярный среди поисковых запросов для этого блога.

cyber-c комментирует...

Клас. Действительно, самый простой и вместе минималистический метод. Чего то подобного давно ищу. Вставлял код через или как там его, так если пару таких вставлял на одну страницу - играли все вместе и только один файл.. ни как не мог сделать так, чтобы играли разные файлы. Спасибо!

Webman комментирует...

Спасибо. Очень полезная штука.

Анонимный комментирует...

Спасибо большое, ваш материал очень полезный, я облазил кучу страниц в поиске подобного.

У меня есть один вопрос, можно ли сделать так, чтобы он мог проигрывать файлы расположенные на локальном компьютере (html-cтраница тоже на компьютере)?
Как вставить ссылку, или нужно скрипт подправить, или это невозможно?

Митя комментирует...

Всё гениально и просто, у меня есть список хостингов с прямыми ссылками http://hachic.blogspot.com/2009/08/blog-post_28.html
Такой плеер очень компактен и удобен.

FlatFX комментирует...

У меня после переноса на свой домен плеер отвалился, в чём может быть дело?

IvanXP комментирует...

Проверьте наличие кода плеера в шаблоне.

Ирина комментирует...

Спасибо за плеер. Взяла себе!

Natalie комментирует...

Старалась установить плеер на свой сайт, но что-то не работает, вместо зелененькой кнопочки "плей" просто пустой квадрат. что это может быть? просто плеер уж очень нравится....

IvanXP комментирует...

Странно, всё должно быть в порядке. Ведь плеер ставится всего одной строчкой кода. Ещё раз внимательно всё проверьте, может чего-то пропустили.

Natalie комментирует...

может какая-то ошибка в исходнике (правда я несколько раз скачивала), а не могли бы вы мне на мейл отправить? или сказать где исходник взяли. уж очень мне этот пдеер понравился

Carmen Queasy комментирует...

разбираюсь уже битый час. По-моему вся проблема - найти интересующий файл в открытом доступе в интернете. Хочу выложить cafe del mar - sun is shining (bob marley) Решила воспользоваться вашими советами - но никак не могу найти этот файл в открытом доступе!

Carmen Queasy комментирует...

Скажите, если я воспользуюсь этим советом с аудиоплеером http://junglebook2007.narod.ru/audio/playe
-можно ли указать путь к файлу, находящегося на компьютере?
Вопрос аналогичен и для первого рассматриваемого случая

IvanXP комментирует...

Я так понял, Вы хотите проигрывать файл, находящийся у Вас на домашнем компьютере? Нет, так нельзя. И не спрашивайте почему, это долго объяснять. Просто найдите хостинг с прямыми ссылками, а там уже разберётесь.

Carmen Queasy комментирует...

ок, про файлы с компа поняла, спасибо!

Natalie комментирует...

Все по-прежнему, не могу я установить этот плеер на свой сайт. А ничего похожего и простого в нете найти не могу. Если кто-то может мне помочь - очень нужен такой плеер на сайт. Что я только не делала....у меня нет кнопочки плей, а вместо нее просто квадратики пустые и ничего не проигрывается...Пожалуйста, ну ОЧЕНЬ ОЧЕНЬ ОЧЕНЬ нужно помогите разобраться в чем проблемаю

IvanXP комментирует...

Даже не знаю как помочь. Установка плеера - всего одна строка. После чего нужно просто указать прямые ссылки на mp3 файлы. И всего-то. Если можно покажите страницу, где Вы проделываете это и ничего не выходит.

Natalie комментирует...

http://www.mobilemusic.org.ua/index/abc/091.php
это тестовая ссылка сайта. на всем сайте сейчас скрипт услуги (и плеера в том числе) SMScoin, но я хочу уйти с нее, вот и ищу подобный плеер.
если удастся разобраться в чем там дело - буду очень признательна.

IvanXP комментирует...

Я так понял, Вы скачали исходники плеера и установили себе на сайт. Теперь откройте в текстовом редакторе файл mp3_player/player.js и обратите внимание на строки типа "http://full_ path_ to_ play.gif". Эту строку надо заменить на полный путь к файлам-картинкам (play и pause). Тогда у вас появятся иконки плеера.

IvanXP комментирует...

Также смотрите другие подсказки "full_path_to_*" и заменяйте их на полные пути к файлам.

Natalie комментирует...

УРРРРААААА!!!!!!!!!!!!!!!! Все вышло!!!!! А сколько времени прошло-то)))) А все ТАК просто. СПАСИБО ВАМ большое!!!! Я 2 месяца лазила по всему интернету, но более простого и такого мне нужного плеера я найти не могла, спасибо!

IvanXP комментирует...

Рад, что смог помочь!

Turist комментирует...

Не знал, что можно вот так просто присоединить к посту аудиоматериал. Спасибо!

Далер комментирует...

отличненько, то что нужно!

garik комментирует...

спасибо автору за заботу! очень помог!

Анонимный комментирует...

!!!!! ПОМОГИТЕ, ПЕРЕСТАЛ РАБОТАТЬ ЭТОТ ПЛЕЕР! Видимо из за того что ссылка в скрипте стала не рабочая...(( Вот эта http://del.icio.us/static/swf/mp3.swf" Как быть теперь ребята???

Саша комментирует...

Замени в скрипте строку:
http://del.icio.us/static/swf/mp3.swf
на
http://store.memories.ks.ua/mp3/player/playtagger.swf


Пример: http://memories.ks.ua/mp3/

Анонимный комментирует...

Спасибо большое брат!

murom комментирует...

Плеер http://googlepage.googlepages.com/player.js</script похоже, умер...

LinkBuff комментирует...

Скажите пожалуйста в чём проблема?
Всё делаю как написано появляется зелёный треугольник, песня, можно прослушивать, но когда нажимаю на ссылку (на название песни) место того что-бы начать скачиваться меня перекидывает на сайт который я указал в прямой ссылке на песню. Если не трудно напишите в VK буду очень благодарен!!! http://vk.com/id148350962

Хамавова Асиль комментирует...

Звук не работает

Отправить комментарий

Примечание. Отправлять комментарии могут только участники этого блога.

 
item