>

Кнопка вверх WordPress — лучшие плагины. Кнопка Наверх для WordPress. Варианты установки Скрипт кнопки вверх для вордпресс

(Последнее обновление: 03.05.2019)

Всем привет! У вас есть на сайте кнопка вверх WordPress для плавной прокрутке страницы ? Ещё не установили. Давайте не откладывайте установку волшебной кнопки на потом, ведь с кнопкой вверх на сайте очень удобно, особенно вашим посетителям. Без неё ну ни как, меня просто бесит когда на сайте её нет. Приходится колёсико крутить для того, чтобы вернуться к началу страницы. Плохо, очень плохо без кнопочки. Надо веб-мастерам больше заботится о своих посетителях.

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

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

Сегодня я познакомлю вас с лучшими плагинами с помощью которых вы сможете установить кнопку Back to top (Scroll To Top) на свой сайт или блог . подобраны по наибольшему скачиванию модулей пользователями платформы WP. Напомню, все плагины можно установить стандартным способом, из админки, через поиск и загрузчик плагинов. Скачивать ни чего не надо. Установил, активировал, настроил и всё.

Как сделать кнопку вверх на сайте. Плагины - кнопка вверх для WordPress

Первым у нас пойдёт простой плагин jQuery Smooth Scroll

Плагин jQuery Smooth Scroll

Данный плагин автоматически добавляет кнопку вверх, после установки и активации модуля. Кнопка вверх появится в правом нижнем углу сайта . Как говорится, установил и забыл. Установили плагин уже более 50 700 раз. А вот так выглядит наша кнопочка:

Кнопка вверх на сайте WP

Легкий плагин Smooth Scroll Up - плавная прокрутка вверх

Легкий плагин Smooth Scroll Up

Плавная прокрутка вверх - это легкий плагин, который создает настраиваемую функцию наверх на вашем сайте WordPress. Плагин Smooth Scroll Up имеет минимальные настройки. Выберите из различных типов элементов прокрутки вверх - изображение, значок, текстовая ссылка т.д..

Опции для настройки плагина Smooth Scroll Up

Плагин на русском языке, так, что проблем с настройками кнопки вверх у вас не возникнет.

Плагин WPFront Scroll Top

Добавляем кнопку прокрутки вверх

Модуль WPFront Scroll Top позволяет посетителю легко прокручивать назад до верхней части страницы с полностью настраиваемыми параметрами и изображением. Данный плагин имеет больше настроек и главное, очень большой выбор иконок (изображений) самой кнопки. А так же можно обойтись и без картинки:

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

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

Выбор кнопки вверх

Согласитесь, довольно приличный набор картинок для волшебной кнопки. Правда, плагин на английском языке, но Google переведёт. А вот пример установленной кнопки на сайте:

Кнопка вверх

Плагин Scroll Back To Top - кнопка на вверх

Плагин Scroll Back To Top

Модуль Scroll Back To Top также имеет ряд настроек и выбора как будет выглядеть кнопка на верх:

Пример кнопок вверх на сайте

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

(function(w, d, n, s, t) { w[n] = w[n] || ; w[n].push(function() { Ya.Context.AdvManager.render({ blockId: "R-A-292864-4", renderTo: "yandex_rtb_R-A-292864-4", async: true }); }); t = d.getElementsByTagName("script"); s = d.createElement("script"); s.type = "text/javascript"; s.src = "//an.yandex.ru/system/context.js"; s.async = true; t.parentNode.insertBefore(s, t); })(this, this.document, "yandexContextAsyncCallbacks");

Кнопка наверх присутствует сейчас во многих сайтах и помогает пользователям быстро вернуться в самый верх страницы. Это достаточно удобно, если на сайте отображается много информации. Поэтому дабы каждый раз не приходилось прокручивать веб-страницу обратно к началу статьи или к меню, разработчики советуют добавлять кнопку вверх. Располагается она, как правило, в правом нижнем углу и появляется по мере приближения к концу страницы. Опция достаточно интересная и не такая уж сложная в реализации.

Можно, в принципе, создать кнопку наверх с помощью определенных скриптов и правки WordPress шаблона, однако есть вариант проще — плагины. Он идеально подойдет для тех, кому лень разбираться кодом, или тем, кто плохо ориентируется в вопросах веб-разработки. Кроме того, у модулей есть разные настройки для реализации тех или иных интересные фишек. А это тоже, согласитесь, весьма полезно. Из 10-ти плагинов, найденных для функции Back to top, я рассмотрю лишь 4, которые имеют достаточное число скачиваний и отвечают актуальным версиям системы WordPress.

Smooth Scroll Up

Лекий и настраиваемый плагин Smooth Scroll Up позволяет добавить кнопку вверх для любого поста/страницы в WordPress. Скачали модуль более 40 тысяч раз, поддерживаются версии WP от 3.2 до 4.1. Последнее обновление было буквально недавно. Имеются переводы на разные языки (русского, украинского пока что нету).

Основные возможности Smooth Scroll Up:

  • Выбор разных элементов для кнопки вверх: текст, картинка, кнопка.
  • Выбор позиции для элемента Back to top: слева, справа, по центру.
  • Возможность указывать любой текст для кнопки наверх.
  • Задание расстояния от верха страницы, после которого появляется кнопка.
  • Анимация при скролинге (прокрутка, затемнение).
  • Отображение/скрытие на главной странице и мобильных устройствах.
  • Добавление события при клике.

Здесь и параметры для кнопки наверх (цвет, граница, фон, прозрачность), и задание расположения элемента Back To Top, и использование картинок или текста для него, плюс опции анимации при прокрутке и т.п. Поддерживаемые версии WordPress — от 3.0 до 3.9.2, скачан модуль более 18 тысяч раз.

Из этих четырех плагинов для кнопки наверх я бы и советовал вам выбирать. Очередность их в обзоре не является рейтингом, то есть не значит, что я рассматривал лучшие в начале или в конце статьи, они идут по мере ознакомления. Все, в принципе, зависит от ваших нужд. Если вы вообще далеки от разработки и WordPress, то проще всего установить Smooth Scroll Up и забыть. Желающим покопаться с настройками, подойдут два последних плагина. Первый — наиболее новый на данный момент. В общем, выбрать есть из чего.

Здравствуйте, уважаемые читатели! Когда-нибудь задумывались над тем, как сделать кнопку Вверх для WordPress? Нет? Очень зря. Ведь это не только красивая, но и очень полезная вещь. Такая кнопка появляется в правом нижнем углу при прокрутке страницы вниз. Нажимаем на нее, и страница плавно возвращается к своему началу. Реализовать подобный эффектный переход наверх в WordPress можно с помощью плагина Dynamic To Top Options. О нем то я сегодня и расскажу.

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

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

Dynamic To Top Options стандартна. Скачайте последнюю версию , распакуйте и загрузите на сервер в директорию /wp-content/plugins. Активируйте и переходите к настройкам, которые в отличии от большинства других плагин, находятся в разделе «Внешний вид» — «To Top».

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

Первый раздел настроек называется Behavior , что означает свойства.

Scroll time — задает время прокрутки страницы к началу. Измеряется в миллисекундах.

Fade-in distance — расстояние от верхнего края страницы, начиная с которого появляется кнопка «вверх!».

Easing — задает плавность прокрутки. Если не приглядываться, то достаточно трудно почувствовать разницу, особенно если установлено малое значения для времени прокрутки.

Position — позиция кнопки на странице. На выбор 4 позиции:

  • top left — левый верхний угол
  • top right — правый верхний
  • bottom left — нижний левый угол
  • bottom right — соответственно нижний правый

Prevent on mobile — отображать или нет кнопку вверх в браузерах мобильный устройств.

Остается только отредактировать внешний вид кнопки в разделе Appearance настроек плагина Dynamic To Top Options. Очень удобно, что все внесенные изменения, можно посмотреть тут же на примере.

Text version — позволяет написать на кнопке текст. После установки галочки, появится следующие поля:

  • Button text — текст, используйте простые и понятные слова — «Вверх!» «В начало страницы», «Наверх!», «К началу», «Up!», «Полетели!» и так далее;
  • Font size — размер шрифта
  • Text color — цвет теста. Нажмите select для наглядного выбора цвета;
  • Bold Text — жирное начертание;
  • Text shadow — тень от букв;
  • Text shadow color — цвет тени.

Top/bottom padding — отступ сверху и снизу от текста или изображения внутри кнопки до ее границ.

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

Плагин Dynamic “To Top” Plugin

Официальная страница плагина Dynamic “To Top” Plugin (https://wordpress.org/extend/plugins/dynamic-to-top/ ). Плагин размещает кнопку «Наверх» на сайте. Устанавливается плагин . Язык плагина английский.

Настройки плагина Dynamic “To Top” включают:

  • 4 положения кнопки «Наверх» на сайте;
  • Настройка внешнего вида (цвет, тень, граница);
  • Выбор скорости движения вверх;
  • Есть возможность отключения мобильной версии;
  • Возможность добавить текс на кнопку.

Скриншоты плагина Dynamic “To Top” Plugin

Плагин Scroll To Top

Официальная страница плагина Scroll To Top (https://wordpress.org/extend/plugins/scrollto-top/ ). Плагин для размещения кнопки «Наверх» на сайте. стандартная. Язык английский.

Из настроек

  • 9 Положений кнопки «Наверх» на сайте;
  • 4 Стиля кнопки;
  • Возможность установить свое изображение для кнопки;
  • Замена кнопки текстовой ссылкой с настройкой цвета.

Примечание: Сестра плагина Scroll To Top, плагин кнопка «Вниз» под названием ScrollTo Bottom . Официальная страница плагина: https://wordpress.org/extend/plugins/scrollto-bottom .

Плагин Skysa Scroll-to-Top App

Официальная страница плагина Skysa Scroll-to-Top Add (https://wordpress.org/extend/plugins/skysa-scroll-to-top-app/). Плагин для установки панели Skysa внизу страниц сайта. В бесплатной версии в панели устанавливается только стрелка «Наверх» с пользовательской надписью.

В бесплатной версии плагина практически нет настроек. Только бар со стрелкой и пользовательской надписью. Перед покупкой pro версии дают 15-дневный срок для тестирования.

Скриншоты плагина Skysa Scroll-to-Top App

Дополнение

Самое простое решение для кнопки наверх, проще не существует

Если вам НЕ нужны красивые и «навороченные» кнопки «Наверх», а достаточно простой надписи, то достаточно вставить нижеследующий код в любое место шаблона своего сайта (например, footer.php), где хотите показать надпись «Наверх» или любую запись понятную пользователю:

Наверх или любой другой Текст

Все! Больше делать ничего не нужно.

Такая надпись «Наверх» не конфликтует с плагинами, ее можно использовать, как дополнительную кнопку «Наверх».

Другие плагины кнопки наверх wordpress

Для дополнения информации, приведу список еще 5 плагинов для реализации на сайте кнопки «Наверх». Поддержка и обновление плагинов постоянно меняется, поэтому говорить о них можно только, на момент использования.

  • Scroll to Top Button (https://ru.wordpress.org/plugins/scroll-to-top-button/ )
  • Smooth scroll Up (https://ru.wordpress.org/plugins/smooth-scroll-up/ )
  • LB Back To Top (https://ru.wordpress.org/plugins/backtop/ )
  • WPFront Scroll Top (https://ru.wordpress.org/plugins/wpfront-scroll-top/ )
  • M7 Go Top (https://wordpress.org/plugins/m7-go-top/ )

Здравствуйте, уважаемые читатели.В этой статье я расскажу вам, как установить кнопку “вверх ” для блога WordPress. Сделать эту кнопочку можно двумя способами. Первый способ заключается в установке специального плагина. А второй, в изменении php кода в файлах вашей активной темы.

По большому счету, можно с легкостью обойтись и без этой кнопки. Эта кнопка уже у вас есть на клавиатуре, называется она “home ” . Нажав которую, вы быстро переместитесь на начало страницы.


Многие веб-мастера устанавливают на свой сайт эту кнопку. Кто-то ставит ее для более удобной навигации пользователей по сайту, а для кого-то, это неотъемлемая часть дизайна.

1.Установка кнопки при помощи плагина.

Самый простой способ сделать кнопку вверх, это установить и активировать плагин. Скачать его можно с официального хранилища плагинов на сайте wordpress.org . Я рекомендую качать плагины только оттуда, так у вас будет меньше шансов заразить свой сайт вирусом.

Есть много плагинов которые позволяют добавить кнопку наверх, но я решил в качестве примера выбрать плагин Scroll Back To Top. Скачайте его , загрузите и активируйте.

Плагин имеет целый ряд настроек. Но всё трогать не обязательно. Достаточно настроить расположение и вид кнопки.

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