Руководство для начинающих: как создать аудиоплеер в WordPress без плагинов

Хотите создать звуковой плейлист в WordPress? Вам не нужен специальный плагин для плейлистов. WordPress предоставляет несколько способов создания аудио-плейлиста, используя только основные функции.

В этом посте вы узнаете, как создать звуковой плейлист WordPress несколькими вариантами:

  • Загрузка собственных аудиофайлов и создание списка воспроизведения из панели инструментов WordPress
  • Вставка аудио-плейлиста из внешней службы, например Spotify или SoundCloud

Метод №1: Используйте встроенную функцию воспроизведения плейлиста в WordPress

WordPress включает в себя функцию воспроизведения аудиоклипов, встроенную в основную медиабиблиотеку.

Чтобы начать работу, сначала необходимо загрузить свои аудиофайлы с помощью обычной кнопки «Добавить медиафайл».  Вы можете использовать следующие расширения файлов:

  • mp3
  • OGG
  • WMA
  • m4a
  • WAV

После того, как вы загрузите свои аудиофайлы, вы сможете редактировать метаданные в разделе справа «Детали вложения», когда вы выбираете аудиофайл. Важно, чтобы вы сделали эту информацию точным, потому что в вашем аудио-плейлисте WordPress на переднем конце будет отображаться название, исполнитель и альбом:

Руководство для начинающих - как создать аудиоплеер в WordPress без плагинов

 

После того, как вы загрузили аудиофайлы, которые хотите использовать, и убедились, что у них есть правильная информация, вы можете нажать кнопку «Создать плей-лист» в том же  интерфейсе «Добавить медиафайл»:

 

После того, как вы нажмете на эту ссылку, вы получите приветствие с помощью окна Изменить плей-лист, в котором будут перечислены все ваши звуковые дорожки.

Выберите все треки, которые вы хотите включить в свой список воспроизведения.

Вы также можете перетаскивать файлы, чтобы изменить их порядок в списке воспроизведения аудио WordPress. Список треков проходит сверху слева направо. Трек 1 должен всегда находиться в верхнем левом углу и конечная дорожка в правом нижнем углу.

Кроме того, вы можете использовать область  настроек списка воспроизведения справа, чтобы настроить, как выглядит ваш плейлист в WordPress, например, показывать ли имя исполнителя или миниатюру изображения:

Руководство для начинающих - как создать аудиоплеер в WordPress без плагинов

 

После того, как вы удовлетворены плейлистом и настройками, вы можете нажать «Вставить плей-лист аудио» в нижнем правом углу, чтобы добавить свой аудио-плейлист в сообщение или страницу WordPress. Затем просто опубликуйте пост или страницу, как обычно, и ваши посетители могут начать взаимодействовать с плейлистом:

Руководство для начинающих - как создать аудиоплеер в WordPress без плагинов

Использование виджета WordPress Text

Если вы хотите разместить аналогичный плейлист WordPress на боковой панели своего сайта, вы можете использовать виджет «Текст».

Для начала перейдите в  Внешний вид -> Виджеты. Затем перетащите  виджет «Текст». Оттуда нажмите кнопку «Добавить медиафайл», и вы сможете выполнить те же шаги что сверху, чтобы вставить в виджет аудио-плейлист:

Руководство для начинающих - как создать аудиоплеер в WordPress без плагинов

 

Способ №2: Добавить аудио-плейлист в WordPress из Spotify

Еще одна действительно классная функция WordPress — это поддержка OEmbed. oEmbed — это формат, который позволяет отображать контент с отдельного URL-адреса без размещения контента самостоятельно.

WordPress поддерживает создание Spotify с версии v3.6.  Большим преимуществом здесь является то, что вы не размещаете какие-либо файлы самостоятельно, все еще получая преимущества огромной библиотеки аудиофайлов Spotify.

Чтобы создать ссылку для встраивания:

  • Нажмите на три точки на панели инструментов Spotify.
  • Наведите указатель мыши на пункт меню «Общий доступ» 
  • Выберите вариант копировать ссылку плейлист

Руководство для начинающих - как создать аудиоплеер в WordPress без плагинов

 

Затем просто вставьте эту ссылку в редактор WordPress (убедитесь, что вы используете  редактор Visual). WordPress автоматически вставляет плейлист для вас из ссылки:

Руководство для начинающих - как создать аудиоплеер в WordPress без плагинов

 

Теперь просто опубликуйте или обновите пост, и у вас будет приятный внешний аудио-плейлист WordPress, предоставленный Spotify:

Руководство для начинающих - как создать аудиоплеер в WordPress без плагинов

 

Если вы хотите, вы также можете использовать аналогичный метод для встраивания плейлиста Spotify в текстовый виджет WordPress.

Хотя этот метод удобен, он имеет два заметных недостатка:

  • У вас мало контроля над тем, как выглядит окно. Если вы хотите внести изменения, вам нужен полный код для встраивания.
  • Если у вас есть международная аудитория, ваши пользователи, возможно, еще не имеют доступа к Spotify.

Метод №3: добавьте аудио-плейлист в WordPress из SoundCloud

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

Самый простой способ — просто вставить прямую ссылку в плейлист SoundCloud в редактор WordPress. Как и Spotify, WordPress автоматически встраивает плейлист:

Руководство для начинающих - как создать аудиоплеер в WordPress без плагинов

 

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

Чтобы начать работу, перейдите к SoundCloud и найдите список воспроизведения, который вам нужен для вашего сайта. Затем найдите кнопку «Поделиться»:

Руководство для начинающих - как создать аудиоплеер в WordPress без плагинов

Как только вы нажмете «Поделиться», выберите вариант «Вставить». Вы увидите, что очень легко настроить звуковой плейлист SoundCloud. SoundCloud дает вам возможность выбрать заголовок, цвет, высоту. Вы даже можете включить автозапуск, хотя это может быть не очень хорошая идея для показателя отказов вашего сайта.

Руководство для начинающих - как создать аудиоплеер в WordPress без плагинов

 

Затем скопируйте код вставки и вернитесь в текстовый редактор. Убедитесь, что вы вставляете код во вкладку «Текст». Затем вы можете публиковать или обновить пост, как обычно:

Руководство для начинающих - как создать аудиоплеер в WordPress без плагинов

Если вы хотите, вы также можете использовать аналогичный метод для встраивания плейлиста SoundCloud в текстовый виджет WordPress.

Вывод

Добавление аудио-плейлиста в WordPress не обязательно должно быть сложным приключением для кодирования или покупкой плагина. Когда вы добавляете аудио-плейлист в WordPress, у вас есть несколько отличных вариантов. Вы можете добавить свой собственный звуковой плейлист с помощью собственной кнопки Добавить медиа-файл, или вы можете использовать функцию oEmbed для добавления списков воспроизведения Spotify или SoundCloud на любую страницу или пост на своем веб-сайте.

Вы также можете использовать все три метода выше в виджета WordPress Text, если хотите разместить плейлист на боковой панели.

 



2018-08-24T10:21:50
Лучшие учебники по Wodpress