Как сделать галерею с картинок в Blogger

 
Здравствуйте, дорогие посетители и подписчики сайта Я блоггер. Как создать галерею из картинок интересует многих начинающих блогеров. Каждому хочется, что бы дизайн его блога был красивым, привлекательным для посетителей. Фотогалерея радует глаз и несомненно привлекает внимание всех и каждого.
 

Что бы создать галерею из картинок применим тег html <table>. С помощью этого тега можно создать таблицу, разбить текст на 2 колонки.

Открываем HTML редактор сообщения под цифрой 2 на скриншоте и вставляем код:

<table>

<tr><td>Картинка1</td>

<td>Картинка 2</td>

<td>Картинка 3</td></tr>

</table>

 

или такой код:

<table border="0"cellspacing="1"cellpadding="1" width="100%"><tr><td>Картинка 1 </td><td>Картинка 2 </td><td>Картинка 3</td> </tr></table>

Добавили, нажимаем на кнопочку СОЗДАТЬ под цифрой 1, в текстовом редакторе сообщения вы не увидите код, там откроются слова:

Картинка 1 Картинка 2 Картинка 3 

Ставим курсор перед каждым словом Картинка и загружаем фотографии, выбираем маленький размер, по желанию добавляем подпись, все галерея готова. Удаляем слова и цифры.

Чтобы сделать 2 ряда, т.е 6 картинок в галерее, после загрузки 3-х картинок, слова картинка 1, картинка 2 и картинка 3 переместятся во второй ряд под изображениями. Делаем все так же как с первым рядом, но если будем делать, как и в первом случае, то второй ряд будет прилипать к первому. Что бы их разделить, ставим курсор перед словом и нажимаем Enter.

Загружать желательно только три фотографии в ряд, четвертая в разных шаблонах может выходить за границы блока контента.

Галерея изображений для блоггеров на blogger.com | Пример второй

Так как я работаю только в html редакторе (что бы лучше и быстрее выучить css и html и понимать как выглядит правильно код любого элемента на сайте) пользуюсь вторым методом.

Открываем в редакторе вкладку HTML, если у вас там есть какой-то код, удаляем, поле ввода должно быть чистым. Загружаем изображения, смотрим как на скриншоте, отмечаем размер маленький, без выравнивания. Таким способом можно загрузить сразу 6 и больше фотографий.

Картинки прижмутся к друг другу, что бы сделать отступ между картинками в html в конце каждой картинки после закрывающего тега </a> ставим спецсимвол html беспрерывный пробел - &nbsp;. Все фотогалерея готова и можно публиковать ее в блог.