Как вставить картинку в сайдбар сайта на WordPress

Как вставить картинку в сайдбар Здравствуйте друзья. Рад приветствовать всех вас на блоге Spectr-rv.ru. Сегодня я расскажу, как вставить картинку в сайдбар своего сайта на WordPress и, при необходимости, сделать ее ссылкой. Такая картинка-ссылка может потребоваться, например, для того, чтобы направить посетителейна какой-нибудь сторонний ресурс, страницу подписки или просто важный для вас пост.

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

Подготовка картинки к вставке

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

За неимением Photoshop, изображение, предназначенное для вставки, можно доработать в графическом редакторе Paint. Как выполнить сжатие изображений с помощью стандартных средств Windows, подробно рассматривалось ранее.

Для измерения ширины сайдбара, можно воспользоваться экранной линейкой, описанной здесь, или каким-либо подобным инструментом. Определить размеры любого элемента страницы можно также с помощью используемого вами браузера.

В Mozilla Firefox, щелкните ПКМ в любом месте страницы и в меню выберите пункт «Исследовать элемент». Кликните мышкой по значку «Выбрать элемент со страницы», расположенному в левом верхнем углу открывшегося окна, чтобы он «посинел».

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

kartinka 2В Chrome все делается абсолютно так же. Отличием является только название пункта меню для вывода окна инспектирования – здесь он называется «Просмотр кода элемента», и дизайн кнопки выбора элемента.

Так или иначе, ширину сайдбара мы измерили. Остается подготовить картинку и вставить ее в нужное место. Наконец, подготовка изображения закончена – картинка оптимизирована и дожидается вставки.

Вставка картинки в сайдбар

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

Поставьте курсор примерно в центре окна редактирования (режим «Визуально») и нажмите кнопку «Добавить медиафайл». На странице «Вставить медиафайл», щелкните по ссылке «Загрузить файлы» и нажмите кнопку «Выберите файлы». В окне Проводника найдите подготовленную вами картинку, выделите ее и нажмите «Открыть», после чего изображение загрузится в библиотеку медиафайлов.

В области редактирования, в поле «Размер» выберите Полный. Нажмите кнопку «Вставить в запись». После этого изображение должно появиться в окне редактора.

Если вам нужна в сайдбаре просто картинка, следует скопировать сгенерированный код изображения и вставить этот код в виджет «Текст», а сам виджет поместить в сайдбар.

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

Как вставить картинку в сайдбар В открывшемся окне вставьте ссылку на статью или внешний ресурс, на который вы хотите направить посетителей. Поставьте галочку в строке «Открывать в новом окне/вкладке». Щелкните на кнопке «Добавить ссылку».

Чтобы получить код html изображения, перейдите на вкладку «Текст» редактора.

Как вставить картинку в сайдбар Выделите и скопируйте код вашего изображения. Зайдите в меню «Внешний вид» административной панели и выберите пункт «Виджеты». Найдите виджет «Текст» и перетащите его в сайдбар, на то место, где вы хотели бы видеть свою картинку.

Вставьте скопированный код в виджет и, при желании, напишите заголовок. Нажмите кнопку «Сохранить». Перейдите на сайт и убедитесь, что картинка стоит именно там, где планировалось, и при клике на ней, открывается нужная статья. У меня, как можете убедиться из рисунка, все вставилось нормально.

Как вставить картинку в сайдбар Удалите запись, созданную для вставки картинки.

Вот и все. Как видите, вставка изображения в сайдбар – очень простая операция.

На этом я заканчиваю и надеюсь, что статья будет вам полезной. Теперь вы будете знать, как вставить картинку в сайдбар сайта на WordPress, и сможете это сделать, если потребуется. Спасибо за внимание.  Удачи!

Обсуждение: 2 комментария
  1. Владимир, спасибо за информацию! Честно говоря, не знал об использовании «Исследовать элемент», я как-то всё больше Firebug-ом, да программкой определял размеры блоков. Сейчас сравнил с firebug, конечно, не всё отображается, что нужно было бы например, при вёрстке, но для подобных операций, вполне самое то, что нужно. Спасибо за материал!

  2. Владимир:

    Михаил, спасибо за комментарий. Я рад, что материал вам понравился. Заходите еще.

Подписка на обновления

Хотите получать новые статьи на почту? Введите свой e-mail адрес:

© 2017 Полезные советы, программы и сервисы интернета  Войти