How to group messages by date on the home page in Jekyll?

Question

In Jekyll, I would like my homepage to display the most recent posts, grouped by date, for example:

September 6, 2013

• Message 1
• Message 2
• Message 3

September 5, 2013

• Message 1
• Message 2

Basically, I just want to spit out the date header when the post in the loop will be different from the date previously processed. I tried to do this by checking if the next entry in the for loop matches the date of the last message and displays the date header only if it is not. This is what my liquid pattern looks like:

--- layout: default title: Home Page --- {% assign thedate = '' %} {% for post in site.posts %} {% if thedate != post.date | date: "%m-%d-%Y" %} <h2>{{ post.date | date: "%A, %B %e, %Y" }}</h2> {% endif %} {% assign thedate = post.date | date: "%m-%d-%Y" %} <h3 class="headline"><a href="{{ post.url }}">{{ post.title }}</a></h3> {{ post.content }} <hr> {% endfor %} 

If instead of using post.date | date: "%m-%d-%Y" post.date | date: "%m-%d-%Y" instead I just say post.date , it works, and the messages are grouped together, but only if the messages have exactly the same date and time (not only on the same day of the month). Therefore, I am adding more specific post.date | date: "%m-%d-%Y" post.date | date: "%m-%d-%Y" .

Any ideas? Thanks so much for our help!

Answer 1

Found the answer by changing the solution for archives: http://www.mitsake.net/2012/04/archives-in-jekyll/

Here is the code that works:

 layout: default title: Home Page --- {% for post in site.posts %} {% capture day %}{{ post.date | date: '%m%d%Y' }}{% endcapture %} {% capture nday %}{{ post.next.date | date: '%m%d%Y' }}{% endcapture %} {% if day != nday %} <h5 class="date">{{ post.date | date: "%A, %B %e, %Y" }}</h5> {% endif %} {{ post.content }} <hr> {% endfor %} 

Answer 2

Alternative solution:

Write down the date directly in the format you want to display at the end.
(here: %A, %B %d, %Y → Monday, April 30, 2012 )

Then you do not need to use often | date: | date: ::

 {% for post in site.posts %} {% capture currentdate %}{{post.date | date: "%A, %B %d, %Y"}}{% endcapture %} {% if currentdate != thedate %} <h2>{{ currentdate }}</h2> {% capture thedate %}{{currentdate}}{% endcapture %} {% endif %} <h3><a href="{{ post.url }}">{{ post.title }}</a></h3> {% endfor %} 

Generated HTML:

 <h2>Monday, April 30, 2012</h2> <h3><a href="/2012/04/30/foo/">Foo</a></h3> <h2>Friday, March 09, 2012</h2> <h3><a href="/2012/03/09/bar/">Bar</a></h3> <h3><a href="/2012/03/09/baz/">Baz</a></h3> 

Answer 3

These previous solutions are a fantastic and elegant way to get around the flaws of previous versions of Jekyll, but, fortunately, at the end of 2016, Jekyll added a group_by_exp , which can do this a lot more cleanly.

 {% assign postsByDay = site.posts | group_by_exp:"post", "post.date | date: '%A, %B %e, %Y'" %} {% for day in postsByDay %} <h1>{{ day.name }}</h1> <ul> {% for post in day.items %} <li><a href="{{ post.url }}">{{ post.title }}</a></li> {% endfor %} </ul> {% endfor %} 

Documentation can be found on the Jekyll Templates page.