Как в блоггере сделать фото кликабельным?

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

На самом деле делается все просто. Только сразу не делайте, до конца дочитайте)))

Итак, как же сделать в blogger кликабельное фото или фото-ссылку?

1. Создаем сообщение. Вставляем фотографию. Допустим из веб-альбома picasa.

2. Открываем в новой вкладке страницу/пост, на которую должен переходить читатель при нажатии на фотографию. Копируем адрес (url) страницы (поста).

3. В новом сообщении переключаем режим на HTML. Для этого существуют две кнопки в левом верхнем углу панели инструментов. Вот они:

 Видите?

По умолчанию мы создаем сообщение в визуальном редакторе (кнопка "Создать"), а нам надо перейти в режим HTML. Просто нажимаем на кнопку.

4. Находим код картинки. Мой код титульной картинки выглядит так:

<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji8FE6PO0YObxbPz30bvLEKZ0VWIplpk0n4hFhluRT40C7u8QcfghWEU6u8sd-f-DzVDNzA6d1E_GOzMurg0fbj4ZWiux6ZGvu92sLIzWhXk7-1vTtUNaZbzscLEZUPWhviOKYMesPS4KM/s1600/IMG_2810.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="252" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji8FE6PO0YObxbPz30bvLEKZ0VWIplpk0n4hFhluRT40C7u8QcfghWEU6u8sd-f-DzVDNzA6d1E_GOzMurg0fbj4ZWiux6ZGvu92sLIzWhXk7-1vTtUNaZbzscLEZUPWhviOKYMesPS4KM/s320/IMG_2810.jpg" width="320" /></a>

То, что выделено красным - это и есть адрес ссылки.  

Меняем его на нужный нам. Для этого просто выделяем его и нажимаем правой кнопкой мышки, выбираем "вставить".

Если мы хотим, чтобы ссылка открывалась в другой вкладке, можем сразу же после кавычек кода добавить вот этот код: target="_blank", тогда при нажатии на фото, нужная нам страничка откроется в новой вкладке.

Теперь полностью мой код картинки выглядит так:

 <div class="separator" style="clear: both; text-align: center;">
<a href="http://dushechki.blogspot.com/2012/09/blog-post_9171.html" target="_blank" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="157" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji8FE6PO0YObxbPz30bvLEKZ0VWIplpk0n4hFhluRT40C7u8QcfghWEU6u8sd-f-DzVDNzA6d1E_GOzMurg0fbj4ZWiux6ZGvu92sLIzWhXk7-1vTtUNaZbzscLEZUPWhviOKYMesPS4KM/s200/IMG_2810.jpg" width="200" /></a></div>

Выделенное голубым - это то, что я изменила в первоначальном коде.

5. Все. Переходим в режим "Создать" и продолжаем писать пост.  Наша картинка теперь ведет туда, куда нам надо)  Проверим? Жмем)

И второй способ. Самый легкий))) Спасибо, Юля!

Юлия Шульган6 октября 2012 г., 13:38

Лена, спасибо большое!! Я очень и очень извиняюсь, но... можно проще.... Загружаем фотку из пикассы, кликаем на нее, чтобы она стала выделенной и нажимаем кнопочку "Ссылка" на верхней панели. Вводим в окошке адрес странички и все. Вот, тестовое сообщение, посмотри, пожалуйста. http://shulgan.blogspot.com/2012/10/blog-post_7084.html Только что создала. 

Юля, так действительно проще. Я подумала и поняла, почему я шла через коды, я еще меняла размеры фотографий. Видимо поэтому ручками правила и не дошло, что можно так просто!! ))

Однозначно надо побольше писать постов о фишках блоггера. Так можно много узнать нового!!! 

  ---------------------------------------------------

Надеюсь инфо будет вам полезной) 

А я , пока Саша летит к нам (в прямом смысле), потопала на кухню запекать с таким трудом найденный в Астане))) кусок свинины на косточке и печь шарлотку.  Я, конечно, еще тот кулинар))) Мой принцип - "быстро и легко". И сейчас я тоже выбрала такие рецепты. Но обещаю показать, что у меня получится))