১১-৫ : পোস্ট ডিটেলস পেজ

পোস্টের টাইটেলে ক্লিক করলে পোস্টের ডিটেইলস আলাদা একটি URL - এ দেখানোর ব্যবস্থা করব এই মডিউলে।

এর জন্য, home.html ফাইলটি কিছুটা পরিবর্তন করে নিচের মত করে লিখে ফেলি-

Code:: 11.5.1 templates/home.html

{% extends 'base.html' %} 
{% load static %}
{% block content %}


<div class="d-flex flex-wrap px-5 pt-3 align-items-center">

  <div class="col-6">
    <h1>Welcome to Django Blog</h1>
    <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Voluptatibus dolorum delectus necessitatibus temporibus adipisci, harum enim unde, suscipit in ipsum provident hic minima molestias reiciendis nihil veniam aut doloribus, ab quidem sit cum at nemo nulla autem! Dolor quaerat ea voluptatem ullam, consequuntur quisquam ut iste. Vitae exercitationem ipsum blanditiis. Nihil rem in quo magni quam sapiente ad ipsa voluptatum saepe quos temporibus, at iste? Eum saepe eos error ea recusandae, deserunt at quidem odio harum inventore. Necessitatibus eos sapiente architecto optio aut esse, facilis, voluptatibus assumenda ut exercitationem nobis molestias, quisquam nam quia odio ipsa? Voluptatem voluptas distinctio eaque.</p>
  </div>
  <div class="col-6">
<img src="{% static 'header.jpg' %}" />
  </div>
</div>



<div class="d-flex flex-wrap p-4">
  <div class="col-2 bg-white p-3" >
    <h5>All Categories</h5>
    {% for cat in category %}
    <div class="form-check">
      <input
        class="form-check-input"
        type="radio"
        name="category"
        id="{{cat.id}}"
      />
      <label class="form-check-label" for="{{cat.id}}">
        
        <a href="{% url 'category_wise_post' cat.slug %}" class="text-decoration-none text-dark" >{{cat.name}}</a>
      </label>
    </div>
    {% endfor %}
  </div>
  <div class="col-10 p-3">
    <h4>{{data | length}} results found</h4>
    <div class="d-flex flex-wrap pt-5">
      {% for post in data %}
      <div class="col-sm-3">
        <div class="card m-2">
          <div class="card-body">
            <img src="{{post.image.url}}" class="card-img-top" alt="...">
            <h5 class="card-title"><a href="{% url 'detail_post' post.id %}" class="text-decoration-none text-dark">{{post.title}}</a></h5>
            <p class="card-text">{{post.content |truncatewords:10}}</p>
            <p>Author : {{post.author.first_name}} {{post.author.last_name}}</p>
            <p>
              Category : {% for cat in post.category.all %}
              <button class="btn btn-primary btn-sm m-2" disabled>
                {{cat.name}}
              </button>
              {% endfor %}
            </p>
          </div>
        </div>
      </div>
      {% endfor %}
    </div>
  </div>
</div>
{% endblock %}

• ৪৫ নং লাইনে পোস্টের টাইটেল <a> ট্যাগে রেখেছি যেন ক্লিক করলে 'detail_post' URL -এ যাওয়া যায়

• ৪৬ নং লাইনে post.content এর জন্য truncatewords:10 ফিল্টার ব্যবহার করেছি যেন হোমপেজে প্রতিটি পোস্টের কনটেন্টের সর্বোচ্চ ১০ টি ওয়ার্ড দেখা যায়

posts এ্যাপে post_details.html ফাইল ক্রিয়েট করে ফেলি-

Code:: 11.5.2 posts/templates/post_details.html

{% extends 'base.html' %}
{% load crispy_forms_tags %}
{% block content %}
<div class="col-12">
    <div class="card m-2">
        <div class="card-body">
            <img src="{{post.image.url}}" class="card-img-top" alt="..." style="width:50%;">
            <h1 class="card-title">{{post.title}}</h1>
            <p class="card-text">{{post.content}}</p>
            <p>Author : {{post.author.first_name}} {{post.author.last_name}}</p>
            <p>
                Category : {% for cat in post.category.all %}
                <button class="btn btn-warning btn-sm m-2" disabled>
                    {{cat.name}}
                </button>
                {% endfor %}
            </p>
        </div>
    </div>
</div>

{% endblock %}

পোস্ট ডিটেইলস এর জন্য DetailView , DetailPostView(DetailView) লিখে ফেলি-

Code:: 11.5.3 posts/views.py

from django.shortcuts import render, redirect
from django.urls import reverse_lazy
from . import forms
from . import models
from django.contrib.auth.decorators import login_required
from django.views.generic import CreateView,UpdateView,DeleteView,DetailView
from django.utils.decorators import method_decorator

...
...
...
 
class DetailPostView(DetailView):
    model = models.Post
    pk_url_kwarg = 'id'
    template_name = 'post_details.html'

ভিউ-টি URL-প্যাটার্নে এ্যাড করে দেই-

Code:: 11.5.4 posts/views.py

from django.contrib import admin
from django.urls import path, include
from . import views
urlpatterns = [
    # path('add/', views.add_post, name='add_post'),
    path('add/', views.AddPostCreateView.as_view(), name='add_post'),
    # path('edit/<int:id>', views.edit_post, name='edit_post'),
    path('edit/<int:id>/', views.EditPostView.as_view(), name='edit_post'),
    # path('delete/<int:id>', views.delete_post, name='delete_post'),
    path('delete/<int:id>/', views.DeletePostView.as_view(), name='delete_post'),
    path('details/<int:id>/', views.DetailPostView.as_view(), name='detail_post'),
]

এখন, হোমপেজ থেকে কোনো পোস্টের টাইটেলে ক্লিক করলে পোস্টটির ডিটেইল ভিউ দেখতে পাব