Как сделать кнопку "Наверх".

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

Несложную работу, которую вам необходимо проделать, наше обучение seo рекомендует разделить на четыре следующие этапы:

1. Поиск картинки

С самого начала необходимо выбрать картинку, которую будете использовать в качестве кнопки “Наверх”. Для этого рекомендую просто набрать в Яндекс или Google картинках поисковый запрос: “Кнопка наверх для сайта”. Должен сказать, что в интернете существует и множество альтернативных вариантов.

Затем переходите в административную панель WordPress, нажимаете вкладку Медиафайлы и загружаете картинку. После этого не забудьте скопировать ссылку на картинку.

2. Код в Footer.php

Для создания HTML кода кнопки необходимо зайти в файловый менеджер вашего сайта и открыть файл Footer.php. Перед закрывающим тегом <br /> нужно вставить следующий код:

<a href="#skrol"><img src="Ваша ссылка на картинку" alt="4" width="45" height="43"  

class="skroll"/></a>

3. Код в Header.php

Теперь нужно открыть файл header.php и перед тегом </head> вставить следующий код:

<div id="skrol"></div>

4. Позиционирование кнопки

Теперь можно проверить свой сайт и кнопка должна появиться, но она находится не совсем там, где необходимо. Для этого ее нужно позиционировать. Для этого открываете файл Style.css и в самом низу добавляете следующие строчки:

.skroll {width: 200px;
 
top: 750px;
 
right: -20px;
 
position: fixed;}

Width – устанавливает ширину блочных элементов

Top – устанавливает толщину границы сверху

Right: – задает расположение блока

Position: fixed – позволяет зафиксировать элемент и создать плавающую кнопку Наверх.

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