Кнопка вверх для сайта WordPress – Simple Scroll to Top Button

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

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

WordPress

В чём польза кнопки вверх для сайта

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

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

Кнопка вверх для сайта на WordPress

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

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

Плагин Simple Scroll to Top Button для кнопки вверх для WordPress

Simple Scroll to Top Button является одним из многих вариантов плагинов, которые реализуют кнопку вверх на WordPress. В нём есть множество настроек для кастомизации элемента, он абсолютно бесплатен и нет премиум-версии, в которой был бы дополнительный функционал, а самое главное – он оптимизирован настолько, что оказывает минимальную нагрузку на сайт и практически не влияет на скорость загрузки его страниц.

Давайте рассмотрим настройки данного плагина. Для начала скачайте и установите на свой сайт Simple Scroll to Top Button и активируйте его. Настройки находятся в разделе “Настройки”, подразделе “Прокрутить вверх”. Опции плагина практически не переведены на русский язык. Но интуитивный интерфейс нивелирует эту проблему.

Опция “Symbol” определяет то, как будет выглядеть кнопка вверх. Есть 10 вариантов готовых кнопок. Но добавить свою кнопку, к сожалению, нельзя.

Symbol

Опция “Background shape” показывает то, какой формы будет кнопка – квадратная, круглая и разные виды этих форм. Всего есть четыре варианта. Опции “Symbol color” и “Background color” отвечают за цветовые настройки кнопки и её фона.

Настройки плагина

“Size” задаёт размер кнопки вверх. “Transparency” – определяет прозрачность кнопки. Опция “Длительность прокрутки” задаёт время между нажатием на кнопку и тем, когда страница будет прокручена до самого верха. Говоря простыми словами – скорость прокрутки. Настройка “Отображать кнопку на” позволяет выбрать где будет видна эта кнопка – только на главной или на всех страницах сайта. Целесообразно выбирать на всех страницах.

Настройки плагина

Также в самом низу имеется предпросмотр кнопки вверх, который изменяется по мере изменения опций.

Предпросмотр

Не забудьте сохранить изменения с помощью кнопки в виде дискеты перед выходом из страницы настроек.

5 комментариев

Оставить комментарий
  1. У Вас все так понятно и познавательно. Спасибо большое!!!

  2. Очень удобная опция. Спасибо за подсказку

  3. Не замедлит ли загрузку страницы этот плагин?

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

      В значительно степени не замедлит.

  4. Радда Омарян

    Очень удобно с кнопкой пользоваться сайтом. И устанавливать тоже оказалось не сложным. Спасибо за ваши уроки!

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *