Приветствую всех читателей моего блога!
Сегодня я расскажу о том, как сделать картинку ссылкой. Часто бывает, что иногда, нужно сделать изображение кликабельным, чтобы при клике по нему, пользователи перемещались на другую страницу своего или чужого сайта. А вот как это сделать, я сейчас Вам и расскажу.
Ещё не забывайте о том, что каждая картинка, должна быть правильно оптимизирована. И об этом, можете прочитать тут (там же есть подробный видео урок) и узнать о том, как делается раскрутка картинками.
Как сделать картинку ссылкой html
Сделать картинку ссылкой html очень просто. Сама картинка, которую нужно сделать ссылкой, состоит из 2 частей:
- Изображения, которое Вы загрузили на страницу сайта.
- Ссылка на страницу сайта, куда пользователи будут переходить при клике на это изображение.
Вот конструкция html кода, чтобы сделать картинку ссылкой, которую можете использовать:
<a href="адрес ссылки"><img src="адрес картинки" alt="" /></a>
Пошагово это выглядит так:
Загружаете на сайт картинку, копируете её полный адрес (папку, в которой она находится) и вставляете в предназначенное для адреса место кода, который я дал выше. А в начало этого кода, вставляете адрес ссылки, куда при клике по картинке, будут перемещаться пользователи.
Теперь, предлагаю пример кликабельного изображения. Нажмите на него!
Вот html код этого изображения:
<a href=»http://nuzhnaya-infa.ru/skachat-besplatnye-obuchayushhie-knigi-besplatnye-elektronnye-knigi/»><img title=»Как сделать картинку ссылкой» alt=»Как сделать картинку ссылкой» src=»http://nuzhnaya-infa.ru/wp-content/uploads/2015/01/kak-sdelat-kartinku-ssylkoj.jpg» width=»288″ height=»216″ /></a> Нажми на картинку и скачай 7 Подарков!
Что обозначает каждый отрезок кода:
a href=»http://nuzhnaya-infa.ru/skachat-besplatnye-obuchayushhie-knigi-besplatnye-elektronnye-knigi/ это адрес ссылки, на которую будут переходить пользователи, после клика по картинке.
<img title=»Как сделать картинку ссылкой» alt=»Как сделать картинку ссылкой» src= это Прописанные: Заголовок и Описание изображения.
«http://nuzhnaya-infa.ru/wp-content/uploads/2015/01/kak-sdelat-kartinku-ssylkoj.jpg» width=»288″ height=»216″ это адрес картинки на моём сайте (папка, название литиницей и размеры).
</a> Нажми на картинку и скачай 7 Подарков! это описание, которое Вы можете видеть под картинкой.
Как сделать картинку ссылкой на wordpress
Сделать картинку ссылкой на wordrese, да и на всех остальных ssms просто. Как обычно загружаете картинку в статью. Дальше заходите в редактирование изображения и там в графе «Ссылка», прописывается адрес изображения, вставляя в это поле, ссылку на любую страницу своего или другого сайта.
На скриншоте я показал куда вставлять ссылку. Удаляете её прежний адрес и вместо него вставляете ссылку.
После этого сохраняете изменения, обновляете страницу с картинкой и при нажатии на неё курсором мышки, Вы переместитесь на ту страницу сайта, ссылку на которую указали.
Вот и всё! надеюсь, что эта статья помогла Вам найти ответ на вопрос, как сделать картинку со ссылкой. Удачи!В качестве примера, предлагаю картинку, нажав на которую, Вы переместитесь на другую страницу моего сайта.
В завершении статьи, узнайте, как определить движок сайта и как сделать кнопку Купить.