How to Django Pagination

Question

Am trying to make a website for branding products, so want the container to hold 8 items and clicks the pagination to see the other products

Here is the view code

class ProductListView(ListView):
    model = Product
    template_name = 'Genesis/home.html'
    context_object_name = 'page_obj'
    paginate_by = 8  # Display 8 products per page

    def get_context_data(self, **kwargs):
        context = super().get_context_data(**kwargs)
        categories = Product.objects.all()
        context['categories'] = [
            {'Product Type': category.Product_Type, 'Product Name': category.Product_Name}
            for category in categories
        ]
        return context

here is the page code

` {% if new_products %}
              <div class="row" id="product-container">
                {% for product in page_obj.object_list %}
                  <div class="col-lg-3 col-md-6 mb-4"> <!-- Adjust the column classes as needed -->
                    <div class="card">
                      <!-- Product image -->
                      <div class="bg-image hover-zoom ripple ripple-surface ripple-surface-light" data-mdb-ripple-color="light">
                        <img src="{{ product.first_image.Product_Image.url }}" alt="Product Image" class="w-100" />
                        <a href="#!">
                          <div class="mask">
                            <div class="d-flex justify-content-start align-items-end h-100">
                              <h5><span class="badge bg-primary ms-2">New</span></h5>
                            </div>
                          </div>
                          <div class="hover-overlay">
                            <div class="mask" style="background-color: rgba(251, 251, 251, 0.15);"></div>
                          </div>
                        </a>
                      </div>
                      <div class="card-body">
                        <div class="text-center">
                          <!-- Product name -->
                          <h5 class="fw-bolder">{{ product.Product_Type }}</h5>
                          <!-- Product price -->
                          $40.00 - $80.00
                        </div>
                      </div>
                      <!-- Product actions -->
                      <div class="card-footer p-4 pt-0 border-top-0 bg-transparent">
                        <div class="text-center">
                          <a class="btn btn-outline-dark mt-auto" href="#">View Product</a>
                        </div>
                      </div>
                    </div>
                  </div>
                {% endfor %}
              </div>
            {% else %}
              <p class="text-center">No Products Available</p>
            {% endif %}
          </section>
          <nav aria-label="Page navigation ">
            <ul class="pagination justify-content-center">
                {% if page.has_previous%}
              <li class="page-item">
                <a class="page-link" href="?page={{page.previous_page_number}}" aria-label="Previous">
                  <span aria-hidden="true">&laquo;</span>
                </a>
              </li>
              {%endif%}
              {% for num in page.paginator.page_range%}
                {% if page.number == num %}
              <li class="page-item"><a class="page-link" href="#">{{num}}</a></li>
              {% else %}
                <li class="page-item">
                  <a class="page-link d-none" href="?page={{ num }}">{{ num }}</a>
                </li>
            {%endif%}
            {%endfor%}
            {% if page.has_next %}
              <li class="page-item">
                <a class="page-link" href="?page={{ page.next_page_number }}" aria-label="Next">
                  <span aria-hidden="true">&raquo;</span>
                </a>
              </li>
              {%endif%}
            </ul>
          </nav>`

The page is not even displaying the pagination and the products

l did some research text and also read text

The page container must display products and a pagination so the user can view other products within the shop

Answer 1

try to change "page" with "page_object" sample {% if page_object.has_previous %}