Постраничную навигацию в 1С-Битрикс рисует отдельный системный компонент bitrix:system.pagenavigation. Списковые компоненты (например «Новости», bitrix:news.list) вызывают его внутри себя и передают имя шаблона пейджера. Чтобы получить свою вёрстку пагинации – со своими классами, стрелками и разметкой – нужно скопировать шаблон пейджера в свой шаблон сайта и указать его имя компоненту.
Копируем шаблон пейджера
Штатные шаблоны пейджера лежат в /bitrix/components/bitrix/system.pagenavigation/templates/. Их нельзя править «на месте» – при обновлении ядра правки затрёт. Скопируйте нужный шаблон в свой шаблон сайта, сохранив структуру пути:
/bitrix/templates/.default/components/bitrix/system.pagenavigation/<имя>/Задайте папке своё имя, например news. Внутри окажется template.php – это и есть вёрстка пагинации, которую вы будете править.
Подключаем шаблон к списку
Дальше шаблон нужно назвать компоненту-списку. В настройках компонента «Новости» есть поле «Шаблон постраничной навигации» (PAGER_TEMPLATE) – впишите туда имя своей папки (news).
Чтобы та же пагинация применилась и к результатам поиска внутри комплексного компонента, откройте файл вложенного шаблона поиска (в примере – list_blog/search.php) и передайте параметр дальше:
"PAGER_TEMPLATE" => $arParams["PAGER_TEMPLATE"],Так значение из настроек комплексного компонента «протекает» во вложенный вызов, и поиск использует тот же шаблон пейджера, что и список.
Что доступно внутри template.php
Шаблон пейджера получает готовый $arResult с данными о страницах. Основные переменные:
$arResult["NavPageCount"]– всего страниц;$arResult["NavPageNomer"]– номер текущей страницы;$arResult["NavRecordCount"]– всего элементов;$arResult["nStartPage"]и$arResult["nEndPage"]– диапазон видимых номеров;$arResult["sUrlPath"]– базовый URL для сборки ссылок.
По этим данным вы в цикле от nStartPage до nEndPage собираете ссылки на страницы и отдельно – «назад»/«вперёд».
Делаем пагинацию доступной и семантичной
Пагинация – это навигация, поэтому размечайте её осмысленно:
- Оборачивайте блок в
<nav aria-label="Постраничная навигация">. - Текущей странице добавляйте
aria-current="page"– так скринридер объявит, где пользователь находится, а не просто подсветит цифру цветом. - Кнопки «назад»/«вперёд» на первой и последней странице делайте неактивными и убирайте у них ссылку, а не прячьте молча.
- Если стрелки – это только значки, добавляйте им текстовую подпись через
aria-label(«Предыдущая страница»).
Атрибуты rel="prev" и rel="next" Google больше не использует для индексации, но они не мешают и помогают некоторым браузерам с предзагрузкой – оставлять их можно.
Частые ошибки
- Правят шаблон прямо в /bitrix/components/. Обновление ядра затрёт правки. Работайте только с копией в шаблоне сайта.
- Пагинация не появилась. Проверьте, что имя папки совпадает с тем, что указано в PAGER_TEMPLATE, и что вывод пейджера включён в настройках компонента.
- В поиске пагинация другая. Значит, PAGER_TEMPLATE не передан во вложенный вызов – добавьте строку с параметром в шаблон поиска.
Смежные заметки по поиску и спискам: количество элементов в результатах поиска, иконка в кнопке поиска и количество элементов в разделе.