Skip to main content

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
Feedback