Github 블로그 꾸미기

이전 포스트에서 열심히 github 블로그를 만들고 실행시키는 것까지 성공했다!
하지만 jekyll에서 기본적으로 제공하는 형식은 너무 밋밋하고, 가독성도 떨어진다.
이제부터 내 블로그에 좀 더 개성을 추가하고, 가독성을 높이기 위해 테마를 적용해 보자!!

테마 정하기

블로그를 꾸미려면 먼저 내 블로그에 적용하고 싶은 테마를 찾아야 한다.
jekyll theme 사이트에 들어가서 직접 찾아도 되고, 국룰 테마를 적용해도 된다.(여러 블로그에서 다양하게 추천을 많이 해준다.)
나는 여러 테마들을 살펴보고, 다양한 github 블로그들을 뒤적거린 결과 이 테마가 가장 마음에 들었다.
https://github.com/byanko55/jekyll-theme-satellite?ref=jekyll-themes.com

좌측에 카테고리별 정리가 깔끔하고, 프로필 사진도 넣을 수 있으며, 다크모드, 로딩뷰, 검색 기능 등 여러 디테일적인 요소가 포함되어 있다. 가장 결정적인 부분은 깔끔하면서 화려하다!(허허허 취향 반영~)

테마 적용하기

테마 적용하는 방법은 아주 간단하다.
자기가 원하는 테마의 github 링크로 들어가서 zip파일을 다운받은 후 내 폴더에 복붙하면 된다. 이때 겹치는 파일들이 있는데, 대치해 주면 된다.

이제 다시 로컬 서버에 띄워보자.
bundle exec jekyll serve
오잉? 오류가 발생했다.
Could not find gem 'jekyll-sitemap (~> 1.3)' in locally installed gems.
Run 'bundle install' to install missing gems.
아하! bundle을 설치하라는 메시지이다. 설명대로 설치해 주자.
bundle install
다시 실행시켜 보면 태마가 잘 적용된걸 확인할 수 있다.

테마 수정하기

테마까지 적용했으니 기본 포스트들이 올라와 있는 블로그를 완전히 내 정보로 바꿔보자.
복붙했던 폴더를 살펴보면 _config.yml 파일을 확인할 수 있다.
이 파일을 통해 블로그 이름, 설명, 로고, Social link 등을 수정할 수 있다.
이때 이미지 같은 경우 우너하는 이미지를 assets/img 폴더에 넣어야 이미지를 넣을 수 있다.
"/assets/img/OOO.png"

음… 사이드바에 방문자수가 나왔으면 좋겠다. 깃허브 방문자 수처럼 전체 방문자 수와 그날 방문자 수가 나오면 좋을 것 같다. 이를 한번 추가해보자!
_includes폴더에 가보면 sidebar.html을 찾을 수 있다.
sidebar의 가장 밑에 추가하고 싶으니 contact-lis의 밑 부분에 추가를 해보자.
추가하는 방법은 간단하다. Hits사이트에 가서 target url을 수정하고, 원하는 색과 아이콘을 골라 적용하면 된다.
https://hits.seeyoufarm.com/


만들어진 HTML LINK를 복사하여 sidebar.html에 잘 복붙하자.(기본적인 html 사용법은 간단하니 조금만 가지고 놀다보면 잘 할 수 있을 것이다.)
여기까지 하면 기본적인 테마 수정은 끝이난다~!~!!
(물론 더 열심히 꾸미면 많은 기능을 넣을 수 있지만…이정도만 해도 충분한 것 같다!)

마무리

지금까지 간단한 테마 적용을 알아봤다.
블로그를 만들고, 테마까지 수정했으니 이제 포스팅만 하면 된다!
마지막으로 다음 포스트에서 포스팅 방법을 알아보자!