blog开发之个人站点

个人站点

页面效果：

 

 

主要功能：

1.侧边栏展示与筛选

2.使用到inclusiont_tag

视图代码

def home_site(request, username, *args, **kwargs):
    user_obj = models.UserInfo.objects.filter(username=username).first()
    if not user_obj:
        return render(request, 'blog/not_found.html')
    article_list = models.Article.objects.filter(user__username=username)
    blog = user_obj.blog
    if kwargs:
        condition = kwargs.get('condition')
        param = kwargs.get('param')
        if condition == 'tag':
            article_list = article_list.filter(tag__title=param)
        elif condition == 'category':
            article_list = article_list.filter(category__title=param)
        elif condition == 'archive':
            year, month = param.split('_')
            article_list = article_list.filter(create_time__year=year, create_time__month=month)

    return render(request, 'blog/home_site.html', {'article_list': article_list, 'blog': blog, 'username': username})

通过自定义标签inclusion_tag来达到样式和数据的分离

from django import template
from blog import models
from django.db.models import Count

register = template.Library()


@register.inclusion_tag('blog/classification_style.html')
def get_classification_style(username):

    user_obj = models.UserInfo.objects.filter(username=username).first()
    blog = user_obj.blog
    tag_list = models.Tag.objects.filter(blog=blog).values('pk').annotate(c=Count('article__title')).values_list('title','c')
    cate_list = models.Category.objects.filter(blog=blog).values('pk').annotate(c=Count('article__title')).values_list('title','c')
    date_list = models.Article.objects.filter(user=user_obj).extra(
        select={"y_m_date": "date_format(create_time,'%%Y_%%m')"}
    ).values("y_m_date").annotate(c=Count("nid")).values_list("y_m_date", "c")

    return {'tag_list': tag_list, 'cate_list': cate_list, 'date_list': date_list, 'blog': blog, 'username': username}

classifacation_style页面：

<div class="panel panel-warning">
    <div class="panel-heading">我的标签</div>
    <div class="panel-body">
        {% for tag in tag_list %}
            <p><a href="/blog/{{ username }}/tag/{{ tag.0 }}/">{{ tag.0 }}({{ tag.1 }})</a></p>
        {% endfor %}

    </div>
</div>
<div class="panel panel-primary">
    <div class="panel-heading">随笔分类</div>
    <div class="panel-body">
        {% for cate in cate_list %}
            <p><a href="/blog/{{ username }}/category/{{ cate.0 }}">{{ cate.0 }}({{ cate.1 }})</a></p>
        {% endfor %}

    </div>
</div>
<div class="panel panel-success">
    <div class="panel-heading">随笔归档</div>
    <div class="panel-body">
        {% for date in date_list %}
            <p><a href="/blog/{{ username }}/archive/{{ date.0 }}">{{ date.0 }}({{ date.1 }})</a></p>
        {% endfor %}
    </div>
</div>

home.site页面：

{% extends 'blog/base.html' %}

{% block content %}
    <div class="article_list">

                    {% for article in article_list %}
                        <div class="article_item">
                            <h5><a href="{% url 'blog:article_detail' username article.pk %}">{{ article.title }}</a></h5>
                            <div class="article_desc">
                                <span class="media-left">
                                    <a href=""><img src="/blog/media/{{ article.user.avatar }}" width="56" height="56" alt=""></a>
                                </span>
                                <span class="media-right">
                                    {{ article.desc }}
                                </span>
                            </div>
                            <div class="small pub_info">
                                <span><a href="">{{ article.user.username }}</a></span> &nbsp;&nbsp;&nbsp;
                                <span>发布于: &nbsp;{{ article.create_time|date:'Y-m-d' }}</span>
                                <span class="glyphicon glyphicon-comment"></span>评论({{ article.comment_count }})
                                <span class="glyphicon glyphicon-thumbs-up"></span>点赞({{ article.up_count }})
                            </div>
                        </div>
                        <hr>
                    {% endfor %}
    </div>
{% endblock %}

通过模板继承共用一个样式，减少代码。