list-article

{% for article in blog.articles %}
                            <div class="row list_blog">
                                <div class="box-article">
                                    <a href="{{ article.url }}" title="{{ article.title }}" class="pull-left">
                                        {% if article.image != null %}
                                            <img src="{{ article.image.src | img_url:'medium' }}">
                                        {% else %}
                                            <img src="{{ 'no_image.jpg' | asset_url }}"/>                       
                                        {% endif %}
                                    </a>
                                    <div>
                                        <h2><a href="{{ article.url }}">{{ article.title }}</a></h2>
                                        <div class="date_blog">
                                            <p>
                                                <span>{{ article.published_on | date:'dd/MM' }}</span>
                                                <span>{{ article.published_on | date:'yyyy' }}</span>
                                            </p>
                                        </div>
                                        <div class="interview">
                                            <div class="author_blog">
                                                <p><span class="glyphicon glyphicon-edit"></span> &nbsp; {{ article.author }}</p>
                                            </div>
                                            <div class="comment_blog">
                                                <a href="{{ article.url }}"><span class="glyphicon glyphicon-comment"></span> &nbsp; Bình luận</a>
                                            </div>
                                        </div>
                                        <div class="article-content">{{ article.content | strip_html | truncatewords:20 }}</div>

                                    </div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                            {% endfor %}


<style>
 .date_blog, .interview, .comment_blog, .author_blog {
    display: inline-block;
    font-size: 11px;
    color: #9A9A9A;
}
.box-article{
border-bottom: 1px solid #ddd;
    clear: both;
    padding-bottom: 15px;
    margin-bottom:15px
}
.box-article img {
    margin: 0 15px 0 0;
  
}
 .box-article h2 {
    margin: 5px 0;
    font-size: 16px;
}
</style>