Skip to content

5.3 News pages how do I?

Daniel Pett edited this page Dec 19, 2018 · 2 revisions

The news section functions much like a blog. To make this work, file naming is slightly different to elsewhere.

Each file in the _news folder takes this format:

YYYY-MM-DD-short-descriptive-text.md

This then gets rendered on the index page for news as the title and the date below it. Clever hey, magic from the Jekyll people!

Front matter

The front matter for news stories is quite simple and has a few more custom variables to add (note array of comma separated words for tags inside square brackets (these are optional):

---
layout: news
title: Soft launch of the Egyptian Coffins Project in Cairo
author: Melanie Pitkin
category: news
date: 2018-10-08
updated: 2018-12-12
tags: [cairo, launch]
---

Index page

The index page is located at the foot folder as news.md and the template that drives layout is _layouts/news.html

The news section to render these stories in order is this code block:

 <div class="row">
        <div class="col-12 mb-2 ">
            <h1 id="doc-main-h1">Latest news</h1>
        </div>
    </div>
    {% for post in site.news reversed %}
    <div class="card col-md-12 mb-3">
        <div class="card-body">
            <h3>{{ post.title }}</h3>
            {% if post.date %}
            <p>{{ post.date | date_to_string }}</p>
            {% endif %}
            <p>{{ post.excerpt }}</p>
            <a href="{{ post.url }}" class="btn btn-dark">Read more</a>
        </div>
    </div>
    {% endfor %}

When enough stories get added, pagination will be added.