Часть 5 Пишем в свой блог. 4. Вставка картинок. 3. Выкладываем картинки, вставляем ссылки

Nov 29, 2008 20:50


В верхнее тематическое оглавление

Тематическое оглавление (Уголок блоггера)

предыдущее по теме…………………………………
следующее по теме

предыдущее по другим темам……………
следующее по другим темам



Заведение собственного блога, сайта и электронной почты
Часть 5 Пишем в свой блог. 4. Вставка картинок. 3. Выкладываем картинки, вставляем ссылки

Курс молодого бойца

Теперь второй шаг процедуры - подготавливаем галерею.
В блоге можно или помещать картинки «навалом», или размещать их по галереям, которые служат аналогом папок. Лучше сразу озаботиться и создать нужную галерею, иначе потом, когда фотографий становится много, их трудно найти.

Входим в свой блог и переходим в «Начало»:




Находим группу «Ваш фотоальбом» и щелкаем в строку «Галереи»:





Щелкаем в кнопку «Create a new Gallery»:





В появившейся форме заполняем новые поля. При вводе имени галереи лучше использовать только цифры и латинские буквы - далеко не все программы, с которыми приходится работать, русифицированы. В необязательное поле «Description» можно ввести описание галереи. Оно поможет другим пользователям находить выложенные Вами картинки. Так что если Вы желаете популярности - лучше эти поля заполнять. Можно также выбрать режим доступа к картинкам галереи. Стоящее по умолчанию «Public» говорит, что просматривать картинки можно всем. Потом, при работе с конкретными картинками, можно изменить статус доступа к некоторым картинкам из галереи.





Переходим в нижнюю часть окна и нажимаем на кнопку «Create Gallery».





Галерея создана. Теперь можно загружать картинки. Однако загрузка из этой формы во вновь созданную галерею и дальнейшая загрузка картинок в ранее созданную галерею происходит немного по-разному. Поэтому, чтобы не заучивать лишнее, изучим только второй способ. Вернемся в блог и перейдем «В начало», а та щелкнем в команду «Загрузить»:





Выбираем нужную галерею





Теперь ищем нужный файл. Для этого щелкаем в кнопку «Обзор»:





Появляется стандартное окно выбора файла. Переходим в нужную папку, щелчком левой кнопкой мыши выбираем нужный файл и нажимаем «Открыть». Работа с этой частью операционной системы описана в учебнике, в разделе «Работа с Windows»:





Если браузер настроен нормально, то появляется новое окошко для загрузки еще одного файла, и т.д.





Эти новые появляющиеся объекты - активные элементы. При неправильной настройке работы браузера и «безопасности» Интернета они могут быть отключены. Работать без них очень неудобно, так что лучше порыться в настройках и их включить. Для начинающего пользователя может быть проще установить другой браузер, например, «Opera», и при его установке не указывать опцию «брать параметры загрузки у Internet Explorer».
По окончании выбора нужных файлов нажимаем кнопку «Upload»:





Через некоторое время появляется картинка со списком вновь загруженных картинок. Слева - они в сильно уменьшенном виде, справа - выбранная картинка показывается несколько крупнее. Теперь для нее можно ввести описание и нажать кнопку «Save». А можно этого и не делать:





Для вставки картинки в свой блог выбираем ее в списке слева, а потом щелкаем мышкой по ее изображению справа:





В результате открывается новое окно браузера.





Переходим в этом окне в нижнюю часть и щелкаем мышкой в команду «Post to Journal»





Теперь можно поменять параметры, с которыми картинка будет вставляться в пост.
По умолчанию для вставки создается таблица из двух ячеек в одной строке. В левую вставляется картинка (точнее, ее уменьшенное изображение), в правую - название картинки. Вставку правой ячейки для имени можно отменить.
Размер уменьшенной картинки (по умолчанию: Medium, около 250 точек) можно сделать больше или меньше. Таблица выравнивается так, что она «разрезает» текст и располагается справа. Все это тоже можно поменять.
Для получения кода для вставки нажмем кнопку «Continue»:





В появившемся визуальном редакторе переходим в режим «Html»:





Выделяем и копируем в буфер обмена код для вставки рисунка.





Теперь этот код можно вставить в текст поста:





Теперь нам нужно вернуться в окно с аннотацией загруженных рисунков, закрыв окно визуального редактора с кодом вставки рисунка (но не с текстом поста и с вставленным туда кодом!).

Еще раз - нам нужно закрыть вот это окно:





Здесь конкретные операции зависят от браузера и его настройки, поэтому я смогу описать их только в общем виде.
Для обеспечения одновременной работы с несколькими страницами браузер или запускает еще одну свою копию, или создает новую «закладку». Сейчас нам нужно закрыть лишнюю копию программы или закладку. Если запущена лишняя копия программы, по на панели задач (обычно- внизу, там, где кнопка «Пуск») будет несколько кнопок, например, с надписями «Internet Explorer». Тогда ненужную программу можно закрыть красной кнопкой с крестиков в правом верхнем углу.

Если же браузер открывает новые окна в закладках, но над окном, но ниже адресной строки и панелей инструментов будет набор закладок На приведенном рисунке это:
- Аннотация галереи «Zamki»
- Окно «Яндекса» с поиском по словам «найти человека»
- Яндекс - поиск по ссылкам
- Окно сервиса lj+
- Окно со страницей, найденной по запросу «найти человека»
- Окно базы с поиском телефона по имени (и наоборот)
- Окно визуального редактора (Написать в журнал).

Последняя закладка открыта, но нам с ней больше работать не нужно. Ее можно закрыть, в данном случае - маленькой красной кнопкой с крестиком правее надписи «Написать в ж…».

Итак, закроем эту закладку, а потом щелчком перейдем на закладку «Annotate: Zamki». Выберем следующую картинку и аналогичным образом получим код для вставки.

Разберем полученный код для вставки несколько подробнее:




Желтым фоном выделены комментарии. Они не обрабатываются и служат только для удобства, чтобы было понятнее место начало и окончания кода вставки.

Тег lj-raw - один из специфичных кодов ЖЖ, служащих для передачи в ЖЖ информации о том, что далее пойдет картинка с ее галереи.

Красным фоном выделена разметка таблицы.

Тег table указывает, что начинается таблица, tr - что начинается новая строка, а td - что начинается новая ячейка. В соответствии с общими правилами эти теги с добавленной косой чертой и закрывают такие объекты. Видно, что имеется одна таблица с одной строкой и двумя ячейками, в первой из которых - гиперссылка, а во второй - пусто. При этом во вторую пустую ячейку добавлен тег strong, задающий «строгий» режим форматирования.

Гиперссылки и ссылки на размещенные в Интернете картинки разбирались выше. Видно, что будет отображаться картинка размером 320 на 240 точек, щелчок мышкой по которой вызовет переход в окно показа картинки в полном размере.

Для того чтобы правее картинки в посте было показано пояснение к картинке, его можно ввести в пустую ячейку, между открывающим и закрывающим тегом td.

В параметр «alt» добавим пояснительный текст, который будет появляться при наведении курсора на картинку. В результате получим:




И еще раз напомню, что подготовленный таким образом код можно вставлять не только в пост, но и в профиль и в комментарии.

Учебные материалы, Уголок блоггера

Previous post Next post
Up