cssdatejekyllgithub-pagesjekyll-theme

How to change the format of the date that appears on website via CSS?

I'm currently hosting my own webpage using GitHub Pages and Jekyll themes. The repository is here.

The current date format for my posts look like this:

enter image description here

and I want to change the date format to something like Sep. 12, 2020. However, I'm not sure how to do that. I've tried searching online but as I have almost zero knowledge in web-related things I'm not sure what to even search for. I'm not sure if it's correct or even relevant, but this Stack Overflow question seems to say that you can't change the format.

Thanks.

Solution

  • So the best way to do this would be to change the format of the date in the index page, since then you only have to set it once, which is in /blog/index.html.

    This is a great website that explains all of the different formatting options for dates in Jekyll.

    And all that you have to do is to add a filter on to the end of the date, like so:

    <span>{{ post.date | date_to_string | date: "%b. %d, %Y"}}</span> &raquo;

    Which outputs the dates as:

    Sep. 12, 2020 » Too Much Game
Sep. 11, 2020 » Daily Update
Sep. 09, 2020 » Relation Extraction
Sep. 07, 2020 » Exposure Bias and Teacher Forcing, RE
Sep. 05, 2020 » Sean Yi, Launches Site

    Screenshot of the end result