Создаём музыкальный плеер
с русским плейлистом и любым цветом.
В этом уроке я расскажу Вам, как сделать свой музыкальный
плеер с плей листом.
Для того,что бы создать плеер, нам понадобятся прямые ссылки
на музыку, которую мы будем вставлять в конструктор плеера.
Прямые ссылки на музыку, можно брать в разных местах.
Для своего урока, я воспользовался ссылками своих
сайтов (блогов) Мой мир и Привет.ру.
(урок, Как взять ссылку с сайта Мой Мир и не только...)
И так, заходим на Привет.ру
и в строке Поиск задаём то что Вы желаете найти.
Находим нужную музыку - песню.
(смотрим скриншoт 1)
![](//img-fotki.yandex.ru/get/9229/38620350.23/0_84337_b00c3391_XL.jpg)
Нажав на название открываем нужную песню.
(смотрим скиншoт 2)
![](//img-fotki.yandex.ru/get/6716/38620350.23/0_84338_1d4e486a_XL.jpg)
Жмём на слово "Код для вставки".
Откроется окно с кодом.
Что бы полностью разглядеть весь код, растяните его,
потянув за край рамки.
(Смотрим сриншoт 3)
![](//img-fotki.yandex.ru/get/6719/38620350.23/0_84339_b6e72373_XL.jpg)
Нам понадобится часть кода, на скрине она выделена и выглядит так
http%3A%2F%2Fstat19.privet.ru%2Fmp3%2F0d13c9ee46165aa7eb75f5b8d2ca6489
Выделяем и копируем её.
Далее идём на сайт "Музыка хорошего вкуса"
НА нём мы и будем собирать свой плеер.
(Смотрим сриншoт 4)
![](//img-fotki.yandex.ru/get/9154/38620350.23/0_8433a_f2ad3a30_XL.jpg)
Вводим название песни и вставляем наш код, скопированный с Привет.ру
Жмём на слово "Добавить в плейлист"
Итак, мы добавили одну песню в наш плей лист.
Для вставки второй и последующих песен, повторяем наши действия,
копируем с Привет. ру и вставляем в генератор плеера.
Прямую ссылку на песню,можно брать и с других мест,
например с сайта Мой мир,
не имеет значения, лишь бы была прямая ссылка на песню.
Хочу сказать Вам,что наш плеер может содержать до 8 - 16 песен,
всё зависит от веса музыки, на большее плеер не расчитан.
После того как мы наолнили плейлист,выбираем цветовую схему плеера.
(Смотрим скриншот 5)
![](//img-fotki.yandex.ru/get/9058/38620350.23/0_8433b_4b609d9a_XL.jpg)
Определившись с цветом плеера жмём на слово "Выбрать",
или же, созать свою расцветку плеера,
нажав на строку "Своя настройка цветовой схемы".
Создав свою схему,или же выбрав из предложенных,
жмём на слово "Посмотреть результат".
Откроется вкладка с готовым кодом нашего плеера.
(Смотри скриншот 6)
![](//img-fotki.yandex.ru/get/9167/38620350.23/0_8433c_f93d9d11_XL.jpg)
Копируем наш код плеера и вставляем к себе на ЛиРу!
Вставив наш код плеера к себе, его можно подредактировать,
увеличить или же уменьшить размеры плеера.
(Смотри скриншот 7)
![](//img-fotki.yandex.ru/get/9218/38620350.23/0_84340_7b5f2478_XL.jpg)
Так же, если вам не понравились цвета плеера, их можно поменять в коде.
(Смотри скриншот 8)
![](//img-fotki.yandex.ru/get/9227/38620350.23/0_84342_2adef18f_XL.jpg)
После окончательной настройки цвета плеера,
его можно опубликовать на сайте.
(Смотри скриншот 9)
![](//img-fotki.yandex.ru/get/9220/38620350.23/0_84344_19afe985_XL.jpg)
Ниже я приведу пример назначения и расшифровки некоторых настроек.
Хочу заметить, они относятся не обязательно к этому плееру,
и не стоит вставлять другие значения,которые не содержатся в плеере.
autoplay = авто воспроизведение (0-нет: 1-да)
volume = Первоначальный уровень звука (от 0 до 200)
showstop = Установите значение данного параметра равным 1, чтобы кнопка "Стоп" отображалась на панели плеера, в противном случае укажите showstop=0
showinfo = Установите значение данного параметра равным 1, чтобы кнопка "Информация" отображалась на панели плеера, в противном случае укажите showinfo =0.
showvolume = Установите значение данного параметра равным 1, чтобы кнопка "Уровень Громкости" отображалась на панели плеера, в противном случае укажите showvolume=0.
showslider = Установите значение данного параметра равным 1, чтобы отображать панель плеера, в противном случае укажите showslider=0.
loadingcolor = Задает цвет полосы загрузки.
bgcolor = Задает фон плеера.
bgcolor1 = Задает первый (верхний) цвет фона плеера (в случае использования градиентной заливки).
bgcolor2 = Задает второй (нижний) цвет фона плеера (в случае использования градиентной заливки).
buttoncolor = Задает цвет кнопок.
buttonovercolor = Задает цвет кнопок при наведении мыши.
slidercolor1 = Задает первый (верхний) цвет градиентной заливки бегунка временной шкалы.
slidercolor2 = Задает второй (нижний) цвет градиентной заливки бегунка временной шкалы.
sliderovercolor = Определяет цвет бегунка при наведении мыши.
textcolor = Задает цвет текста.
Вот мы и создалисвой полноценный музыкальный плеер, с любимыми исполнителями и с русскими названиями плейлиста!
Удачи Вам уважаемые друзья и жители ЛиРу!
Для Вас урок создал:
![](//img-fotki.yandex.ru/get/6429/38620350.23/0_82a48_d5ee7eb2_M.gif)
|