Встраиваемый mp3 плеер на сайт - это просто!

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

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

Как встроить mp3 плеер на сайт проще всего?

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

Это все просто, вот только где взять этот “волшебный” код, да и сам флэш плеер?

Я сам, лично, использую два варианта таких плееров, но уверяю вас, если хорошо поискать в интернете – можно найти просто огромное количество!

Одни плееры будут работать за счет интернет сервисов, на которые вы закачиваете свой аудио файл, и взамен получаете код плеера, который вам просто нужно вставить в то место, где вы хотите подключить ваш плеер. Такой подход удобен только с точки экономии пространства на хостинге. Так как любой онлайн сервис может спокойно удалить ваш файл, или временно перестать работать. Для ваших посетителей, если вы делаете качественный сайт – это будет не совсем удобно.

Другой способ, подразумевает непосредственную установку mp3 плеера на хостинг. Впрочем, сам плеер не занимает большого места, всего лишь пару килобайт. А вот аудио файлы – могут весить по несколько мегабайт, естественно, что бы подключить большое количество файлов – понадобиться хорошая порция места на хостинге.

Однако, в наше время, хостинг стоит не так уж и дорого. Тем более, если вы собираетесь разместить один mp3 файл на вашем сайте.

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

Скачать пример встроенных mp3 плееров.

Предупреждения:

1.    Имена mp3 файлов не должны содержать русских букв и пробелов. Иначе аудио не запустится. Должны быть только латинские символы.

2.    Если вы в опциях аудио файла указали  системное название (не путать с именем файла, это название отображается в самом плеере) русскими символами, оно будет отражаться не корректно. Пример вы сможете просмотреть в архиве. Один файл зарубежной песни. Он проигрывается в первом плеере, а второй нашей. Обратите внимание, как отображаются названия песен в плеерах.

3.    У вас может выскочить ошибка о безопасности. Это связано с тем, что плеер пытается взять данные из интернета, будучи расположенным у вас на компьютере.  Смело разрешайте действие и смотрите на результат. Если все перенести на хостинг, ошибка появляться не будет.

4.    Для тех, кто не знаком с HTML, может показаться что-то непонятным. Не волнуйтесь. После того как вы пройдете мою рассылку по обучению созданию сайта. Вы во всем легко разберетесь.

5.    Если нет программы, которой вы бы хотели просмотреть код, тогда вам на страничку про редакторы.

Все технические моменты по размещению mp3 плеера на сайте я написал в коде страницы, которая находится в архиве. Качайте архив и экспериментируйте, если вы найдете вариант лучше – буду рад посмотреть и разместить в этой статье дополнительную информацию.

В папке script размещен скрипт и сами флэш плееры. А в папке music – сами песни.

Все вопросы сунем в комментарии.