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

Сегодня мы продолжим изучение WordPress и html и узнаем как правильно встроить активную ссылку в любую картинку на Вашем сайте.

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

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

Меню редактировать изображение

После этого, в меню «Параметры изображения» в выпадающем меню «Ссылка» выбрать пункт «Произвольный URL» и вставить адрес на который вы хотите поставить ссылку.

Вставить ссылку в изображение в WP

Как привязать ссылку к картинке с помощью 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>

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

Похожие записи

3 комментария

  1. спасибо, отлично все получилось, ваша статья пятая по счету, и самая доходчивая…. успехов и удачи…

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

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