Думала я думала и решила попробовать научить вас, дорогие мои друзья и те, кто регулярно заходит ко мне в гости, делать для себя и своих нужд вот такие веселые плееры
Конечно, это совсем не те плееры, которые делаю я в специальной программе, но зато без всяких специальных навыков вы легко сможете сделать свой собственный плеер с нужной вам картинкой и вставить в него свою собственную музыку. Для этого вам достаточно выбрать интересную картинку, лучше анимационную, песню и вид кнопки из числа тех, которые я для вас сделала. И всё…
Итак, давайте начнём… Для лёгкости будем «собирать» плеер с танцующим зайчиком.
Шаг первый. Выбираем понравившуюся картинку – у нас это танцующий зайчик. Если картинка у вас находится не на Яндекс-фотках, то надо её туда загрузить. Думаю, все знают, как это сделать. После чего берём с Яндекс-фотки код нашей картинки – вот он
<a href="http://fotki.yandex.ru/users/fotokollazh-mif/view/422161/"><img src="http://img-fotki.yandex.ru/get/2708/130761172.35/0_67111_52a6d802_S.jpg" width="106" height="101" title="" alt="" border="0"/></a><br/><a href="http://fotki.yandex.ru/users/fotokollazh-mif/view/422161/">ПосмотретьнаЯндекс.Фотках</a> Но в этом коде много лишнего, поэтому мы его «укорачиваем» и оставляем только нужную его часть, а именно, вот эту (серёдку)
<img src="http://img-fotki.yandex.ru/get/2708/130761172.35/0_67111_52a6d802_S.jpg" width="106" height="101" title="" alt="" border="0"/>
Можно пойди еще дальше и убрать лишнее и в оставшейся части, но это уже на ваше усмотрение. В идеале нужный код имеет вот такой вид (сравните с предыдущим и увидите, что мы убрали ещё)
<img src="http://img-fotki.yandex.ru/get/2708/130761172.35/0_67111_52a6d802_S.jpg" width="106" height="101">
Итак, первый элемент нашего плеера мы получили – это код картинки
Шаг второй. Выбираем из коллекции понравившуюся кнопку и берём её код – у нас это кнопка вот с таким кодом
<embed src="http://fotokollazh-mif.narod2.ru/Pleery_kn/kn_1_zv.swf?mp3=ССЫЛКА НА ПЕСНЮ" wmode="transparent" width="185" height="45">
Шаг третий. Выбираем музыку, которую хотим поставить в свой плеер. Вот в этой части у большинства, скорее всего, и будут проблемы. Дело в том, что в любой плеер вставляется не ФАЙЛ песни, а ССЫЛКА на эту песню. Чтобы не усложнять данный урок, я не буду здесь описывать, как из любого файла песни получить именно ССЫЛКУ на песню. Я об этом подробно расскажу в следующем уроке. А сейчас мы берем уже готовую ссылку на песню, которая у меня есть. Ссылка имеет такой вид
http://fotokollazh-mif.narod2.ru/Muzyka/barbariki_-_planeta_romashek.mp3
Шаг четвёртый. Теперь мы просто объединяем все наши коды – код картинки + код кнопки + ссылку на песню – в единое целое вот таким образом:
Сначала записываем код картинки
<imgsrc="http://img-fotki.yandex.ru/get/2708/130761172.35/0_67111_52a6d802_S.jpg" width="106" height="101">
Под ним записываем код кнопки. Получаем вот такую конструкцию
<imgsrc="http://img-fotki.yandex.ru/get/2708/130761172.35/0_67111_52a6d802_S.jpg" width="106" height="101"> <embed src="http://fotokollazh-mif.narod2.ru/Pleery_kn/kn_1_zv.swf?mp3=ССЫЛКА НА ПЕСНЮ" wmode="transparent" width="185" height="45">
Теперь в коде КНОПКИ вместо слов ССЫЛКА НА ПЕСНЮ вставляем нашу ссылку на песню. В результате получим уже вот такой вид нашего общего кода плеера
<img src="http://img-fotki.yandex.ru/get/2708/130761172.35/0_67111_52a6d802_S.jpg" width="106" height="101"> <embed src="http://fotokollazh-mif.narod2.ru/Pleery_kn/kn_1_zv.swf?mp3= http://fotokollazh-mif.narod2.ru/Muzyka/barbariki_-_planeta_romashek.mp3" wmode="transparent" width="185" height="45">
Чтобы плеер стоял посередине, перед началом кода поставим <center>Получим такой вид <center><img src="http://img-fotki.yandex.ru/get/2708/130761172.35/0_67111_52a6d802_S.jpg" width="106" height="101"> <embed src="http://fotokollazh-mif.narod2.ru/Pleery_kn/kn_1_zv.swf?mp3= http://fotokollazh-mif.narod2.ru/Muzyka/barbariki_-_planeta_romashek.mp3" wmode="transparent" width="185" height="45"> И вот как это выглядит, когда всю эту конструкцию мы вставим в пост (не забываем, что вставлять код в пост надо в HTML-режиме)
Как видим, кнопка плеера находится несколько левее самой картинки. Чтобы исправить такой недочёт, мы перед кодом КНОПКИ ставим вот такие символы
Количество таких последовательных символов мы подбираем сами, исходя из расположения кнопки. В нашем случае надо вставить 11 таких символов. И тогда наш код будет иметь вот такой вид
<center><img src="http://img-fotki.yandex.ru/get/2708/130761172.35/0_67111_52a6d802_S.jpg" width="106" height="101"> <embed src="http://fotokollazh-mif.narod2.ru/Pleery_kn/kn_1_zv.swf?mp3= http://fotokollazh-mif.narod2.ru/Muzyka/barbariki_-_planeta_romashek.mp3" wmode="transparent" width="185" height="45">
А сам плеер в посте будет выглядеть так
Всё, плеер готов, нажимаем на кнопочку и танцуем вместе с зайчиком.
Пробуйте, у кого будут сложности – пишите… Удачи вам!
|
