Develop Reference

Paginator not resticting number of post that needs to be shown on page Django?

I'm working on my Django blog, and when I go to categories I listed all posts in that category, but for some reason I cannot manage to work pagination. Everything works except one thing, on all pages I can see all posts, but I want to see only 6 posts per page.
This is pagination.html that is included in category detail page
<div class="mb-30">
<nav aria-label="Page navigation example">
<ul class="pagination justify-content-start">
{% if category_page.has_previous %}
<li class="page-item"><a class="page-link" href="?page={{ category_page.previous_page_number }}"><i class="ti-angle-left"></i></a></li>
{% else %}
<li class="page-item"><a class="page-link" href="#"><i class="ti-angle-left"></i></a></li>
{% endif %}
{% for i in category_page.paginator.page_range %}
{% if category_page.number == i %}
<li class="page-item active"><a class="page-link" href="#">{{ i }}</a></li>
{% else %}
<li class="page-item"><a class="page-link" href="?page={{ i }}">{{ i }}</a></li>
{% endif %}
{% endfor %}
{% if category_page.has_next %}
<li class="page-item"><a class="page-link" href="?page={{ category_page.next_page_number }}"><i class="ti-angle-right"></i></a></li>
{% else %}
<li class="page-item"><a class="page-link" href="#"><i class="ti-angle-right"></i></a></li>
{% endif %}
</ul>
</nav>
</div>
This is category_detail.html
{% for post in posts %}
<article class="col-lg-10">
<div class="background-white">
<div class="post-thumb">
<a href="{{ post.get_absolute_url }}">
<img class="border-radius" src="{{ post.image.standard.url }}" alt="">
</a>
</div>
<div class="pl-10">
<div class="mb-15">
<a class="meta-2" href="{{ post.category.get_absolute_url }}"><span class="post-in">{{ post.category}}</span></a>
</div>
<h5 class="mb-15">
{{ post.post_title }}</h5>
<p class="mb-30">{{ post.body | slice:":200" | safe }}</p>
<div class="mb-10">
<span class="post-on">{{ post.created_at}}</span>
</div>
</div>
</div>
</article>
{% endfor %}
{% include "include/pagination.html" %}
This is views.py
def category_detail(request, slug):
category = get_object_or_404(Category, slug=slug)
categories = Category.objects.all()
posts = Post.objects.filter(category=category)
paginator = Paginator(posts, 6)
page = request.GET.get('page')
try:
category_page = paginator.get_page(page)
except PageNotAnInteger:
category_page = paginator.get_page(1)
except EmptyPage:
category_page = paginator.get_page(paginator.num_pages)
context = {'category': category, 'categories': categories, 'category_page': category_page, 'posts':posts}
return render(request, 'category_detail.html', context)
Any idea why I see all post, but not only 6?

Change your category_detail.html
Docs: https://docs.djangoproject.com/en/4.1/topics/pagination/
{% for post in category_page %}
<article class="col-lg-10">
<div class="background-white">
<div class="post-thumb">
<a href="{{ post.get_absolute_url }}">
<img class="border-radius" src="{{ post.image.standard.url }}" alt="">
</a>
</div>
<div class="pl-10">
<div class="mb-15">
<a class="meta-2" href="{{ post.category.get_absolute_url }}"><span class="post-in">{{ post.category}}</span></a>
</div>
<h5 class="mb-15">
{{ post.post_title }}</h5>
<p class="mb-30">{{ post.body | slice:":200" | safe }}</p>
<div class="mb-10">
<span class="post-on">{{ post.created_at}}</span>
</div>
</div>
</div>
</article>
{% endfor %}
{% include "include/pagination.html" %}

NoReverseMatch at /listings/ Reverse for 'listing' not found. 'listing' is not a valid view function or pattern name

So I'm getting this error when I visit the page, I'm trying to use paginator and I don't know where i'm wrong, index function handles the page I'm talking about
views.py
def index(request):
listings = Listing.objects.all()
paginator = Paginator(listings, 3)
page = request.GET.get('page')
paged_listings = paginator.get_page(page)
params = {'listings':paged_listings}
return render(request, 'listings/listings.html', params)
def listing(request, listing_id):
return render(request, 'listings/listing.html')
def search(request):
return render(request, 'listings/search.html')
listings.html
{% extends 'base.html' %}
{% block content %}
{% load humanize %}
<!-- Breadcrumb -->
<section id="bc" class="mt-3">
<div class="container">
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="{% url 'index' %}">
<i class="fas fa-home"></i> Home</a>
</li>
<li class="breadcrumb-item active"> Browse Listings</li>
</ol>
</nav>
</div>
</section>
<!-- Listings -->
<section id="listings" class="py-4">
<div class="container">
<div class="row">
{% if listings %}
{% for listing in listings %}
<div class="col-md-6 col-lg-4 mb-4">
<div class="card listing-preview">
<img class="card-img-top" src="{{ listing.photo_main.url }}" alt="">
<div class="card-img-overlay">
<h2>
<span class="badge badge-secondary text-white">${{ listing.price | intcomma}}</span>
</h2>
</div>
<div class="card-body">
<div class="listing-heading text-center">
<h4 class="text-primary">{{ listing.title }}</h4>
<p>
<i class="fas fa-map-marker text-secondary"></i>{{ listing.city }} {{ listing.state }}, {{ listing.zipcode }}</p>
</div>
<hr>
<div class="row py-2 text-secondary">
<div class="col-6">
<i class="fas fa-th-large"></i>Sqfit: {{ listing.sqft }}</div>
<div class="col-6">
<i class="fas fa-car"></i>Garage: {{ listing.garage }}</div>
</div>
<div class="row py-2 text-secondary">
<div class="col-6">
<i class="fas fa-bed"></i>Bedrooms: {{ listing.bedrooms }}</div>
<div class="col-6">
<i class="fas fa-bath"></i>Bathrooms: {{ listing.bathrooms }}</div>
</div>
<hr>
<div class="row py-2 text-secondary">
<div class="col-12">
<i class="fas fa-user"></i>{{ listing.realtor.name }}</div>
</div>
<div class="row text-secondary pb-2">
<div class="col-6">
<i class="fas fa-clock"></i>{{ listing.list_date | timesince }}</div>
</div>
<hr>
More Info
</div>
</div>
</div>
{% endfor %}
{% else %}
<div class="col-md-12">
<p>No Listings Available</p>
</div>
{% endif %}
<!-- Listing 1 -->
</div>
<div class="row">
<div class="col-md-12">
{% if listings.has_other_pages %}
<ul class="pagination">
{% if listings.has_previous %}
<li class="page-item">
«
</li>
{% else %}
<li class="page-item disabled">
<a class="page-link">«</a>
</li>
{% endif %}
</ul>
{% endif %}
{% for i in listings.paginator.page_rage %}
{% if listings.number == i %}
<li class="page-item active">
<a class="page-link">{{ i }}</a>
</li>
{% else %}
<li class="page-item">
{{i}}
</li>
{% endif %}
{% endfor %}
</div>
</div>
</div>
</section>
{% endblock %}
urls.py
from django.urls import path
from . import views
urlpatterns = [
path('', views.index, name="listings"),
path('<int:listing_id>', views.listing, name="=listing"),
path('search', views.search, name="=search"),
]

There's a Typo in your urls.py
Try to use this :-
path('listing/<int:listing_id>/', views.listing, name='listing'),
Where was the typo ?
You were using this :-
path('<int:listing_id>', views.listing, name="=listing"),
----------------------------------------------^

What should I do to make my photos appear in Django only safari?

I made my macbook disk format.
After the format, I included my project.
However, photos are not displayed on the project page.
If I go to a specific product, (single page) this is a photo.
The logo is also visible.
Pictures are not displayed to me only collectively.
Safari didn't see 'css/mdb.min.css'
Maybe I don't have something installed?
Before, everything worked.
Here photo display
product.html
{% extends 'base.html' %}
{% load static %}
{% block title %} {{ product.name }} - PVB {% endblock %}
{% block content %}
<main class="mt-5 pt-4">
<div class="container dark-grey-text mt-5">
<!--Grid row-->
<div class="row wow fadeIn">
<!--Grid column-->
<div class="col-md-6 mb-4">
<img src="{{ product.photo.url }}" class="img-fluid" alt="">
</div>
<!--Grid column-->
<div class="col-md-6 mb-4">
<!--Content-->
<div class="p-4">
<div>
<h2>{{product.product_name}}</h2><hr>
<h5><p>Description</p></h5>
<p class="text-justify"><h6>{{product.description}}</h6></p>
<p class="text-justify"><h6>Weight: {{product.weight}}g</h6></p><hr>
</div>
</div>
</div>
</div>
<hr>
</div>
</main>
{% endblock %}
here no
products.html
{% extends 'base.html' %}
{% load static %}
{% block title %} Offer - PVB {% endblock %}
{% block content %}
<section id="marks">
<div class="container">
<header>
<h1>Our Offer</h1>
</header>
</div>
</section>
<!-- Offers -->
<section class="text-center mb-4 py-4">
<div class="container">
<div class="row">
{% if products %}
{% for product in products %}
<!--Grid column-->
<div class="col-lg-3 col-md-6 mb-4">
<div class="card">
<div class="view overlay">
<img src="{{ product.photo.url }}" class="card-img-top" alt="">
<a href="{% url 'product' product.id %}">
<div class="mask rgba-white-slight"></div>
</a>
</div>
<div class="card-body text-center">
<h6 class="grey-text">{{ product.category }}</h6>
<h5>
<strong>
{{ product.product_name }}
</strong>
</h5>
</div>
</div>
</div>
<!--Grid column-->
{% endfor %}
{% else %}
<div class="col-sm-12 sm-12">
<p>No Products Available</p>
</div>
{% endif %}
</div>
</div>
</section>
{% endblock %}

Check your media folder , May be its empty

Sorting Outputs of a List Into Different <UL> Tags Django Template

I have the following code in one of my templates. As you can see, there is a lot of repetition going on. Hence, I am wondering if I can somehow use Django Template to consolidate this code while achieving the same (or closely comparable) result when it comes to HTML. Namely, I am interested if I can sort the todo entries into two different <ul> tags on the page, depending on the boolean value of todo.todo_completed.
{% block content %}
{% if todo_list %}
<ul class="list-group">
{% for todo in todo_list %}
{% if not todo.todo_completed %}
<li class="list-group-item">
<div class="row">
<div class="col-sm-5">
<a href="{% url 'list:todo-detail' todo.id %}" >{{ todo.todo_name }}</a>
</div>
<div class="col-sm-6">
</div>
<div class="col-sm-1">
{% bootstrap_icon "ok" %}
{% bootstrap_icon "remove-circle" %}
</div>
</div>
</li>
{% endif %}
{% endfor %}
</ul>
<ul class="list-group">
{% for todo in todo_list %}
{% if todo.todo_completed %}
<li class="list-group-item">
<div class="row">
<div class="col-sm-5">
{{ todo.todo_name }}
</div>
<div class="col-sm-6">
</div>
<div class="col-sm-1">
{% bootstrap_icon "ok" %}
{% bootstrap_icon "remove-circle" %}
</div>
</div>
</li>
{% endif %}
{% endfor %}
</ul>

Safari not displaying some of my content

so i have an issue where everything works as it should in chrome but in safari some things are just not displayed as if they weren't there.
in my nav it should have products, about, contact and blog in chrome it displays as such, but in safari the contact link is missing. when i checked the inspector its not even hidden its just not in the code.
and one of my filters on the product page again works fine in chrome but in safari the indiviudals tab just doesn't display any content and the medical schools tab is missing one of its items.
product page
<section class="resource-list-block content-block">
<div class="product-overview col-sm-offset-1 col-sm-10 col-xl-offset-1 col-xl-10 resource-list-block__list">
{% for product_page in product_pages %}
{% if product_page.get_content_model.public %}
<div class="col-sm-6 col-md-4 col-xl-4 cover resource-list-block__list__item resource-list-block__list__item--important filterable product-list-block__list__item filtered-cat filtered-filt" data-category="{{ product_page.get_content_model.specialties.all|specialties }}" data-filter="{{ product_page.get_content_model.tags.all|tags }}">
<a href="{{product_page.get_absolute_url}}">
{% include "includes/product-cover.html" with product=product_page.get_content_model.product %}
</a>
</div>
{% endif %}
{% endfor %}
</div>
product-item section
{% load staticfiles compress %}<div class="sans-serif cover-page">
<figure class="figure-cover" style="background-color:#{{product.theme_color}} !important;">
<div class="cover-img center-block"><img src="{{product.element_icon.url}}" class="img-responsive center-block" alt="{{product.title}} Image"></div>
<div class="product-count">
<div class="text-center"><i class="fa fa-calendar"></i><span class="small-text"> {{ product.updates_per_year }} updates per year</span></div>
</div>
<div class="clearfix"></div>
<div class="text-center type-name">
<h3 class="sans-serif">{{ product_page.get_content_model.product_type | upper }}</h3>
<h4 class="sans-serif hidden-md hidden-sm hidden-xs">{{ product_page.get_content_model.editor_text }} <br> {{ product_page.get_content_model.editor_title_text }}</h4>
<h4 class="sans-serif">ISSN {{ product.issn }}</h4>
</div>
</figure>
<figure class="product-content" {% if product.theme_color = 'AF1F24' %} style="background-color:#f2e4e5 !important" {% endif%}>
<div class="cover-img center-block"><img src="{{product.element_icon_alt.url}}" class="img-responsive center-block" alt="{{product.title}} Image"></div>
<div class="clearfix"></div>
<h2 class="text-center type-name">{{ product.title | upper }}</h2>
<figcaption>
<p>{{ product_page.get_content_model.intro }}</p>
</figcaption>
</figure>
and the nav code
{% load pages_tags i18n future %}{% spaceless %}<ul class="decker-menu generic-nav-list generic-nav-list--horizontal theme" id="hero-nav">
{% for child_page in page_branch %}
{% if child_page.in_menu %}
<li class="decker-menu__item">
<a {% if child_page == page or child_page in page.get_ascendants %} class="active important" {% endif %} href="{% if child_page.slug|slice:":4" == 'http' %}{{ child_page.slug }}{% else %} {{ child_page.get_absolute_url }}{% endif %}" >{{ child_page.title }}</a>
</li>
{% endif %}
{% endfor %}<li class="decker-menu__item login-btn"><a href="#">Menu</li></ul>{% endspaceless %}

had to go into mezzanine on safari then remove the content save and refresh the page then go back and re-add it to fix the issue. then repeated that step to fix the issue in firefox.... so weird
thanks!