Здравствуйте, уважаемые читатели! Когда-нибудь задумывались над тем, как сделать кнопку Вверх для WordPress? Нет? Очень зря. Ведь это не только красивая, но и очень полезная вещь. Такая кнопка появляется в правом нижнем углу при прокрутке страницы вниз. Нажимаем на нее, и страница плавно возвращается к своему началу. Реализовать подобный эффектный переход наверх в WordPress можно с помощью плагина Dynamic To Top Options. О нем то я сегодня и расскажу.
В настройках WordPress можно установить количество анонсов, выводимых на главной и в рубриках блога. На многих блогах, даже 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 — цвет тени.
[ad]
Top/bottom padding — отступ сверху и снизу от текста или изображения внутри кнопки до ее границ.
Sides padding — аналогично предыдущему, только определяет отступ слева и справа.
Background color — задний цвет кнопки.
Border color — цвет границы.
Border width — ширина границы.
Border radius — определяет радиус скругления — от квадратной формы до круглой.
Inset highlighting — использование CSS3 для отображения цвета кнопки. Лично я не почувствовал разницы с использованием CSS3 и без.
Shadow — отображает тень, используя CSS3.
Не забудьте сохранить внесенные изменения. Если этот плагин чем-то не понравился и хочется нечто большего, то вы вполне можете добавить кнопку вверх на сайт самостоятельно. Это не так уж и сложно, как может показаться на первый взгляд. Главное — верить в свои силы! 
Спасибо за внимание! Подписывайтесь на блога FairHeart.ru. Берегите себя!
Консультация по Skype
