Blog Archives is very common in Wordpress. It is also available in Jekyll in many ways.
Blog Archives can be achieved without plugin. You can make your own custom archives, that is more suitable for your project.
This archive column come from my custom liquid archives script, not just another auto widget as usual at another platform.
Archives by Year
Archives by Month
Sidebar Archive Column
Navigation Menu: Using YAML Data.
You can modify it for your own.
Before you start. It is worth to have a peek in this official jekyll-archives-plugin written in ruby that works with github.
I started searching for a pluginless jekyll archives and found these amazing script.
Above script taught me how to use post.next inside the for iteration loop.
I’m using his method,
post.next to mark opening html tag of list it,
post.previous to mark the closing tag.
Unless is conditional statement. ‘unless’ is a shorter way to say ‘if not’. The idea comes from Ruby. Liquid template mimics this behaviour.
I can see that these smart coder have a ruby influence in writing their script style. You can see how efficient their code, in just a few lines, and its done.
The issue is when I try to extend for my purpose, it becomes more and more complicated. So I decide to rewrite, with different logic.
Instead of relying of post.next, I created the html DOM block utilizing comparison of year number within the for loop. I know it is primitive compared with previous script, but the template logic is clearer.
I also move all the variable into capture section, separate the code variable, and DOM block. Using capture , your liquid template won’t be bloated by huge of unnecessary new lines.
You can see the complete result in this archive page displayed by year. It is just an archive of posts sorted by date.
Let’s go further, archive page displayed by month. With the same logic, It won’t go that complicated.
I put the logic in _includes section, because I want to reuse the code.
And finally, let’s make it a sidebar as below figure.
It is a little bit longer, because I only show archives with the same month with the current post. So I have to make a comparison with current post.
Last, the header navigation bar drop down menu.
The YAML part
And the header part
Sample screenshot here.
Sample complete code here.
It is not very sophisticated. I hope that, this script is useful.
Thank you for reading.
- December 2016
- November 2016
- October 2016
- September 2016
- August 2016
- July 2016
- Install Awesome WM in Debian
- Install Awesome WM in Arch Linux based Distribution
- Jekyll Installation on Debian
- Jekyll Installation on Arch/Manjaro
- Install Yaourt, the AUR Helper
- Using Git for Daily Repo Updating
- Analyze Services in Linux Boot Process
- Create Your Own Monitoring Script
- Step by Step Guidance to be a Webcoder
- The Difference Between DE, Shell, WM and Compositor
- Elapsed Time, Yet Another Jekyll Liquid Port
- Create Stripes Using Inkscape to Decorate Blog Post
- Meet Our Friend, Regular Expression
- May 2016
- April 2016
- March 2016
- February 2016