Внимательные читатели уже знакомы с DowloadHelper, плагином для браузера Mozilla Firefox (почитать и скачать можно в этом посте). Подробно рассказывалось, как с его помощью можно скачивать изображения на странице превью, не открывая каждый исходный файл.

После постов “Как сделать простой MP3-плеер в посте” и “Вставляем в пост видеоплеер, не загружая файлы” больше всего не очень опытных пользователей напугала система “добычи” ссылки на MP3, FLV или, например, MP4-файлы. С плагином DownloadHelper этот процесс превращается в сплошное удовольствие.

Ничего не поняли? :) Посмотрите предыдущий пост с фильмом “Свадебный переполох”, прочитайте указанные выше посты про видео- и mp3-плееры. Принцип такой: находим в Интернете файл и собираем плеер, не загружая видеоаудиофайл, а только указывая на него ссылку. Понятнее?

Покажу на примере...

Решил объединить несколько постов, чтобы весь цикл был под рукой. В этом посте рассказывается, как это делаю я, хотя способов может быть много.

Показан процесс: скачивание видео из Интернета – редактирование видео – загрузка видео на ЛиРу.

Вообще, обычно даётся код для размещения роликов на других сайтах или в дневниках. Как добавить в дневник видео с самого крупного видеохостинга YouTube рассказывалось в посте «Как вставить в пост на Лиру видео YouTube». Есть еще один способ – «Вставляем в пост видеоплеер, не загружая файлы» – который можно использовать на сайтах, если у вас немного места под файлы.

Но если вы решили загрузить видео на «лирушный» сервер, то действуем иначе.

Предварительно потренироваться можно с музыкальными MP3-плеерами (см. пост «Как сделать простой MP3-плеер в посте»)

В некоторых моих постах присутствуют такие простые видеоплееры:

Самое примечательное то, что ни видео, ни какой-либо другой файл загружать-перегружать-выгружать никуда не нужно. Расскажу «пошагово», как я это делаю, на примере плеера из поста с песней, которая будет представлять Украину — «To be Free». Очень подходящее название, «Быть свободным!» А мне будет очень приятно, если вы научитесь это делать: это совершенно не сложно, и я старался писать максимально подробно.

Здравствуйте Друзья! Многие из нас ведут блоги, и многим из нас нравится те или иные картинки! И зачастую мы хотим эту картинку разместить в блоге! Но согласитесь, просто картинка смотрится не совсем симпатично! И сегодня я расскажу, как понравившеюся картинку взять в рамку! Итак: Берем в качестве примера вот эту картинку. Читать далее Спасибо за идею урока и материалы Джулия  Полезные уроки для Блога

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

Часть 1 - Рамочка с фильтром Bordermania.(в Кореле)
Часть 2 - Рамочка с радужным градиентом.( в Сorel )
Часть 3 - Рамочка "Shaddy"
Часть 4 - Обрамляем картинку в рамку.
Часть 5 - Набор для рамки.
Часть 6 - Набор для рамки.
...
Часть 11 - КАРТИНКА В УГЛУ ЗАПИСИ.УРОК 2
Часть 12 - Как расположить картинку между текстом...
Часть 13 - Как изменить ширину рамки

1.Сделай слайд-шоу
2.Сделать видео слайд-шоу
3.Сжать видео для сети.
4.Коды цвета для текстов
5.Сделай для блога кнопку.
6.Как сделать баннер-картинку для блога.
7.Как сделать рамочку для текста самому.
8.Создать фото прикол онлайн.
9.Сделать флеш-часы для блога.
10.Сделать текст с прокруткой.

Рамочки для текстов без картинок:
1.Рамочки для текстов 1
2.Рамочки для текстов 2

Рамочки для текстов с картинками:
1.Рамочки для текстов 3
2.Рамочки для текстов 4
3.Рамочки для текстов 5
4.Рамочки для текстов 6
5.Рамочки для текстов 7 (бабочки)
6.Рамочки для текстов - Адрес Детство
7.Рамочки для текстов 9 (Мачо)
8.Рамочки для текстов 10 (Букет невесты)
9.Рамочки для текстов 11 (Природа)
10.Рамочки для текстов 12 ( Он и Она )
11.Рамочки для текстов (Любовь)
12.Рамочки для текстов (Сердечки)
13.Рамочки для текстов (Котята)
14.Рамочки для текстов (Природа - 2)
15.Рамочки для текстов (Весна)
16.Рамочки для текстов (Подводный мир)
17.Рамочки для текстов (Ночь над городом)
18.Рамочки для текстов ( Он и Она -2 )
19.Рамочки для текста (любовь)
20.Рамочки для текстов (Нежность)
21.Рамочки для текстов (Отдых, море, пляж).
22.Рамочки для текстов (Полевые цветы)

Эпиграфы:
Эпиграфы для блога
Эпиграфы для блога 2
Эпиграфы или просто хорошие изречения.
Эпиграфы или просто хорошие изречения - 2

Картинки:
1.Цветы для Вас!
2.Цветы для Вас!-2
3.Цветы для Вас!-3
4.Улыбнись с Микки Маусом )
5.Скажи СПАСИБО - красиво)
6.Скажи СПАСИБО - красиво) - 2
7.Скажи СПАСИБО - красиво) - 3
8.Пятница в картинках )
9.Спокойной ночи в картинках)
10.С добрым утром в картинках)
11.Смайлик + мультик = хорошее настроение)
12.Смайлик + мультик = хорошее настроение) - 2
13.Смайлик + мультик = хорошее настроение) - 3
14.Щенки и котята (анимация)
15.Привет в картинках)
16.Сердечки (анимашки) 2
17.Сердечки (анимашки)
18.Блеск для Ваших постов)
19.Блеск для Ваших постов -2)
20.Блеск для Ваших постов) 3
21.Малыш Купидон (картинки)
22.С днём рождения в картинках!
23.Пчёлки в картинках)
24.Мишки для Вас)))

Сделаем открытку со стихами. Ввиду того что я ленивый и мне лень искать для примера фоны и текст стихов, я позаимствовал все это у inmira с её поста http://www.liveinternet.ru/users/inmira/post99542587/.

Коды картинок ( видны при редактировании черновика или поста )

Размеры картинок уменьшены что бы они не занимали много места в посте

Сделаем рамку для открытки. Для этого построим таблицу 1х1 - одна строка, один столбец. Для таблицы пропишем background.
В background укажем ссылку на фоновую картинку для рамки

Что бы получилась рамка нужно "лишнее" пространство залить фоном для текста и рисунка.
Что бы это сделать нужно указать background для ячейки тяблицы

Получилось не совсем то что мы хотели. Это потому что мы "забыли" указать отступ от границы таблицы до ячейки таблицы.
Исправим это дописав в тег <table> параметр cellspacing

И все равно ничего не получилось. Все это потому что в дневнике, для таблицы в глобальных стилях указано border-collapse: collape и из-за этого cellspacing игнорируется
Что бы это исправить нужно к <table> добавить стиль style="border-collapse: separate;"

Ура! У нас есть рамка :). Все что нам осталось это вставить в ячейку таблицы рисунок и текст стихов

Весь год, не соврав никому ни на грошь, Мы ждем, как небесную манну, Тот день, когда можно удариться в ложь, Невинно придаться обману! Набрав арсенал завиральный идей, С кощунственным трепетом в теле Мы ловим доверчивых честных людей, Забывших о первоапреле. И мы их находим, смиренных ягнят, Простецки развесивших уши. И стрелы обмана со свистом летят В их светлые, чистые души. Но первоапрельский веселый обман - Сердечная наша потеха. И стрелы не кровь высекают из ран, А добрые искорки смеха. О, как же он весел и как же хорош, Пришедший на смену метелям, Тот праздник, во смех превращающий ложь! Сограждане, с первым апреля!

Не все так просто :). Во первых текст расположен не справа от рисуна, а под ним. Во вторых текст нечитаемый из-за того что цвет текста черный и размер шрифта маленький.
Что бы текст располагался справа от рисунка добавим в код рисунка align="left" в этом случае рисунок будет располагаться слевой стороны ячейки, а текст будет "обтекать" его справа.
Что бы изменить цвет текста и размер шрифта добавим к <td> стиль style="color: #fffcfc; font-size: 18px;". Цвет текста #fffcfc, размер шрифта 18px.

Весь год, не соврав никому ни на грошь, Мы ждем, как небесную манну, Тот день, когда можно удариться в ложь, Невинно придаться обману! Набрав арсенал завиральный идей, С кощунственным трепетом в теле Мы ловим доверчивых честных людей, Забывших о первоапреле. И мы их находим, смиренных ягнят, Простецки развесивших уши. И стрелы обмана со свистом летят В их светлые, чистые души. Но первоапрельский веселый обман - Сердечная наша потеха. И стрелы не кровь высекают из ран, А добрые искорки смеха. О, как же он весел и как же хорош, Пришедший на смену метелям, Тот праздник, во смех превращающий ложь! Сограждане, с первым апреля!

Уже лучше :) Но есть недоработка. Текст заползает под рисунок. Что бы этого не было поместим рисунок текст стихов в тег <div>. со стилем style="float: left" для рисунка и style="float: right" для текста.
Я приведу пример сокрашенного кода что бы было понятнее

Весь год, не соврав никому ни на грошь, Мы ждем, как небесную манну, Тот день, когда можно удариться в ложь, Невинно придаться обману! Набрав арсенал завиральный идей, С кощунственным трепетом в теле Мы ловим доверчивых честных людей, Забывших о первоапреле. И мы их находим, смиренных ягнят, Простецки развесивших уши. И стрелы обмана со свистом летят В их светлые, чистые души. Но первоапрельский веселый обман - Сердечная наша потеха. И стрелы не кровь высекают из ран, А добрые искорки смеха. О, как же он весел и как же хорош, Пришедший на смену метелям, Тот праздник, во смех превращающий ложь! Сограждане, с первым апреля!

Получили практически то что хотели. Осталось привести текст стихов в "божеский" вид. Можно установить галочку "Сохранять переводы строк в тексте.", но я лучше уберу это галочку и добавлю еще один тег <pre>. Все что находится внутри этого тега будет выводится со всеми пробелами и переносами строк.

Вот мы и получили то что хотели.

Весь год, не соврав никому ни на грошь, Мы ждем, как небесную манну, Тот день, когда можно удариться в ложь, Невинно придаться обману! Набрав арсенал завиральный идей, С кощунственным трепетом в теле Мы ловим доверчивых честных людей, Забывших о первоапреле. И мы их находим, смиренных ягнят, Простецки развесивших уши. И стрелы обмана со свистом летят В их светлые, чистые души. Но первоапрельский веселый обман - Сердечная наша потеха. И стрелы не кровь высекают из ран, А добрые искорки смеха. О, как же он весел и как же хорош, Пришедший на смену метелям, Тот праздник, во смех превращающий ложь! Сограждане, с первым апреля!

Предлагаю Вам ознакомиться ещё с одним графическим редактором -Paint.NET 3.5.1 которым можно при желании частично заменить фотошоп. Программа на русском языке и является абсолютно бесплатной.

Сегодня расскажу как с помощью этой программы за 2 минуты вставить фото в рамочку.

1) В программе открываете Файл – Открыть (находите подходящую рамочку и открываете её, если у Вас нет рамочек то посмотрите вот эти возможно что-то Вам подойдет - Для фотошопа - 200 рамок png и 300 рамок для фотошопа.)

ДАЛЕЕ ...