[GITHUB PAGES] Date Format 변경하기

📆 Created: 2024.10.26 Sat

🗓️ Updated: 2025.02.25 Tue

Reading time ~2 minutes

1. date 문구 추적

scripts.html, compress.html, post.html 3군데에서 date랑 관련된 부분이 나옴

~~git push --set-upstream origin header~~

2. scripts.html 추적

home.html, page.html, post-list.html, post.html, project.html 5군데에서 나옴

3. post.html

블로그 글이랑 가장 직접적인 연관이 많은 post.html 먼저 수정해보기로 함.
date 관련된 code 원본: <h4>Date: 26 Oct 2024</h4>

<h4>Date: 2024-10-26 00:00:00 +0000</h4> -> Date: 2024-10-17 00:00:00 +0000
<h4>Date: 2024-10-26 00:00:00 +0000</h4> -> Date: 2024-10-17 00:00:00 +0000
<h4>Date: 2024-10-26 00:00:00 +0000</h4> -> Date: 2024-10-17 00:00:00 +0000
<h4>Date: 2024 10 26 Sat</h4> -> Date: 2024 10 17 Thu

4. ‘updated date’ 추가

각각의 파일에 코드 추가

Gemfile

            
                group :jekyll_plugins do
  gem "jekyll-last-modified-at"
end

_config.yml

            
                plugins:
  - jekyll-last-modified-at
# Optional. The default date format, used if none is specified in the tag.
last-modified-at:
​    date-format: '%d-%b-%y' #(like "04-Jan-14").

post.html
<h4>Updated: 2025.02.25 Tue</h4> ->
```
Created: 2024.10.17 Thu
Updated:
```

last_modified_at 값이 존재할 때만 블로그 글에 created_date와 modified_date가 함께 보이길 바란다.

post.html
->

5. CSS 수정

목표: created date랑 updated date랑 가로로 배치하고 싶다

post.html 바로 밑에 p class="reading-time" 있는데 요거 css 쫓아가보겠습니다 -> elements.scss, print.scss

h4 태그로 감싸져있기 때문에
-1. h4를 다른 태그로 바꾼다
-2. 그 위에 div로 묶어서 inline으로 변경한다
2번째 방법부터 시도해보겠습니다

post.html - 코드 수정 ->
elements.scss - 코드 추가 -> Created: 2024.10.17 Thu Updated: 2024.10.24 Thu
가로로 배치 성공했는데 위치가 살짝 맘에 안 들어서 정렬을 바꿔봅시다

목표: updated date 생성 안 했을 때 grid 없애기

6. 궁금한 거

post 작성할 때 last_modified_at 부분을 작성하고 날짜만 기입하지 않는다면?
-> updated date 안 생김

7. home 버튼을 눌렀는데 home/index.html이 아니라 2024-10-23.md가 왜 불러와지는거죠??

github.io 홈에 들어가면 정상적으로 홈으로 가는 게 아니라 가장 최근에 포스팅한 포스트로 연결이 되는 것이 문제였다. _layout 파일에 있던 post.html에서 코드를 변경하고 있었기 때문에 그쪽을 건드려서 뭔가 발생하는 건가 생각했다.

아직 포스팅을 완벽하게 작성해놓은 게 아니여서 2024-10-23-.md으로 저장해놓고 있었다. 포스트 이름을 완벽하게 채웠더니 블로그 리스트 페이지가 원상 복귀했다.

그러면 이름을 완벽하게 안 적어놨을 때마다 발생하려나?? 나중에 한 번 확인해봐야겠다.

이렇게 수정하고 push 했는데 build 오류남 html 코드 내부에 있는 riquid 코드에서 오류가 발생한 듯 하다. pre 태그를 사용하지 않고 캡처해서 이미지로 업로드하니 정상적으로 push가 됐다.

참고

BLOG

/#disqus_thread