Как самому сделать весёлый плеер без специальных навыков и программ Урок

Среда, 15 Января 2014 г. 08:29 + в цитатник

Как сделать для себя и своих нужд вот такие веселые плееры

Без всяких навыков вы легко сможете сделать свой собственный с нужной вам картинкой и вставить в него свою музыку. Для этого вам достаточно выбрать интересную картинку, лучше анимационную, песню и вид кнопки и всё...Думаю, что проблем с поиском кнопок у вас нет, их полно в сети. Кстати, напоминаю вам об уроке, который я выставляла недавно, когда анимационная картинка с Яндекс.фоток бывает со стрелочкой в углу и она по этой причине будет обычной картинкой. Кто пропустил, почитайте.
Итак:
Шаг первый. Выбираем понравившуюся картинку – для примера я взяла анимашку танцующего парниши. Я взяла код картинки с Яндекс.фоток – вот он
<a href="http://fotki.yandex.ru/users/ninyurova2008/view/423324/"><img src="//img-fotki.yandex.ru/get/5817/39663434.59/0_6759c_adee4cfa_S.gif" width="137" height="139" title="" alt="" border="0"/></a>

Но в этом коде много лишнего, поэтому мы его «укорачиваем» и оставляем только нужную его часть, а именно, вот эту (серёдку)
<img src="//img-fotki.yandex.ru/get/5817/39663434.59/0_6759c_adee4cfa_S.gif" width="137" height="139" title="" alt="" border="0"/> (1)

Итак, первый элемент нашего плеера мы получили – это код картинки
Шаг второй. Выбираем кнопку и берём её код – у нас это кнопка вот с таким кодом (спасибо Марине MIF)
<embed src="http://fotokollazh-mif.narod2.ru/Pleery_kn/kn_1_zv.swf?mp3=ССЫЛКА НА ПЕСНЮ" wmode="transparent" width="185" height="45"> (2)

Шаг третий. Выбираем музыку, которую хотим поставить в свой плеер, и переводим её в ссылку .Ссылки на MP3 мы должны взять из кода песни. В конце урока увидите скрин, на котором я показала, обвела красным,как должна выглядеть ссылка на MP3 из плеера с сайта привет.ру. В нашем случае ссылка имеет такой вид:
(3) http://fotokollazh-mif.narod.ru/Muzyka/barbariki_-_planeta_romashek.mp3

Шаг четвёртый. Теперь мы просто объединяем все наши коды – код картинки + код кнопки + ссылку на песню – в единое целое вот таким образом:
Сначала записываем код картинки (1)
<img src="//img-fotki.yandex.ru/get/5817/39663434.59/0_6759c_adee4cfa_S.gif" width="137" height="139" title="" alt="" border="0"/>

Под ним записываем код кнопки (2). Получаем вот такую конструкцию
<img src="//img-fotki.yandex.ru/get/2708/130761172.35/0_67111_52a6d802_S.jpg" width="106" height="101" title="" alt="" border="0"/>
<embed src="http://fotokollazh-mif.narod2.ru/Pleery_kn/kn_1_zv.swf?mp3=ССЫЛКА НА ПЕСНЮ" wmode="transparent" width="185" height="45">

Теперь в коде кнопки (2) вместо слов ССЫЛКА НА ПЕСНЮ вставляем нашу ссылку на песню (3). В результате получим уже вот такой вид нашего общего кода плеера
<img src="//img-fotki.yandex.ru/get/5817/39663434.59/0_6759c_adee4cfa_S.gif" width="137" height="139" title="" alt="" border="0" />
<embed src="http://fotokollazh-mif.narod2.ru/Pleery_kn/kn_1_zv.swf?mp3=%20http://fotokollazh-mif.narod2.ru/Muzyka/barbariki_-_planeta_romashek.mp3" wmode="transparent" width="185" height="45">

И вот как это выглядит, когда всю эту конструкцию мы вставим в пост (не забываем, что вставлять код в пост надо в простом редакторе)

Всё, плеер готов, нажимаем на кнопочку и зажигаем
Теперь скрин: