For the last step, switch back to edit-mode and click the Content button in the upper-right of the toolbar. You might notice that the Older Posts -> link is missing.

To solve this, head back to your templates and open latest_articles.html inside /templates/aldryn_newsblog/plugins/ in your editor. It should look like this:

{% load i18n %}

{% for article in article_list %}
    {% include "aldryn_newsblog/includes/article.html" with namespace=instance.app_config.namespace %}
{% empty %}
    <p>{% trans "No items available" %}</p>
{% endfor %}

Add the following code at the end of the file:

<!-- Pager -->
<div class="clearfix">
  <a class="btn btn-primary float-right" href="#">Older Posts &rarr;</a>
</div>

Save the template and go back to your browser.

Now open article.html inside templates/aldryn_newsblog/includes and adapt the following lines:

  • from
    {% render_model article "title" %}
    to
     {% render_model article "title" "" "" "striptags" %} 
  • from
     {% render_model article "lead_in" "" "" "truncatewords:'20'" %}
    to
     {% render_model article "lead_in" "" "" "truncatewords:'20'|striptags" %} 
  • from
     {% render_model article "lead_in" %}
    to
     {% render_model article "lead_in" "" "" "striptags" %} 
  • from
    {{ article.publishing_date|date }}
    to
    {{ article.publishing_date|date:"F d, Y" }} 
  • striptags will remove all defined HTML markup to render titles correctly, since they are already inside an <h2> or <h3>
  • date:"F d, Y" formats our date to be aligned with the theme

Save the file article.html.

___

Configuring Date and Time
Django provides extensive configuration for date and time. In our article.html example, we used “date:"F d, Y"” to get the correct format for our article items “Posted by Start Bootstrap on February 2, 2016.” When just using “date” as a filter, Django will use the default configuration in your settings.py file.
___

The last thing left to do is change the Older Posts link. Head back to latest_articles.html inside templates/aldryn_newsblog/plugins/ and replace the first line in latest_articles.html with:

{% load i18n apphooks_config_tags %}

then look for the following code:

<a class="btn btn-primary float-right" href="#">Older Posts &rarr;</a>

and replace it with:

<a class="btn btn-primary float-right" href="{% namespace_url "article-list" namespace=instance.app_config.namespace default='' %}">Older Posts &rarr;</a>

Save the file. The result should look like this:

Next we will have a look on how to make the blog detail header pretty.

Did this answer your question?