// templates <div class="container" style="margin-top: 10vh;margin-left: 40vw;margin-right:40vw;"> <nav aria-label="Page navigation example"> <ul class="pagination"> {% if page_obj.has_previous %} <li class="page-item"> <a class="page-link" href="?page=1">First</a> </li> <li class="page-item"> <a class="page-link" href="?page={{ page_obj.previous_page_number }}" aria-label="Previous"> <span aria-hidden="true">«</span> </a> </li> {% endif %} <li class="page-item active" aria-current="page"> <a class="page-link" href="#">Page {{ page_obj.number }} of {{ page_obj.paginator.num_pages }} <span class="sr-only">(current)</span></a> </li> {% if page_obj.has_next %} <li class="page-item"> <a class="page-link" href="?page={{ page_obj.next_page_number }}" aria-label="Next"> <span aria-hidden="true">»</span> </a> </li> <li class="page-item"> <a class="page-link" href="?page={{ page_obj.paginator.num_pages }}">Last</a> </li> {% endif %} </ul> </nav> </div>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter