DEV Community

Sujith V S
Sujith V S

Posted on

Pagination CDN setup guide for ejs template engine.

To implement pagination in the ejs template engine, follow these steps.

Step 1: Include the Pagination CDN
Add the following script at the bottom of your EJS file:

<script src="https://cdn.jsdelivr.net/gh/SujithVSuresh/pagination-cdn@master/pagination.js"></script>
Enter fullscreen mode Exit fullscreen mode

Step 2: Add Pagination Controls to Your Template
Add the following code where you want the pagination buttons to appear:

          <div class="d-flex justify-content-center">
            <nav aria-label="Page navigation example">
              <ul class="pagination">
                <li class="page-item" id="prevBtn"><a class="page-link text-black" href="#">Previous</a></li>
                <% for(let i=1; i<= totalPages; i++){ %>
                <li class="page-item pagenationBtn" data-page-no="<%= i %>"><a class="page-link text-black"><%= i %></a></li>
                <% } %>
                <li class="page-item" total-pages="<%= totalPages %>" id="nxtBtn"><a class="page-link text-black" href="#">Next</a></li>
              </ul>
            </nav>
          </div>
Enter fullscreen mode Exit fullscreen mode

The above code provides the interface for pagination. Ensure that you align and style the content properly according to your application's design.

Step 3: Install and setup paginationx npm package for nodejs. Follow this guide

Top comments (0)