Алфавитный каталог из потоков Tilda: буквы, поиск и разделы

В справочнике компаний, специалистов или терминов посетитель часто знает начало названия. Алфавит помогает быстрее перейти к нужной группе, а поиск и разделы — сузить результат.

Мод строит такой каталог из подключённого потока. Можно выбрать список или карточки, фильтрацию по букве или переход к группе. Разберём, как подготовить названия и убедиться, что в справочник попали все нужные записи.

Алфавитная навигация полезна, когда названия действительно помогают найти запись. Если каждое начинается с общего рекламного слова, посетителю придётся искать почти всё под одной буквой. Для справочника лучше использовать узнаваемое имя компании, человека или термина.

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

Укажите ID блока потоков или общий CSS-класс в «Где применять». Поддерживаются стандартный блок, новая CMS и статьи внутри Zero Block. Для общего класса можно использовать короткое имя uc-potoki-dir.

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

Можно оставить каталог над исходным блоком. Для размещения внутри Zero добавьте шейп с классом feed-widget и укажите этот класс в настройках. Предусмотрите достаточно места для списка и элементов управления на нужных экранах.

Не оценивайте высоту по двум тестовым записям. Длинный справочник и панель фильтров занимают больше места. Проверьте телефонную версию с открытым списком и длинным названием. Источник и принимающая область решают разные задачи: один предоставляет публикации, другая определяет, где появится готовый каталог.

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

Затем включите поиск и разделы, если они помогают вашим данным. Они работают одновременно, поэтому запрос вместе с выбранным разделом может дать меньше результатов, чем тот же запрос по всему каталогу. Посетитель должен понимать, что сейчас выбрано, и уметь вернуться к более широкому списку.

Для проверки полного состава выберите «Весь поток» и сравните записи справочника с источником. Найдите несколько заранее известных названий из начала, середины и конца списка.

Не считайте наличие первой страницы достаточным подтверждением полноты. Если справочник нужен для поиска любой компании, отсутствие части записей — более серьёзная проблема, чем цвет активной буквы. Уточните выбранный режим загрузки, названия и доступность публикаций в источнике. Только после этого подбирайте окончательные размеры карточек, интервалы и расположение поиска.

Разместите код в T123 после блока-источника и опубликуйте страницу. Откройте каталог как посетитель: выберите букву, уточните раздел, введите название и перейдите в найденную публикацию.

• Буква выполняет выбранное действие — фильтр или переход.
• Поиск работает вместе с разделом.
• В режиме всего потока находятся контрольные записи из разных частей списка.
• На телефоне фильтры не закрывают результаты.
• Карточка открывает именно нужную запись.

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

Читайте также: Фильтр по дате в потоках Tilda: календарь и диапазон дней · Обрезка текста в Tilda: многоточие и одинаковая длина описаний.