Якорь меню — виджет Elementor

При создании Landing Page или одностраничника, посадочной страницы, документации или сайта с длинным содержимом, нам необходимо как то передвигаться по сайту, а точнее по его контенту. Для этого придуманы специальные закладки контента, а в веб строительстве такие закладки называются «Якорь» и «Якорная ссылка». При нажатии на такую ссылку, мы переходим в определенную часть страницы.  Если это страница текущая, то мы перейдем к участку текста мгновенно.

Для общего развития изучения html, якорь это просто уникальное имя для определенного блока. Обычно в качестве этого имени (якоря) используют id блока  или элемента.  Вот например даже параграф может быть якорем.

<p id=»yakor-saita»>Про якорь сайта</p>

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

www.moy-sait.ru/kak-sozdat-sait#yakor-saita

Якоря используют на многих сайтах где нужна навигация по контенту. Если вы создали длинный текст с разными разделами, то в начале статьи вы можете разместить ссылки на нужные части контента. Так же вы создали лендин и тоже нужно создать ссылки для передвижения по контенту.

А как быть с якорями при создании сайта в конструкторе ?  А в конструкторе сайта это еще проще, ведь для этого придуман виджет, который называется «Якорь меню». Это не визуальный виджет для сайта, но для режима редактирования он вполне визуален.

якорь меню в конструкторе сайта

На изображении выше показан виджет, когда мы его расположили на страницу конструктора. У виджета нет настроек, кроме поля для ввода названия якоря.настройки якоря в виджете elementor конструктор сайта

Многие задаются вопросом, а зачем его использовать когда можно задать определенной колонке или секции id и его использовать? А ответ просто. Представьте страницу из 10 разделов. В каждый блок вы добавили id. Вернулись к сайту через неделю и уже не помните где поменять id блока и необходимо просматривать каждый блок или виджет в отдельности.

А вот с указанным виджетом все просто. Мы просто возвращаемся в конструктор и видим серую область с иконкой якоря и понимаем, что это якорь. Кликаем по нему и сразу при необходимости можем поменять id. Т.е все просто, быстро и визуально. И естественно при просмотре самого сайта мы виджет не увидим и это прекрасно.

Список всех виджетов Elementor вы можете посмотреть на странице Виджеты

Вам также может понравиться

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

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