Mp3 плеер для сайта

Это мой любимый mp3 плеер для сайта. Выглядит как простая кнопка. Вот, например, можете послушать:

test

Установка

  • Скачивайте архив mp3 плеера.
  • Распаковывайте архив у себя на компьютере. В архиве лежит папка mp3_player. Эту папку вместе с содержимым нужно разместить в корне сайте. Легче всего это сделать по FTP с помощью FTP клиента FileZilla. НЕ ПЕРЕИМЕНОВЫВАЙТЕ ПАПКУ и обязательно ТОЛЬКО в корень сайта. Так как путь к папке прописан в самом скрипте в файле player.js.

Вызов скрипта mp3 плеера на странице

Сначала нужно разместить строку вызова скрипта:

  • В шаблоне. Если данную кнопку Вы будете использовать часто, то лучше всего разместить этот код в шаблоне страницы. Код размещается посте тега <body>
  • На странице Если кнопку нужно разместить всего раз, например как на этой странице, тогда лучше всего разместить код вызова скрипта прямо перед кнопкой. В режиме редактирования страницы HTML вставляете код на страницу.

В любом из двух вариантов этот код на странице должен быть вставлен только один раз. Даже если у Вас будет 10 mp3 файлов на одной странице, код вызова скрипта вставляется на страницу только один раз.

Кнопка плеера на странице сайта

На странице, где должна показаться кнопка плеера в режиме HTML редактирования страницы нужно просто вставить обычную ссылку на mp3 файл.

Если нужно еще одну кнопку – еще одну ссылку. Срипт сам преобразует файл в кнопку, и проигрывает мелодию.

Вот собственно и все. Просто и удобно!!!!


Подпишитесь на RSS канал - если Вы хотите первыми узнавать о новых статьях на сайте!!!

Статьи по теме:

9 Comments

  1. Очень хороший плеер! Спасибо! Единственно есть вопрос: как настроить плеер таким образом, чтобы по завершении проигрывания красная кнопка “Stop” вновь стала синей кнопкой “Play”? На данный момент кнопка “Stop” так и остается на странице. Очень нужен именно такой сценарий. Спасибо!

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

    • Вот, что я нашла на эту тему, по крайней мере по поводу Android:

      Важно!!! В Google Chrome, Яндекс.Браузер и Opera начиная с android 4.1 по android 5.х флеш не работает. Так же это относится ко всем браузерам созданным на базе Chromium.

      Похоже, проблема в том, что эти swf-плееры не поддерживаются портативными устройствами.
      Но я еще покопаюсь…

  3. буду ждать

  4. Я разобрался, спасибо! но появилась ещё одна проблема. на планшете не воспроизводит песню, на айфоне то же. сейчас почти всё на сенсоре, досадно будет, столько время зря убил (( может что подскажете?

    • Да, я проверила, у меня на телефоне тоже не играет музыка. Видимо это особенности самого плеера. От достаточно давний (( Если я найду решение, обязательно Вам напишу.

  5. не работает! локально кнопку видно, залил фото кнопки не показывает. не как не могу подключить песню к кнопке, даже локально! вот ссылка http://stihok.ru/pesni/index.php

    • Андрей, из того что я виже на Вашей странице, так это то, что не хватает слешей.
      Замените:

      на

      А файл

      на

Leave a Reply

Your email address will not be published. Required fields are marked *