Если вы решили сделать у себя на сайте «прилипший» рекламный блок в боковой колонке, который будет отображаться на фиксированном месте в окне браузера, несмотря на прокрутку страниц сайта, то данная статья для вас.
Для понимания, о чем идет речь, приведу скриншот главной страницы своего сайта (блок с рекламой я закрасил красным):
Кто-то спросит, для чего это нужно?
Отвечу: расположенный таким образом рекламный блок может повысить ваш доход с рекламы.
Кроме того, вместо рекламы можно аналогичным образом зафиксировать любой другой блок, так что статья будет однозначно полезной для вас!
Фиксированный блок в боковой колонке Вордпресс
Перейдем непосредственно к делу.
Рассматриваемая задача реализуется в три этапа.
На первом этапе нам необходимо добавить в боковую колонку (сайдбар) вашего сайта виджет под названием HTML-код:
В содержимое добавленного виджета нужно скопировать и вставить следующий код:
В котором вместо < !— тут должен быть ваш код рекламы — > нужно разместить скрипт рекламного блока:
На третьем этапе подключаем скрипт, фиксирующий рекламный блок. Для этого добавляем код данного скрипта перед закрывающим тегом < /body > в файле footer.php:
<script type="text/javascript"> function getTopOffset(e) { var y = 0; do { y += e.offsetTop; } while (e = e.offsetParent); return y; } var block = document.getElementById('fixblock'); /* fixblock - значение атрибута id блока */ if ( null != block ) { var topPos = getTopOffset( block ); window.onscroll = function() { var newcss = (topPos < window.pageYOffset) ? 'top:20px; position: fixed;' : 'position:static;'; block.setAttribute( 'style', newcss ); } } </script> |
Готово! Теперь все должно заработать.
Если у вас не получилось зафиксировать рекламный блок в сайдбаре WordPress подобным способом, то вероятнее всего в сайдбаре вашего сайта уже есть блоки с динамической загрузкой содержимого. В этом случае для устранения возникшей проблемы нужно данные динамические блоки убрать.