• Авторизация


Урок по созданию музыкальной открытки 14-07-2019 20:53 к комментариям - к полной версии - понравилось!

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

Урок по созданию музыкальной открытки





Урок по созданию музыкальной открытки


Как и обещала, сделала урок про музыкальные рамки-открытки.


1. Подбираем фоновые картинки для нашей рамки. Получаем их ссылки-адреса через какой-нибудь хостинг (я пользуюсь Радикалом).

Я взяла для примера такие:

1. Контур


//s017.radikal.ru/i441/1511/0c/7f73ad9c6637.jpg

2. Широкая вставка


//s017.radikal.ru/i426/1511/f8/44810002034f.jpg

3. Фон рамки для плеера


//s019.radikal.ru/i605/1511/3b/890fed9f9405.jpg

4. Фоновая картинка


//s014.radikal.ru/i326/1511/fe/0114e289b005.gif



2. Скелет HTML кода рамки копируем в Новую запись дневника




3. Копируем по очереди ссылки подготовленных картинок и вставляем в код вместо моих слов.
Т.е. копируем ссылку первой картинки и вставляем вместо слова "КОНТУР". Затем копируем вторую ссылку и вставляем вместо слов "ШИРОКАЯ ВСТАВКА". И так со всеми картинками.


4. Размер фоновой картинки указываем в тегах width (ширина) и height (высота). Здесь картинка 240х320, поэтому в коде указаны значения width="240" height="320".
Ещё указываем ширину (width) фона под плеер. Здесь указана ширина width="240" (по ширине картинки).

5. На место слов "ПЛЕЕР" вставляется любой подходящий плеер.
Я вставила такой, только белый:



HTML код такого плеера

Скопируем код из окошка, вставим в код рамки и вместо моих слов "ССЫЛКА НА MP3" вставим ссылку на музыку, к примеру такую http://download-sounds.ru/wp-content/uploads3/2012/11/virus-novyigod.mp3

Сменив в коде classic на negative получим черный плеер.
Сменив auto=no на auto=yes получим плеер с автостартом, но с выключением.


6. И получаем готовую музыкальную открытку.






Вариаций создания подобных рамок много: можно делать совсем без контуров и фонов или наоборот добавить ещё фонов... Главное понять принцип построения рамок с помощью HTML тегов.

А можно сделать вот такую открытку http://www.liveinternet.ru/users/win-win-win/post346502774/

Давно не писала уроки, поэтому может что упустила. Что не понятно, пишите, объясню.

Удачи!



Серия сообщений "рамки":

Часть 1 - Рамка к Пасхе.
Часть 2 - Душевная музыка. Светлана Копылова.
Часть 3 - Детская рамочка. Мирилка.
Часть 4 - Музыкальные рамки - открытки
Часть 5 - Урок по созданию музыкальной открытки
Часть 6 - Учимся делать рамочки
Часть 7 - Музыкальный альбом Горячий шоколад
...
Часть 10 - Рамки для постов
Часть 11 - Вставить рамку в пост
Часть 12 - Рамка "Светлой пасхи"




Серия сообщений "Памятка для Лиру":

Часть 1 - Бегущая строка из картинок или текста
Часть 2 - Плееры в дневник
...
Часть 9 - Всё про картинки. Часть 4. Картинки в ряд и столбик.
Часть 10 - Программа для скачивания музыки с Лиру
Часть 11 - Урок по созданию музыкальной открытки
Часть 12 - Фон для поста
Часть 13 - Читать закрытые записи
...
Часть 18 - Развернуть картинку прямо на странице поста
Часть 19 - Вставляем музыкальный плеер в определённое место
Часть 20 - Не показывает видео в дневниках. Браузер Firefox.


вверх^ к полной версии понравилось! в evernote
Комментарии (4):
ВАТ 14-07-2019-21:07 удалить
Теперь Танечка, ты сможешь разные рамочки делать. Главное коды надо найти. А я не люблю накладывать анимацию на картинки по коду или флешки и даже музыку потому, что на сайте они не всегда хорошо встают, поэтому для сайта делаю отдельно картинку и отдельно плеер.
Ответ на комментарий ВАТ # Верочка, для меня это все ново. Я рамочки мало делала, если и делала, то в фотошопе. А это по кодам. Мне понравилась работа с майла, вот я и отвлеклась на эту тему.
ВАТ 14-07-2019-21:23 удалить
Ответ на комментарий Татьяна_Волкова_Литвинова # А я их пробовала делать 5 лет назад. Одна рамочка испортилась почему-то, может быть адреса пропали, не стала её восстанавливать. Если хочешь посмотри вот на этой странице у меня, там и пару уроков есть. https://www.liveinternet.ru/users/5093970/rubric/5527041/
Ответ на комментарий ВАТ # Верочка, спасибо! У меня есть рамочки в закладках. А твоей ссылкой при случае воспользуюсь. А сейчас только посмотрела.


Комментарии (4): вверх^

Вы сейчас не можете прокомментировать это сообщение.

Дневник Урок по созданию музыкальной открытки | Татьяна_Волкова_Литвинова - Дневник Татьяна Волкова (Литвинова) | Лента друзей Татьяна_Волкова_Литвинова / Полная версия Добавить в друзья Страницы: раньше»