Kак настроить прокрутку к секции или виджету?

Настройка кнопок меню, переход к секции, навигация по странице, плавный и резкий скролл

Содержание:
1.Настройка плавной прокрутки
2.Моментальная прокрутка к секции

1. Настройка прокрутки

На странице можно установить кнопку, при нажатии на которую можно перейти к нужной секции или виджету.

Шаг 1. Заходим в настройки секции (иконка капельки). В разделе «Параметры» указываем желаемый ID секции (якорь). Можно указать любое сочетание русских/английских букв и цифр без использования пробелов. Например, для секции с каталогом товара установим якорь с названием catalog

Проделаем вышеописанные действия на записи:

Если нужно настроить прокрутку к виджету, а не к секции, то выполняем те же действия, только в настройках стилей виджета (иконка капельки), а не в настройках секции.

Шаг 2. В настройках виджета «Кнопка» ( гаечный ключ ) во вкладке «Действие», выберите «Открыть страницу».
В строке для ввода ссылки прописываем имя якоря, но с решеткой в начале, например, #catalog (тот якорь, который добавили на секцию в первом шаге).

Проделаем вышеописанные действия на записи:

Готово! 🎉
Теперь при нажатии кнопку, экран будет плавно перемещаться к заданной секции или виджету. Проверить результат можно в предпросмотре, или на опубликованной странице, зайдя на нее по ссылке. 

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

Например:

- Первый якорь. В настройках секции: tovar
В настройках кнопки: #tovar 

- Второй якорь. В настройках секции: blok1
В настройках кнопки: #blok1

- Третий якорь. В настройках секции: id1
В настройках кнопки: #id1

2.Моментальная и плавная прокрутка к секции

Можно настроить 2 вида прокрутки. Один из них - плавную прокрутку к секции, мы разобрали выше

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

Для настройки резкого пролистывания выполняем Шаг 1, как мы это уже делали в первой части инструкции.
Шаг 2 выполняем немного иначе:

В настройках виджета «Кнопка» ( гаечный ключ ) во вкладке «Действие», выберите «Открыть страницу».
В строке для ввода ссылки прописываем: Адрес вашего сайта + символ # + id (тот якорь, который добавили на секцию в первом шаге).

Например: http://domain.ru/#catalog
где catalog– название установленного якоря в секции.

Обратите внимание, что между адресом страницы и решеткой должен быть слеш ( символ косой черты /

Укажем адрес для перехода на скриншоте:

Рассмотрим на примере еще раз плавное перемещение и быстрое перемещение к нужной секции:


Готово! 🎉 Мы научились настраивать прокрутку двумя способами. 

👆 На этом пока всё