На каждом сайте, где много страниц с информацией, нужно организовать правильный и красивый переход между такими страницами. Сегодня мы бы хотели поговорить о том, как сделать навигацию по страницам сайта при помощи небольшого плагина jQuery и Bootstrap 4. Buzina Pagination-это небольшой плагин jQuery, который использует компонент bootstrap 4 pagination для разбиения на страницы больших наборов данных с навигационными ссылками и кнопками next/previous. Можно указать количество записей, отображаемых на странице.

 

Если вы хотите воспользоваться готовыми решениями и взять бесплатный шаблон, или на оборот премиум с техподдержкой и помощью установки, тогда просмотрите предложения наших партнеров:

Как использовать:

Для начала подключите Bootstrap 4 и jQuery к Вашей странице, будьте внимательны, если у вас уже подключена библиотека jQuery, то дублировать их не стоит, иначе может не работать:

Далее необходимо подключить сам плагин Buzina Pagination к странице, а также стили к нему:

Заключите данные в структуру состоящую из DIV следующим образом:

Вызовите функцию в верхнем контейнере, чтобы создать нумерацию страниц в списке данных:

Укажите, сколько записей должно отображаться на странице. По умолчанию: 1.

Укажите, следует ли отображать кнопки prev/next:

В результате у вас получился такой замечательный элемент на сайте который легко интегрировать и настроить под свои нужды. А как вы считаете?

Вот и все. Готово!