ក្រោយ​ពី​បាន​បង្កើត​គំរូ​ទិន្នន័យ​នៃ​ការផ្សាយ​រួច​ហើយ យើង​អាច​បង្កើត​ការផ្សាយ​មាន​ចំនួន​មិន​កំណត់​ គឺ​អាស្រ័យ​ទៅ​លើ​ទំហំ​របស់​មូលដ្ឋាន​ទិន្នន័យ​ដែល​យើងមាន​។ ហើយ​ក្រោយ​ពី​បាន​បង្កើត​ការផ្សាយ (post) មាន​ចំនួ​ន​ច្រើន​គួរសម​ហើយ យើង​អាច​បង្ហាញ​ការផ្សាយ​ទាំងនោះ​នៅ​លើ​ទំព័រ​ដើម​នៃ​កម្មវិធី​គេហទំព័រ​របស់​យើង​បាន​ ដោយ​សរសេរកូដ​ដូច​ខាង​ក្រោម​នេះ៖

 

#mysite/blog/views.py
from django.shortcuts import render
from .models import Post

def index(request):
    from .controllers import _index
    kdict = _index.call()
    queryset = Post.objects.filter(status=1).order_by('-created_on')
    posts = [post for post in queryset]
    kdict['posts'] = posts
    return render(request, 'index.html', context=kdict)


def bookCover(request):
    from .controllers import _bookCover
    kdict = _bookCover.call()
    return render(request, 'bookcover.html', context=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 post in posts %}
        <div class='article'>
        <div class='post-title'>
            <a href='post/{{ post.slug }}'>{{ post.title }}</a>
            
        </div>
        <div class='post-body'>
            {{ post.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;
}

 

 

Heroku: https://khmerweb-blog.herokuapp.com/