Github 블로그를 chirpy 테마로 만들어보자-2(2022.10.20기준)

--- layout: home # Index page ---

index 페이지가 나오지 않고 이러한 문장이 백지에 나왔다.

이건 _config.yml 파일을 수정할 필요가 있다는 의미다.

B1 - _config.yml 수정

---

lang: en
timezone: Asia/Shanghai
url: ''
github:
  username: github_username             
img_cdn: 'https://raw.githubusercontent.com/cotes2020/chirpy-images/main'

아무 수정도 하지 않았을 경우 위에 있는 설정들만 바꿔준다.

lang: ko-KR
timezone: Asia/Seoul
url: 'https://airpark69.github.io' # Setting에 나와있는 본인 url
github:
  username: airpark69 # 본인 github id             
img_cdn: 'https://raw.githubusercontent.com/cotes2020/chirpy-images/main' # 이미지 참조할 때의 주소값인데 나중에 avatar의 설정을 바꾸기 위해서는 이 값을 빈칸으로 해놓아야 한다. 지금은 이 상태를 유지.

이 특정 설정들을 이렇게 바꾼다.

이렇게 해두고 저장한다.

중요한 것은 로컬에서 bundle exec jekyll serve 명령어를 통해서 한 번은 실행시켜 봐야 한다는 것이다.

그리고 Github Desktop으로 commit - push를 하게 되면...

여전히 안보인다.

이 때는 _config.yml을 제대로 못읽었다고 봐야한다.

img_cdn: ''

_config.yml 을 일부러 오류를 내도록 바꾼다.

다시 commit, push 한 뒤에 오류가 발생했는지 확인해준다.

오류가 발생했다면 다시 img_cdn의 값을 위의 기본값으로 돌려주자.

드디어 기대했던 홈페이지다.

정상적으로 나오는 모습이다.

B2 - avatar 수정

---

여기서 avatar란?

chirpy 테마에서 왼쪽 사이드바의 프로필 사진같은 동그란 이미지를 말한다.

당연히 기본 사진을 올려놓고 싶은 사람은 없을 것이다

_config.yml 에서

avatar: assets/img/avatar.jpg # 본인의 아바타 이미지를 폴더에 넣고 지정해주면 된다.
img_cdn:  #빈칸으로 바꾼다.

이미지 파일을 추가한 뒤, _config.yml을 수정했으면 로컬에서 실행해본다.

정상적으로 아바타가 나온다면 Github Desktop에서 commit - push를 실행해준다.

B3 - Title 및 tagline 수정

---

_config.yml 에서

title: Dragonhunter69                          # the main title

tagline: Losing is fun   # it will display as the sub-title

title, tagline을 수정해준다.

이 때, Notepad++같은 편집기가 아니라 메모장이나 워드패드로 수정을 했다면 오류가 날 수 있으니 조심.

한국어가 있을 경우, 메모장과 같은 편집기는 인코딩 문제가 발생한다.

그리고, 로컬에서 실행해본다.

문제없이 수정이 된 모습이다.

B4 -- favicon 수정

---

Favicon은 홈페이지 탭의 작은 아이콘을 말한다.

Favicon 생성 사이트

여기 들어가서 Select Your Favicon Image를 누른 뒤, 생성받은 파일을 받아서 자신의 Github 블로그 폴더의 assets/img/favicons 에다가 넣어주면 된다.

겹치는 파일만 넣어서 덮어쓰기 해주면 간단하게 해결된다.

이후에는 겪었던 오류 관련한 글을 써볼 예정이다.