Сегодня мы продолжим изучать html и экспериментировать с различными видами ссылок. Как вставить обычную текстовую ссылку, мы уже знаем. Однако есть один вопрос, который мы не рассмотрели, а именно, как вставить ссылку – картинку.

Прежде всего, научимся вставлять в текст просто картинку с помощью html. Для вставки картинок используется тег <img>. Рассмотрим пример:

<img src=»http://site2.ru/files/image.jpg» />

Где:

http://site2.ru/files/image.jpg — это адрес, где находится картинка, которую необходимо вставить. Каким образом сделать эту картинку ссылкой?

Все очень просто. Для начала вспомним, каким образом у нас вставляется ссылка. Для этого используется тег <a>. К примеру, так будет выглядеть код html для вставки ссылки на сайт www.site1.ru с анкором «так будет выглядеть ваша ссылка»:

<a href=”http://www.site1.ru“>так будет выглядеть ваша ссылка</a>

Теперь для того, чтобы превратить нашу ссылку в картинку, нужно все содержимое тега <img> вставить на место анкора в ссылке. В итоге у нас получилось:

<a href=”http://www.site1.ru“><img src=»http://site2.ru/files/image.jpg» /></a>

Как говориться, все гениальное просто.

Как вставить ссылку в картинку с помощью WordPress.

Для того, чтобы достичь того же самого результата в популярной CMS WordPress нужно выделить картинку, которую вы хотите вставить как ссылку и нажать на кнопку «вставить ссылку».

После этого, в меню указать адрес ссылки и способ, которым она будет открываться.

Вот и все. В одном из следующих уроков мы научимся настраивать обтекание картинки текстом с помощью html и css. Читайте Лучший СЕО Блог, ставьте лайки, подписывайтесь на RSS и, разумеется, комментируйте.