Как на сайте WordPress в виджет добавить изображение?

WordPress является довольно гибкой системой относительно создания и редактирования контента, в том числе и работы с изображениями на сайте. Так, “движок” весьма упрощает загрузку и добавление картинок в любом месте Вашего сайта. В этой статье будем разбираться, как без каких-либо трудностей добавить изображение в виджет на боковой панели Вашего WordPress-сайта.

Как на сайте WordPress в виджет добавить изображение?

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

Способ 1. Виджет Изображение

Среди стандартных инструментов, в WordPress присутствует виджет под названием Изображение, основная задача которого выводить на сайте картинки. Для этого необходимо перейти в админ-панели в раздел Внешний вид -> Виджеты и перетащить указанный виджет в желаемое место отображения.

Страница виджетов

Все, что остается сделать, — это в настройках виджета добавить нужное изображение, нажав кнопку Добавить изображение. Тут можно будет добавить тег alt и подпись для фото.

Добавление изображения в виджет Изображение

Для сохранения настроек следует нажать кнопку Сохранить, после чего можно смотреть на сайте.

Главная страница сайта

Способ 2. Виджет Текст

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

Добавление изображения в виджет Текст

Способ 3. Виджет HTML-код

HTML-код — это еще один стандартный WordPress-виджет. Его главная особенность — возможность вставлять строки HTML-кода. Кроме того, он способен также отображать и картинки. Для этого в его поле Содержимое нужно вставить HTML-ссылку на изображение. Чтобы ее посмотреть, необходимо перейти в раздел Медиафайлы -> Библиотека, выбрать нужное фото и в поле URL скопировать ссылку.

Медиабиблиотека

Для вставки картинки в виджете нужно полученный адрес обрамить в тег <img>:

<img src="http://wpshop.loc/wp-content/uploads/2018/05/logotype_-150x68.png" alt="Как на сайте WordPress в виджет добавить изображение?" />

В итоге виджет HTML-код будет выглядеть следующим образом:

Виджет HTML-код

Способ 4. Плагин Image Widget

Если ни один из вышеперечисленных способов Вам не подошел, то можно воспользоваться сторонней решением — бесплатным плагином Image Widget.

Итак, после его установки и активации нужно перейти в раздел виджетов. Видно, что плагин создал собственный виджет с названием Image Widget. Добавление в него изображения аналогично вышеуказанному Изображение. Особенностью плагина является наличие дополнительных настроек вывода фото. Вы сможете, кроме традиционных подписи и тега alt, выбрать размер и выравнивание картинки.

Настройка виджета Image Widget

Курс WordPress-разработчик
Если Вам понравилась статья — поделитесь с друзьями
Михаил Петров