Django ページネーションのHTML用テンプレート

ケース

Django ListViewのpaginate_byなどでページネーションを実装する際に、HTMLファイル側を実装したい


Djangoのテンプレートタグを使いこなして、よしなに設計することができます。
基本的には、ListViewのpaginate_byを使用すると、指定した数ごとにデータが送られてきてページ数なども送られてくるので、それをDjangoのテンプレートタグで調整します。

<nav aria-label="Page navigation" class="pb-5 pt-3">
    <ul class="pagination justify-content-center">
        {% if page_obj.has_previous %}
        <li class="page-item">
        <a class="page-link text-dark" href="?page={{ page_obj.previous_page_number }}" aria-label="Previous">
            <span aria-hidden="true">&laquo;</span>
            <span class="sr-only">Previous</span>
        </a>
        </li>
        {% endif %}
        {% for num in paginator.page_range %}
        {% if num <= page_obj.number|add:5 and num >= page_obj.number|add:-5 %}
        {% if page_obj.number == num %}
        <li class="page-item active">
        <span class="page-link bg-main">
            {{ num }}
            <span class="sr-only">(current)</span>
        </span>
        </li>
        {% else %}
        <li class="page-item">
        <a class="page-link text-dark" href="?page={{ num }}">{{ num }}</a>
        </li>
        {% endif %}
        {% endif %}
        {% endfor %}
        {% if page_obj.has_next %}
        <li class="page-item">
        <a class="page-link text-dark" href="?page={{ page_obj.next_page_number }}" aria-label="Next">
            <span aria-hidden="true">&raquo;</span>
            <span class="sr-only">Next</span>
        </a>
        </li>
        {% endif %}
    </ul>
</nav>

以上コピペすればページネーションのフロント側が実装でいるでしょう。
ただし、Bootstrap4がないとUIが多少崩れるのでご注意を...