BlockStrap Documentation

BS > Pagination

Block Description #

The BS > Pagination Block is a highly convenient feature designed to help users easily navigate through multiple posts. It efficiently displays a paginated navigation system to guide users to the next or previous set of posts when applicable, making it a valuable tool for organizing and accessing various posts within the website.

Block Features #

The Pagination Block is extremely flexible and offers several features. These include advanced pagination options, customizable next and previous links, the ability to display middle page numbers, and a multitude of styling options to align with the overall design of the website.

Block Options #

Content #

bs-pagination-content-1763683
  • Output
    • SHOW ADVANCED PAGINATION: dropdown to determine when and where to show additional pagination details such as Showing posts x-y of z. Options include Never, Before, After, Inline Before, Inline After, Only (hide paging).
    • Show custom next/previous links: Enable this option to customize the text and icons for the next and previous page links.
    • NEXT PAGE LINK TEXT: If custom links are enabled, input the text for the “Next Page” link here.
    • NEXT PAGE LINK ICON CLASS: If custom links are enabled, input the FontAwesome class for the “Next Page” link icon here.
    • PREVIOUS PAGE LINK TEXT: If custom links are enabled, input the text for the “Previous Page” link here.
    • PREVIOUS PAGE LINK ICON CLASS: If custom links are enabled, input the FontAwesome class for the “Previous Page” link icon here.

Style #

bs-pagination-styles-2811212
  • Paging
    • MIDDLE PAGES NUMBERS Select from the dropdown (0 to 10, Default (2)) to determine how many numbers to either side of the current page.
    • STYLE: Use the dropdown to select the desired style for your pagination.
    • SIZE: Use the dropdown to select the size of your pagination.

Advanced #

bs-pagination-advanced
  • Link
    • LINK TYPE (dropdown): Choose the type of link for the button, such as a home, none, custom URL, post, or page.
    • LINK TEXT (input field): Customize the text displayed on the button. Enter a custom text or leave it blank for dynamic text based on the link type.
    • ICON CLASS (input field): Add a Font Awesome icon class to display an icon alongside the button text