Мобильный LiveInternet Плеер в блог с русским плейлистом

Авторизация

Дневник Babiki Лента друзей - Дневник - Полная версия

Плеер в блог с русским плейлистом 08-03-2015 12:22 к комментариям - к полной версии - понравилось!

Это цитата сообщения zis_3 Оригинальное сообщение

Плеер в блог с русским плейлистом

Предлагаю вам еще один плеер в блог :

В чем его плюс? В том что это:
1. Плеер с плейлистом.
Но для него не нужно никаrих дополнительных файлов. И в блог ЛиРу его можно встравить просто так - будет играть несколько файлов. Достаточно иметь прямые ссылки (URL) mp3 файлов. (если точнее, то нужно целых 2 доп. файла: файл с плейлистом и файл с настройками цвета; но я сделал так что вам не придется эти файлы размещать где-то на стороннем хостинге и разбираться как их правильно подключить)
2. Плеер понимает русские буквы.
Т.е. можно в плейлисте указать русское название песни и/или автора - и работает :)
3. Плеер можно настроить в желаемой цветовой схеме.
Настроек целых 18... правда и настраивать его довольно долго. Поэтому можно выбрать одну из готовых цветовых схем.
4. Самому собирать код плеера не нужно.
Можно воспользоваться скриптом, который сам соберет код. Вам нужно лишь определиться с тем какие mp3 файлы вам нужны в плеере, и воспользоваться конструктором
http://www.favormusic.ru/generator_ru.html
, а потом просто скопировать полученный код себе в блог.
5. Плеер помнит свое текущее состояние, поэтому при переходе со страницы на страницу корректно продолжает играть. На странице конструктора есть инструкция, но я напишу подробнее, с пошаговым примером.
Для примера я взял 3 композиции, заранее залью их на ЛиРу:
Ва-банк - Я без тебя - http://img1.liveinternet.ru/images/attach/c/0//3735/3735434_baletvabankya_bez_tebya.mp3
he Bad Touch- The Bloodhound Gang - http://img1.liveinternet.ru/images/attach/c/1//3781/3781722_bloodhound_gang__the_bad_touch.mp3
Hit The Road, Jack - Ray Charles - http://img0.liveinternet.ru/images/attach/c/1//3784/3784442_ray_charles__hit_the_road_jack_.mp3
Но вы можете воспользоваться любым муз. файлом - достаточно того чтобы у него был прямой URL.
(О прямых ссылках на файлы и о том как их получить можно почитать вот тут: http://www.aliveinternet.ru/post127898103/ ). 1. Собираем плейлист.
Заходим на страницу конструктора, и по одному вводим каждую композицию (название, автора или исполнителя, и адрес файла).
Вводим первую композицию, нажимаем кнопку "Добавить в плейлист"; вводимв вторую, опять назимаем кнопку "Добавить в плейлист", вводим 3-ю и опять жмем "Добавить в плейлист". Чуть ниже отображается то что находится в плейлисте на текущий момент.
Если при вводе допущена ошибка - можно очистить плейлист и начать с начала - для этого есть кнопка "Очистить плейлист"; но лучше сразу вводить акуратно, т.к. кнопка ситрает все, и придется вводить все с начала. После того как все нужные композиции занесены в плейлист, можно заняться цветовыми схемами.
2. Настраиваем цвета плеера.
Есть готовые цветовые схемы (пока их немного, но надеюсь будет больше). Просто выбираем подходящую и жмем справа от нее на кнопку "Выбрать". Хотя можно этого и не делать: по умолчаниюактивна схема №1 - та что использована в плеере в заголовке.
Если ни одна схема не подходит - то можно самому выбрать цвета плеера. Жму "Своя настройка цветовой схемы " - разворачивается конструктор цветовых схем. Тут можно поставить свои цвета, но есть нюанс: после того как вы введете код цвета следует нажать рядом кнопочку "Установить цвет". По нажатиии кнопки скрип проверит верность ввода цвета и окрасит в него проверочное поле. Если кнопку не нажать - скрипт не поймет введенный цвет.
Это сделано для того чтобы вы могли менять цвета, подбирать их под дизайн своего блога независимо от плейлиста, и в случае чего изменить один или насколько цветов без того чтобы набирать плейлист заново.
Ввести нужно все цвета, на странице есть ссылка на более-менее удобную таблицу цветов.Устанавливаем желаемые цвета, и после этого нажимаем кнопку "Установить выбранную схему цветов" - только после этого выбранная схема станет активной. Если эту кнопку не нажать - ее скрипт просто не воспримет.
3. Смотрим результат и получаем код.
Для этого служит кнопка "Посмотреть результат и получить код для вставки". Откроется окошко, в котором вы увидете собранный вами плеер, в т.ч. и собранный вами плейлист и цветовую схему плейлиста; а так же код этого плеера для вставки в блог.
Если что-то вас не устраивает - просто закройте окошко, при этом в основном окне конструктора ничего не потеряется. Вы сможете довести цветовую схему до желаемой, добавить в плейлист композиции или же набрать плейлист заново. Когда все готово - опять жмите "Установить выбранную схему цветов" (если вы вносили изменения в цветовую схему) и "Посмотреть результат и получить код для вставки".
Когда плейлист и цвета плеера вас устроят - просто скопируйте код плеера и вставьте его в свой блог.
Разумеется, для ЛиРушного блога нужно копировать код в поле "Код для ЛиРу",
для ЖЖ и других блогов следует копировать код из поля "Код для HTML".

"Код для HTML" годится для автономных блогов, страниц на HTML.... ну и может быть еще для каких-то блогов, которые понимают HTML.
4. Последние штрихи.
Стндартная высота плеера установлена в 247; но вы можете руками изменить это значение. Я рекомендую ставить не меньше чем 87, но вы можете сами пожкспериментировать с высотой плеера.
Если хотите чтобы все композиции были видны - установите высоту так: количество композиций умножить на 20 плюс 27; т.е. для моих 3-х композиций я поставил 3х20+27=87.
Плеер имеет свою память.
Поэтому если Вы его, например, разместите в шапке блога, то при переходе по вашим страницам плеер будет продолжать играть (так же как и "Музыка" в боковой панели блога. Разница лишь в том что будут видны играемые композиции, и можно будет переходить с одной на другую как вам захочется, а не проматывая по одной. Плюс цвет можно ствой поставить.
5. Добавить цветовую схему на страницу конструктора
Если у вас вышла удачная цветовая схема и вы хотите чтобы я ее добавил на страницу конструктора .... тогда вашей схемой смогут воспользоваться другие блоггеры. И Вы сами в следующий раз :)
Для этого надо отправить мне схему. Проще всего отправить мне ЛС или емейл со ссылкой на уже собранный плеер с вашей цветовой схемой, и я сам разберусь где там коды цвета и как их добавить на страницу конструктора.
Мой емейл указан на странице конструктора.
Авторство схем укажу там же, рядом с Вашей схемой.