1. Language Date Format Definition

In the root directory of your project, create or edit the _data/strings.yml file and add the following content:

en:
  date_format: "%B %-d, %Y"
zh:
  date_format: "%Y年%-m月%-d日"

This file is used to centrally manage date format definitions for each language, making future extensions and maintenance easier.

2. Modify the Corresponding File

Open the _includes/latest_posts.liquid file and locate the output loop section:


{% for item in latest_posts_all limit: latest_posts_limit %}

At the appropriate position, update or insert the following code:


{% assign date_str = '' %}
{% if page.lang == 'zh' %}
  {% assign date_str = item.date | date: '%Y年%-m月%-d日' %}
{% else %}
  {% assign date_str = item.date | date: '%B %-d, %Y' %}
{% endif %}

<span class="news-date"> — {{ date_str }}</span>

3. Add Styling

You can add the following CSS to your main stylesheet, such as /assets/css/main.scss, or within a <style> tag on the page:

// Make the date color slightly lighter
.news-date {
  color: #888;
  font-size: 0.9em;
  margin-left: 0.5em;
  white-space: nowrap;
}