amp-web-push-widget button.amp-subscribe { display: inline-flex; align-items: center; border-radius: 5px; border: 0; box-sizing: border-box; margin: 0; padding: 10px 15px; cursor: pointer; outline: none; font-size: 15px; font-weight: 500; background: #4A90E2; margin-top: 7px; color: white; box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.5); -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .amp-logo amp-img{width:190px} .amp-menu input{display:none;}.amp-menu li.menu-item-has-children ul{display:none;}.amp-menu li{position:relative;display:block;}.amp-menu > li a{display:block;} .icon-widgets:before {content: "\e1bd";}.icon-search:before {content: "\e8b6";}.icon-shopping-cart:after {content: "\e8cc";}

Как сделать красивый скроллинг страницы на сайте

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

Скроллинг – это полоса прокрутки, которая отображается в браузерах с правой стороны. Благодаря ей пользователь может прокручивать любую страницу в нужное ему место. Скроллинг страницы определяется настройками браузера и компьютера. И эти настройки могут по внешнему виду не соответствовать дизайну сайта. Такая мелочь может испортить всё впечатление. Поэтому многим вебмастером приходит в голову мысль изменить скроллинг, сделать в той же тематике, как и весь сайт.

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

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

Dewdrop Custom Scrollbar

Dewdrop Custom Scrollbar – это миниатюрный плагин, который позволяет изменить дизайн скроллинга страницы. Все необходимые настройки внешнего вида плагина собраны в этом плагине.

После установки и активации, настройки скроллинга страниц будут находиться в пункте консоли WordPress «Настройки», подпункте Dewdrop Scrolling Options. Здесь вы увидите возможности для всех операций, которые можно проделать со скроллингом сайта. Плагин позволяет изменять следующие параметры:

  • Цвет скроллинга – можно выбрать из удобного выпадающего селектора или записать необходимый оттенок в виде HEX-кода.
  • Ширину скроллинга – можно задать необходимую величину в пикселях. Помните, что максимальная ширина, которую поддерживают браузеры – 12 пикселей.
  • Высоту скроллинга – также задаётся в пикселях, а максимальный показатель 70 пикселей.
  • Толщину рамки вокруг скроллинга – задаётся в пикселях. По умолчанию установлено 1 пиксель – почти невидимый.
  • Цвет рамки – аналогично первому пункту, выбирается из селектора или записывается в виде кода. Если сделать цвет рамки скроллинга страницы одинаковым с основным цветом, то рамка станет невидимой.
  • Скругление – можно сделать закругленные углы в скроллинге страницы. Задаётся в пикселях – размер радиуса закругления.

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

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

Адель Гадельшин

Recent Posts

Что такое отказы на сайте, почему они происходят, как их уменьшить

Отказы на сайте - это процент посетителей, которые покидают сайт после просмотра только одной страницы.…

7 месяцев ago

Как сделать запуск инфопродукта

Инфопродукт - это любой продукт, который содержит информацию, полезную для потенциальных клиентов. Это может быть…

7 месяцев ago

Как вебмастеру юридически обезопасить себя

Ведение сайта - это не только подержание его работоспособности и наполнение контентом. В последние годы…

7 месяцев ago

Папки WordPress: значение папок /wp-admin, /wp-includes и /wp-content

WordPress - это популярная система управления контентом (CMS), которая позволяет создавать и управлять веб-сайтами различной…

8 месяцев ago

Что такое сертификат Let’s Encrypt и стоит ли его устанавливать

Сертификат Let’s Encrypt - это бесплатный и открытый сертификат SSL/TLS, который позволяет защитить веб-сайт от…

8 месяцев ago

Защита WordPress от вирусов

WordPress - это одна из самых популярных систем управления контентом в мире, которая используется миллионами…

8 месяцев ago