Как сделать плавающий виджет

Здравствуйте, уважаемые читатели!

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

Часто в виде виджетов вставляют рекламу. У меня тоже висит рекламный баннер. Но это может быть и реклама от поисковых систем, так называемая контекстная реклама. Теперь представьте ситуацию, что посетитель читает Вашу статью, спускается все ниже и ниже. Сайтбар же остается неподвижным и в какой-то момент скрывается из виду. Но существует способ это избежать.

b10-10

Рекламу на сайт вешают прежде всего для заработка. Поэтому надо, чтобы читатели видели ее постоянно. Она должна привлекать внимание. Поэтому был найден способ сделать так, чтобы при опускании записи вниз рекламный виджет (не обязательно рекламный, любой) так же перемещался вниз и всегда оставался в поле зрения.

Эффективность такой рекламы выше, это доказано на практике. Реализуется такой способ путем установки плагина Q2W3 Fixed Widget. Еще он называется плагином плавающего виджета.Установка стандартная. Бежим на главную вордпресс по адресу wordpress.org и переходим на страницу plugins. 

b1-1

В поисковую строку вводим название плагина, жмем на клавиатуре Enter. 

b2-2

Система находит нужный нам плагин, кликаем по его названию. 

b3-3

Теперь нажимаем по красной кнопке Download Version 4.0.6 (может быть другая версия). 

b4-4

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

b5-5

Теперь кликаем по «Выберите файл». У себя на компьютере в загрузках находим архив с плагином, выделяем его, жмем «Открыть», после чего «Установить» (смотрите скриншот).

b6-6

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

b7-7

Ставим галочку на «Зафиксировать виджет», потом кликаем «Сохранить». 

b8-8

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

Теперь в консоли в разделе «Внешний вид» появилась кнопка «Фикс. Виджеты». Если перейти по ней, то попадаем в раздел настройки. 

b9-9

Здесь Вам надо задать верхний и нижний отступ. Их величина будет зависеть от шаблона Вашего сайта. Верхний отступ это расстояние в пикселях от верха фиксированного виджета до верхней границы окна сайта. Нижний отступ это расстояние снизу. Важно нижний отступ сделать таким, чтобы он был не меньше высоты подвала, иначе виджет будет на него наезжать. Здесь же есть ссылка на русскоязычный форум, на котором можно задать вопросы.

На этом заканчиваю. Устанавливайте плагин и пользуйтесь на здоровье. Но помните два момента.

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

Во-вторых, не ставьте плагин на виджеты контекстной рекламы. Яндекс к этому пока относится безразлично, а вот Гугл это не любит. Гугл считает, что таким образом мы привлекаем к рекламе избыточное внимание и выносит владельцам сайтов предупреждения. А тут не долго и до того, что забанят аккаунт.

Желаю всем всего самого наилучшего.

С уважением, Владислав Заболотный.

 

 

Поделитесь статьей в соцсетях.

Комментарии (10) на “Как сделать плавающий виджет”

  • Сергей:

    Да,Вы просто профи, прекрасно написана статья,есть чему поучиться,а мой сайт тяжело появляется

    • Владислав Заболотный:

      Спасибо, но я не профи, а просто чуть дольше в теме. У меня складывается впечатление, что разобраться во всех тонкостях сайтостроения это все равно что получить второе высшее образование. Но ведь об этом все скромно молчат.

  • Спасибо, Владислав, за подробную статью. Я только начала делать свой сайт и знаний не хватает. Буду пользоваться Вашими советами.

  • Зинаида:

    Здравствуйте,Владислав.Темой сайтостроения интересуюсь давно. И ваша статья,как и весь блог просто находка. Спасибо.

  • Владислав, мне кажется, что такой виджет будет просто необходим, если баннер не анимирован и своим «перемигиванием» не привлекает внимание. А по своему печальному опыту советую с Гуглом «держать ухо востро». Когда у меня наконец то рекламный минимум был достигнут в 100 $, то Гугл безо всяких причин закрыл аккаунт. Работайте с Яшей — он надежнее, да и минимум к выводу меньше.

    • Владислав Заболотный:

      Все же я не думаю, что Гоша закрыл Ваш аккаунт чтобы сэкономить 100$. А плавающие виджеты он точно не любит.

  • Владислав, спасибо за статью, вот только думаю сейчас зачем мне этот плавающий виджет? Может он и не нужен вовсе? Только сайт будет подвисать, есть ли в нем жизненная необходимость???? Если баннерная реклама начала загибаться, и посетитель сконцентрирован на контенте, а баннеры попадают в слепое пятно, так зачем же злить Гугл и утежелять сайт???????

    • Владислав Заболотный:

      Если адсенс подключишь, тогда лучше убрать, конечно. А посетитель все же сконцентрирован на том, что привлечет его внимание. Главное, чтобы виджет не мигал, переливался и не раздражал. Пусть себе сидит спокойно всегда на виду, хуже не будет. Сделай себе такой и повесь на него партнерку, например. Контекст все равно пока рано. А про то, что движок грузит, так это любой плагин грузит. Но все же не на столько, чтобы от этого отказываться. Кстати, те плагины, которые не нужны в постоянной работе, лучше отключать.

Оставить комментарий

Хотите зарабатывать?