IvanKao的部落格

Python Django 學習紀錄：架設個人部落格(五) 

自定義模板標籤獲取評論

取得資料的方法不限於在<views.py>的方法中查找資料庫

也可以將資料透過自定義模板標籤的方式直接傳送到模板

這使得資料不需經過不同應用的<views.py>而更具獨立性

一.、自定義模板標籤

在應用內創建 templatetags 包

在其中創建 <__init__.py> 文件

load 標籤加載文件 

 1.評論計數： 

使用自定義模板標籤的方式進行評論計數，將結果顯示在<blog_list.html>與<blog_detail.html>

在comment應用目錄創建 templatetags文件夾，並在其中創建<__init__.py> 文件

在templatetags目錄中創建<comment_tags.py>文件

導入ContentTypes框架、Comment模型

藉由templatetags自定義的get_comment_count方法將查詢後的評論數量傳送回前台

這裡的obj參數會引入blog模型，進行contenttypes框架外鍵關聯的部分

以下為代碼：   

from django import template
from ..models import Comment
from django.contrib.contenttypes.models import ContentType

register = template.Library()

@register.simple_tag
def get_comment_count(obj):
    content_type = ContentType.objects.get_for_model(obj)
    return Comment.objects.filter(content_type=content_type, object_id=obj.pk).count()

在<blog_list.html>調用自定義模板標籤：   

{% load comment_tags %}
        <div class="blog">
            <h3><a href="{% url 'blog_detail' blog.pk %}">{{ blog.title }}</a></h3>
            <p class="blog-info">
                <span class="glyphicon glyphicon-tag"></span>分類：<a href="{% url 'blogs_with_type' blog.blog_type.pk %}">{{ blog.blog_type }}</a>
                <span class="glyphicon glyphicon-time"></span>發表日期：{{ blog.created_time|date:"Y-m-d" }} <span>閱讀({{ blog.get_read_num }})</span>
                <!-- 調用自定義模板標籤 -->
                <span>評論({% get_comment_count blog %})</span>
            </p>
            <p>{%autoescape off%} {{blog.content|truncatechars:120}} {%endautoescape%}</p>
        </div>

在<blog_detail.html>調用自定義模板標籤：   

{% load comment_tags %}
        <ul class="blog-info-description">
            <li>作者：{{ blog.author }}</li>
            <li>分類：<a href="{% url 'blogs_with_type' blog.blog_type.pk %}">{{ blog.blog_type }}</a></li>
            <li>發表日期：{{ blog.created_time|date:"Y-m-d H:i:s" }}</li>
            <li>閱讀({{ blog.get_read_num }})</li>
            <!-- 調用自定義模板標籤 -->
            <li>評論({% get_comment_count blog %})</li>
        </ul>

 2.評論表單： 

使用自定義模板標籤的方式將評論表單傳送至前台頁面

在在templatetags目錄<comment_tags.py>文件創建get_comment_form方法

將原先在blog應用<views.py>使用到關於comment表單的部分移至此方法中(原先的部分不保留)

以下為代碼：   

from .. forms import CommentForm

@register.simple_tag
def get_comment_form(obj):
    content_type = ContentType.objects.get_for_model(obj)

    #使用initial在運行時聲明表單字段的初始值，將文章類型與編號賦值
    data={}
    data['content_type']= content_type.model
    data['object_id'] = obj.pk
    data['reply_comment_id'] = 0 #初始化回復對象為頂層(值為0)
    form = CommentForm(initial=data)
    return form

<blog_detail.html>中引用表單的部分也要進行修改

這裡的obj參數會引入blog模型，進行contenttypes框架外鍵關聯的部分

而因為要使用for迴圈，所以先得將引入的templatetags重新命名再引用

以下為代碼：   

            <!-- 傳入編輯器表單 -->
            {% get_comment_form blog as comment_form %}
            {% for field in comment_form %}
                {{ field }}
            {% endfor %}

3.評論列表： 

使用自定義模板標籤的方式將評論列表傳送至前台頁面

在在templatetags目錄<comment_tags.py>文件創建get_comment_list方法

將原先在blog應用<views.py>使用到關於comment列表的部分移至此方法中

以下為代碼：   

@register.simple_tag
def get_comment_list(obj):
    #獲取評論
        #取得該評論對應的文章類型與編號
    content_type = ContentType.objects.get_for_model(obj)
    comments = Comment.objects.filter(content_type=content_type, object_id=obj.pk, parent=None)
    return comments.order_by('-comment_time')

<blog_detail.html>中引用comment列表的部分也要進行修改

這裡的obj參數會引入blog模型，進行contenttypes框架外鍵關聯的部分

而因為要使用for迴圈，所以先得將引入的templatetags重新命名再引用

以下為代碼：   

        <div id="comment_list">
            {% get_comment_list blog as comments %}
            {% for comment in comments %}

經過刪減後的blog_detail方法如下：   

def blog_detail(request, blog_pk): #導入 blog_pk 變數
    context={} #建立字典
    blog = get_object_or_404(Blog, pk=blog_pk)  #獲取blog_pk
    read_cookie_key = read_statistic_once_read(request, blog) #使用閱讀計數

    #資料庫文章日期已經為由新到舊排列(新文章日期大於舊文章日期)
    #獲取前一篇文章，取得大於該文章的日期中的最後一篇
    context['previous_blog'] = Blog.objects.filter(created_time__gt=blog.created_time).last()
    #獲取後一篇文章，取得小於該文章的日期中的第一篇
    context['next_blog'] = Blog.objects.filter(created_time__lt=blog.created_time).first()
    context['blog'] = blog


    response = render(request, 'blog/blog_detail.html', context) #將字典返回到'blog_detail.html'
    response.set_cookie(read_cookie_key, 'true') #閱讀cookie
    return response

二.、CSS樣式調整與其他細節

1.回復CSS樣式調整： 

點擊評論後方的回復連結時，會在文本編輯器的上方顯示要回應的評論內文

這裡將這段顯示的內文美化

在<blog.css>添加以下為代碼：   

div#reply_content_container {
    border: 1px solid #d1d1d1;
    border-bottom: none;
    background-color: #f8f8f8;
    overflow: hidden;
    padding: 1em 0.5em 0.5em;
    display: block;
}

2.添加favicon圖標： 

Django總是報錯說找不到favicon.ico檔案

原來這正是網站的圖標

如是打開GOOGLE網頁時，分頁標籤前方會有個"G"圖標

圖標製作的方法可以到網路上將喜歡的圖片壓縮，或是自己繪製

而最後使用在基礎模板頁面添加圖標路徑的方法，讓所以頁面都能獲取到

將圖標放在專案目錄的static目錄中

接著在<base.html>的<head>標籤添加以下為代碼：   

<link rel="shortcut icon" href="/static/favicon.ico">