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

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

Галерея изображений для блоггеров на blogger.com
Галерея с картинок в 2 ряда

 

 

Что бы создать галерею из картинок применим тег 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 

 

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

 

Галерея изображений для blogger
Галерея изображений для blogger

 

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

 

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



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

 

Галерея c фотографий для blogger
Фотогалерея для blogger

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

 

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

 

Фотогалерея для блоггер

 

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

 

Фотогалерея для Blogger

 

Будь вместе с Я блоггер

 

Будь в тренде!

Получай материалы прямиком в свою почту

Я даю согласие на сбор и обработку своих персональных и не персональных данных согласно действующей на сайте — политике конфиденциальности.
* Нажимая на кнопку "Отправить", "Подпишись" или "Комментировать" Вы соглашаетесь с пользовательским соглашением.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Яндекс.Метрика