Строка Поиска
Виджет Строка Поиска (Search) позволяет посетителям найти нужную им информацию на сайте.
Виджет состоит из следующих элементов:
- Поле ввода (Input Label)
- Кнопка поиска (Search Button)
Настройки Поиска на вкладке Настройки (Settings) правой панели включают:
Общие настройки (General)
Тип (Type):
- По умолчанию (Default) - Строка Поиска имеет обычную структуру: поле для ввода поискового запроса и кнопку его отправки.
- Скользящий (Slide) - Поле запроса скрыто и раскрывается при первом клике по кнопке, второй клик отправляет поисковый запрос.
Для типа Скользящий есть дополнительные настройки:
- Показать строку ввода (Show input line): При клике (On Click) или При наведении (On Hover)
- Отображать строку ввода на холсте (Display Input line on canvas)
Фоновый текст (Placeholder):
- фоновый текст — можно ввести текст в поле ввода (по умолчанию «Поиск по сайту»)
- цвет фонового текста — можно выбрать цвет текста и его прозрачность
Кнопка «Перейти на страницу результатов поиска» — нажав на нее, вы попадете на страницу, на которой будут отображаться ссылки на найденные при поиске страницы. Страницу результатов поиска можно кастомизировать.
Вы можете стилизовать Строку Поиска, используя вкладку Дизайн правой панели.
Выбрав соответствующий элемент Строки Поиска, вы можете:
- Стилизовать поле ввода поискового запроса. Вы можете добавить ему рамку (в разделе Границы), скруглить углы и изменить внутренние и внешние отступы (в разделе Размер), изменить шрифт (в разделе Текст).
- Стилизовать кнопку поиска. Вы можете изменить цвет фона (в разделе Фон), настроить радиус закругления углов (в разделе Размер), изменить шрифт (в разделе Текст).
При создании проекта автоматически генерируется страница для отображения результатов поиска — Search results. Страницу можно открыть на вкладке Страницы левой панели.
Она состоит из трех блоков:
- Текст с заголовком. Можно заменить на любой другой текст и стилизовать.
- Результаты поиска — список всех найденных страниц, его также можно настроить и стилизовать.
1. Выберите элемент Search results на вкладке Слои в левой панели и перейдите на вкладку Настройки в правой панели.
2. В настройках в разделе Общие выберите Состояние (State) для списка результатов. Доступно три состояния — Default, No results, Disabled.
В зависимости от состояния на странице будет отображаться разная информация. Вы можете менять текст и настраивать стили для каждого варианта.
- Default — состояние по умолчанию, когда при поиске найдены какие-либо результаты.
Найденные данные отображаются в блоке с названием Found State, в котором расположены три блока: счетчик результатов (Result Count), список найденных страниц (Result list) и переключатель страниц списка (Controls container).
Каждый из блоков можно стилизовать по своему желанию — например, выбрать желаемый размер шрифта, цвет текста и другие стили на вкладке Дизайн.
В настройках также можно выбрать:
- Количество элементов в списке с результатами. По умолчанию — 10, есть опции 20, 30, 40, 50.
- Желаемый формат пагинации: числа от 1, числа от 01 или постранично.
- No results — состояние, когда в результате поиска ничего не найдено.
В этом состоянии блок Found State скрыт, а отображается блок Empty State. В тем находится текстовый элемент с сообщением о том, что при поиске ничего не найдено. Вы можете изменить текст и стилизовать его по своему желанию.
- Disabled — состояние, когда функция поиска отключена.
Блоки Found State и Empty State скрыты, активен блок Disabled State, в котором расположен текстовый элемент с сообщением.
Для любого состояния вы можете создать кастомный интерфейс страницы поиска — добавить дополнительные текстовые элементы, изображения и контентные блоки.
Например, вы можете разместить на странице поиска такую же шапку и подвал, как на других страницах сайта, и стилизовать ее в соответствии с общим дизайном.
