ជាទូទៅ ដើម្បីបង្ហាញអត្ថបទនិងឬពហុព័ត៌មានមាននៅក្នុងការផ្សាយទាំងឡាយ ដល់អ្នកចូលអានគេហទំព័រ យើងចាំបាច់ត្រូវបង្កើតគំរូទំព័រនៃការផ្សាយទោលមួយសិន ដែលភាសាអង់គ្លេសហៅថា single post template ។ ហើយបង្កើតគំរូទំព័រនៃការផ្សាយទោលដ៏សាមញ្ញមួយ អាចត្រូវធ្វើឡើងដូចខាងក្រោមនេះ៖
#mysite/blog/views.py
from django.shortcuts import render
def index(request):
from .controllers import _index
kdict = _index.call()
return render(request, 'index.html', context=kdict)
def post(request, slug):
from .controllers import _post
kdict = _post.call(slug)
return render(request, 'post.html', context=kdict)
def bookCover(request):
from .controllers import _bookCover
kdict = _bookCover.call()
return render(request, 'bookcover.html', context=kdict)
from .. import config
from copy import deepcopy
from datetime import datetime
from pytz import timezone
from .. models import Post
def call(slug):
kdict = deepcopy(config.kdict)
kdict['datetime'] = datetime.now(timezone('Asia/Phnom_Penh'))
queryset = Post.objects.filter(slug=slug)
kdict['post'] = queryset
return kdict
{% extends 'base.html' %}
{% load static %}
{% block insert_into_head %}
<link rel="stylesheet" href="{% static 'styles/index.css' %}">
{% endblock %}
{% block main %}
<div class='main region'>
{% block content %}
<div class='content'>
{% for v in post %}
<div class='article'>
<div class='post-title'>
<a href='post/{{ post.slug }}'>{{ v.title }}</a>
</div>
<div class='author'>
by {{ v.author }}
</div>
<div class='date'>
{{ v.created_on }}
</div>
<div class='post-body'>
{{ v.content }}
</div>
</div>
{% endfor %}
</div>
{% endblock %}
{% block sidebar %}
<div class='sidebar'>
ផ្សាយពាណិជ្ជកម្ម
</div>
{% endblock %}
</div>
{% endblock %}
.main{
margin-top: 30px;
margin-bottom: 30px;
display: grid;
grid-template-columns: 73% auto;
grid-gap: 20px;
}
.main .sidebar{
padding: 20px;
background: #ddd;
}
.main .content .article{
background: #ddd;
margin-bottom: 20px;
padding: 20px;
}
.main .content .article:last-child{
margin-bottom: 0;
}
.main .content .post-title{
font: 20px/1.5 Oswald;
margin-bottom: 20px;
}
.main .content .date{
margin-bottom: 20px;
}
@media only screen and (max-width: 600px){
.main{
grid-template-columns: 100%;
}
}