Как добавить баннер на сайт в новой версии Вордпресс (wordpress) 5.8

Приветствую, читатель, на страницах своего блога!

Многие из нас привыкли к старым виджетам в консоли Вордпресс, но мир не стоит на месте, крутится-вертится, все вокруг меняется и обновляется. Вот и Вордпресс (wordpress) обновляется и радует или огорчает (в зависимости от восприятия и привычек) своими обновлениями. Сегодня мы разберем, как добавить баннер на сайт в новой версии Вордпресс (wordpress).

И в этот раз, начиная с версии 5.8 очень сильно изменилась настройка виджетов, она стала блочной и не такой удобной (с непривычки), как в старой версии Вордпресс. Но ко всему можно приспособиться, если потренироваться.

Буду показывать на своем тестовом домене, как его создать — здесь инструкция. Итак, поехали…

Инструкция

Заходим в консоль Вордпресс своего блога

В консоли, в левой колонке находим вкладку “внешний вид”, наводим на нее курсор мыши и заходим в раздел “виджеты

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

Жму на самую первую вкладку, чтобы раскрыть ее, в моей теме она называется “Область виджетов” и отвечает она за правый (основной сайдбар) блога

Здесь видим набор виджетов, который уже встроен по умолчанию в моей теме:

  • поиск
  • свежие записи
  • свежие комментарии
  • архивы 
  • рубрики
  • мета

В консоли это выглядит вот так 

На самом блоге так

Вставляем баннер в сайдбар с помощью кода

Код выглядит вот так:

Скачайте этот код себе на компьютер. Там мы и будем его редактировать. СКАЧАТЬ КОД>>>

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

  1. Ссылку для картинки
  2. Ссылку на партнерку

Чтобы взять ссылку для картинки нужно ее сперва загрузить в библиотеку медиафайлов консоли Вордпресс. Для этого в левой колонке консоли находим раздел “Медиафайлы”, наводим курсор мыши и выбираем “Библиотека

Перед нами открывается окно “Библиотека файлов”, нажимаем кнопки “Добавить новый” и “Выбрать файл

Выбираем заранее подготовленный файл (картинку), который будет служит баннером в сайдбаре. У меня уже есть заготовленный баннер для партнерки Дмитрия Гида. Выбираю его на своем компьютере двойным кликом и он загружается в библиотеку медиафайлов и теперь кликаю по нему

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

и вставляю ее в заранее скопированный код, где написано — URL картинки — между кавычек

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

Далее иду в партнерский кабинет к Дмитрию Гиду, чтобы взять партнерскую ссылку на бесплатный курс “Золотой путь к деньгам на партнерках”

В левом меню нахожу раздел “Товары”, кликаю на него и нахожу нужную мне ссылку, копирую ее

Вставляю скопированную ссылку в код баннера, вместо надписи “Рекламируемая ссылка

Вот что у меня получилось

Сам код, который получился, цветом выделяю ссылки, на картинку и на партнерский продукт:

<center><a href=» https://dimagid.autoweboffice.ru/?utm_partner=94&utm_source=autoweboffice&utm_medium=partners&utm_campaign=partnerId.94&utm_content=goodsId.20&utm_term=mainlink » target=»_blank» rel=»nofollow»><img src=» http://blogt.aleksandr-egorov.ru/wp-content/uploads/2021/12/poluchit-besplatno.png «/></a></center>

Возвращаемся в консоль Вордпресс к нашим виджетам и сверху нажимаем на значок + (плюс), 

открывается дополнительная боковая панель с блоками, прокручиваем колесико мыши вниз и находим значок “Произвольный HTML

Левой кнопкой мыши зажимаем этот блок и тянем его в область виджетов, размещаю его между блоками “Поиск” и “Свежие записи”

В поле, где написано “Пишите HTML” вставляем готовый код, который только что сделали и в правом верхнем углу жмем “Обновить

Переходим из консоли в блог и обновляем страницу, смотрим, что получилось

Ну вот, чудо и произошло )) Баннер появился на блоге!

Теперь, чтобы проверить все ли работает корректно, навожу курсор на баннер, жму правую кнопку мышки и выбираю пункт “открыть ссылку в режиме инкогнито” (если браузер Гугл Хром), в Фаерфокс “открыть ссылку в новом приватном окне”. Как в остальных браузерах, не знаю, не разбирался, но предполагаю, что существенных различий нет.

В Гугл Хром

Браузер Фаерфокс

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

Тема, как добавить баннер на сайт WordPress закончена. А у вас получилось добавить баннер в сайдбар своего блога? Или может возникли трудности? Пишите в комментарии к статье.

С уважением, Александр Егоров

2 комментария к «Как добавить баннер на сайт в новой версии Вордпресс (wordpress) 5.8»

Добавить комментарий для Юлия Отменить ответ

Ваш адрес email не будет опубликован.

Этот сайт использует Akismet для борьбы со спамом. Узнайте, как обрабатываются ваши данные комментариев.