Flector

Audio Player

Audio Player

Плагин Audio Player очень похож на плагин µAudio Player, у них даже названия похожи. Более того, они практически идентичны визуально друг другу. По всей видимости, прародитель у них один и тот же. Но если µAudio Player отличается компактностью и минимализмом, то Audio Player выглядит намного серьезнее, благодаря ряду дополнительных возможностей и настроек. Например, он умеет проигрывать плейлисты. В него встроен визуальный редактор, в котором можно настроить цветовую схему проигрывателя не имея ни малейшего представления о каскадных стилях css. Есть еще опции защиты mp3 от скачивания, настройка громкости по умолчанию, отображение контента в RSS-ленте и многое другое. При всем этом он все равно достаточно простой и удобный плагин, разобраться с которым может за 5 минут абсолютно любой пользователь.

Скачиваем плагин с его домашней страницы и устанавливаем его:

1. Распаковываем архив.

2. Копируем папку audio-player в /wp-content/plugins/.

3. Заходим в админку блога на вкладку "Плагины" и активируем плагин.

Настроить плагин вы сможете в "Параметрах\Audio Player". Плагин поддерживает локализацию через .po файлы, но я не стал переводить его, так как и без русского языка тут должно быть все понятно. По крайней мере, после прочтения данной статьи.

По умолчанию плагин встраивает проигрыватель только для тех mp3-файлов, которые заключены в специальный тег . Если вы хотите, чтобы плагин встроил проигрыватель для всех ссылок на mp3, то поставьте галочку на опции "Replace all links to mp3 files". Но вот тут вы должны знать о важном отличии от плагина µAudio Player - проигрыватель будет выведен сразу, а не при клике на ссылку. Более того, каждая копия проигрывателя будет выводиться в отдельном абзаце, а таким образом, если у вас ссылка на mp3 находится в середине абзаца, то проигрыватель разорвет этот абзац на 2 части.

В плагине можно задать папку для mp3 файлов "Default audio folder location". Это необязательно, но если вы укажите эту папку (и соответственно создадите ее через ftp на сервере), то сможете не указывать полный путь к mp3 файлу при использовании тега плагина . После создания папки проверьте правильность данной настройки через нажатие кнопки "Verify". Если вы все указали правильно, то плагин подтвердит правильность зеленой иконкой:

Audio Player: настройка папки по умолчанию

Использование тега . Вот такой код в тексте записи вашего блога выведет проигрыватель для указанного вами файла:

[audio:http://www.domain.com/mp3-file.mp3]

В неактивном состоянии проигрыватель всегда выглядит так:

Audio Player: компактный вид

В активном состоянии ширина проигрывателя будет такой, как на скриншоте в начале этой статьи. Однако через параметр width можно ее изменить, растянув, к примеру, на всю страницу (на вкладке "Display" в настройках плагина можно указать сразу ширину для всех проигрывателей на сайте). Для этого вставьте в запись такой код:

[audio:http://www.domain.com/mp3-file.mp3|width=100%]

Выглядеть это будет так:

Audio Player: растянутый вид проигрывателя

Чтобы файл или файлы проигрывались без остановки в цикле, используйте код:

[audio:http://www.domain.com/mp3-file.mp3|loop=yes]

Для автостарта проигрывания надо использовать код:

[audio:http://www.domain.com/mp3-file.mp3|autostart=yes]

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

Плейлисты составляются очень просто, надо просто перечислить ссылки на mp3 файлы через запятую:

[audio:http://www.domain.com/1.mp3,http://www.domain.com/2.mp3|loop=yes]

При запуске плейлиста у проигрывателя появляется стрелочка перемотки на следующий трек:

Audio Player: перемотка у проигрывателя

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

[audio:Im_a_looser_baby.mp3,the_end.mp3|loop=yes]

Если вы хотите, чтобы проигрыватель располагался по центру страницы, то откройте файл style.css в папке вашего шаблона и добавьте туда код:

p.audioplayer_container {  
  text-align: center;  
}

Проигрыватель можно вывести не только в записях или страницах. При желании его можно встроить в сайдбар или футер прямым вызовом функции:

<?php if (function_exists("insert_audio_player")) {  
   insert_audio_player("[audio:http://www.domain.com/mp3-file.mp3]");  
} ?>

При этом можно также использовать любые параметры тега вроде автостарта или повторения проигрывания.

Внешний вид проигрывателя вы можете настроить на вкладке "Display" в настройках плагина. Редактор тут визуальный:

Audio Player: визуальный редактор внешнего вида

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

Установленная по умолчанию в настройках плагина на вкладке "Advanced" галочка на опции "Encode mp3 URLs" заставляет плагин шифровать ссылки на mp3 файлы. Не знаю насколько такое шифрование надежно, но так сходу придумать способ расшифровки я не смог. Данная опции полезна в том случае, если вы не хотите, чтобы пользователи качали музыку с вашего сайта.

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

 

Автор плагина: Martin Laine
Страница плагина: http://wordpress.org/extend/plugins/audio-player/
Рассматриваемая версия: 2.0.4.1 от 27.01.2010
Совместимость с версией WordPress: 2.2 и выше.

Понравился пост? Подпишись на обновления по Обновления блога по RSSRSS или Обновления блога на TwitterTwitter !

Книги по веб-программированию интернет магазин

Книги по веб-программированию интернет магазин украинский.

www.knigograd.com.ua

Кодов на скидки

Большой выбор отличных кодов на скидки на портале Promokupons.ru.

promokupons.ru

Комментарии (всего 13 комментариев)

Написать комментарий

(обязательно)

(обязательно, не публикуется)

Для вставки кода используйте кнопку "Код", по умолчанию используется синтаксис подсветки языка "php", вы можете поменять его на любой другой поддерживаемый GeSHi язык, например "javascript", "css", "html4strict", "sql" и тд. Используйте предпросмотр!
 


Подписаться на уведомления без комментирования.


Пингбэки и Трекбэки (всего 1 ссылка)