Jekyll 을 이용하여 만든 Github 블로그 테마 적용하기

 Github 블로그 테마 적용

자신이 원하는 테마를 선택하여 다운로드하여 로컬저장소 폴더내에 복사하여 넣습니다.

일단 아래 링크에서 마음에 드는 테마를 고르세요
http://jekyllthemes.org/

선택한 테마의 Github 저장소로 이동하여 Clone or download에 Download ZIP 버튼을 클릭하여 프로젝트 파일을 다운로드합니다.(아래 이미지 참조)

다운로드한 파일을 로컬저장소 폴더내에 복사하여 넣습니다.
<참조 : 로컬 저장소 만드는 방법  ->http://swifteyes.blogspot.kr/2016/12/mac-jekyll-github.html>
테마마다 폴더내 파일 구성이 다르기 때문에 Gemfile , Gemfile.lock 이 두 파일은 제외하고 복사해서 넣어야 아래 오류들이 발생하지 않습니다.

in `rescue in specs': Your bundle is locked to i18n (0.7.0), but that version could not be found in any of the sources listed in your Gemfile. If you haven't changed sources, that means the author of i18n (0.7.0) has removed it. You'll need to update your bundle to a different version of i18n (0.7.0) that hasn't been removed in order to install. (Bundler::GemNotFound)

터미널을 실행하여 로컬저장소 폴더위치로 이동 후 아래명령어중 하나를 입력하면 빌드가 진행됩니다.

bundle exec jekyll serve

jekyll serve

참고 ) 빌드 진행중에 에러가 발생 할 경우 
테마마다 발생하는 오류가 다를것으로 예상되나 필자가 사용한 테마들의 경우 아래 에러들이 발생하였습니다.

<codinfox-lanyon-dev 테마의 경우>

 Dependency Error: Yikes! It looks like you don't have jekyll-paginate or one of its dependencies installed. In order to use Jekyll as currently configured, you'll need to install this gem. The full error message from Ruby is: 'cannot load such file -- jekyll-paginate' If you run into trouble, you can find helpful resources at http://jekyllrb.com/help/! 

jekyll 3.3.1 | Error:  jekyll-paginate

<karna-gh-pages 테마의 경우>

Dependency Error: Yikes! It looks like you don't have jekyll-seo-tag or one of its dependencies installed. In order to use Jekyll as currently configured, you'll need to install this gem. The full error message from Ruby is: 'cannot load such file -- jekyll-seo-tag' If you run into trouble, you can find helpful resources at http://jekyllrb.com/help/! 

jekyll 3.3.1 | Error:  jekyll-seo-tag

해결방법은 테마적용에 필요로 하는 파일을 추가해주는 것으로 해결이 되었습니다.

로컬저장소의 Gemfile 이라는 파일을 열어 필요로 하는 파일 이름을 추가합니다.
예) jekyll-paginate 일 경우

source "https://rubygems.org" gem "jekyll" gem "jekyll-paginate" Gemfile 에 추가 하였다면 저장 후 터미널에 아래 명령어를 입력하여 설치합니다. $ bundle install $ bundle exec jekyll serve

참고) 터미널에  $ bundle exec jekyll serve  명령어 입력 시 발생할 수 있는 에러들 ==

1)
Gem files will remain installed in /usr/local/lib/ruby/gems/2.4.0/gems/json-1.8.3 for inspection...

: 루비를 최신버전으로 설치 했을 시 2.4.0(글 쓴 기준일) 버전으로 설치되는데 json-1.8.3 을 설치해야 합니다.

gem install json -v '1.8.3'

위 설치명령어로 설치중에 또 다른 에러가 발생 할 수 있습니다.
글 쓴 시점에선 최신버전 2.4.0 버전에선  json-1.8.3을 지원 못한다는것이였습니다.

그래서 필자는 루비버전관리자인 RVM 을 이용하여 루비 2.3.3 버전으로 다운그레이드 하였습니다.

<참조:RVM 설치 방법 : http://railsapps.github.io/install-ruby.html>

루비버전을 2.3.3 으로 다운그레이드 하였다면 

다시 gem install json -v '1.8.3' 명령어를 입력하여  json-1.8.3 설치완료합니다.

루비를 새로 설치 하였기때문에 새로 jekyll를 다시 설치하고 jekyll serve 입력해야 합니다.

2)

in `rescue in specs': Your bundle is locked to public_suffix (2.0.4), but that version could not be found in any of the sources listed in your Gemfile. If you haven't changed sources, that means the author of public_suffix (2.0.4) has removed it. You'll need to update your bundle to a different version of public_suffix (2.0.4) that hasn't been removed in order to install. (Bundler::GemNotFound)

"bundler update" 명령어 입력하여 업데이트하면 해결됩니다.



연결이 되면 브라우저에 로컬저장소 블로그 접속주소를 입력하여 테마가 적용된걸 확인합니다.

접속주소는 테마마다 다르며 터미널에서 주소를 확인 할 수 있습니다.

 Server address: http://127.0.0.1:4000/karna/   <- 접속주소

 Server running... press ctrl-c to stop.

참고) 블로그 접속주소 입력하는 과정중에 발생 할 수 있는 오류

1.테마마다 다르겠지만 혹여 아래 에러가 나타난다면 로컬저장소 폴더 내 about.md 파일을 지워버리면 에러가 사라집니다.
Liquid Exception: Could not locate the included file 'icon-github.html' in any of ["/Users/xxxxxx/_includes"]. Ensure it exists in one of those directories and, if it is a symlink, does not point outside your site source. in about.md

2. 연결은 되는데 하얀 빈 페이지만 뜬다면 로컬저장소 폴더 내 "index.md" 파일을 지워야합니다.

3. 빌드 중 아래 에러가 발생한다면 Error: Address already in use - bind(2) for 127.0.0.1:4000xxx
터미널을 재실행하면 해결됩니다.




이제 원격저장소에 변경된 모든파일을 commit 하고 push 하여 적용합니다.

git add .
git commit -m "블로그 테마 적용"
git push origin master"

push 가 완료 되었다면 자신의 블로그를 들어가서 확인합니다. (아마 테마가 적용되지 않았을것입니다.)
테마처럼 블로그가 되어있지 않다면 _config.yml 파일을 열어"baseurl" 경로값을 수정 합니다
<아래 이미지 참조>

오른쪽상단의 연필모양 아이콘을 클릭하여 수정한뒤 저장

(아래이미지는 이미 수정하고 난 후)

 << 수정전>>

baseurl: "/lanyon/"

 <<수정후>>

baseurl: ""

일단 이것만 수정하면 테마가 제대로 적용된 블로그를 볼 수 있습니다.

그밖의 블로그의 페이지 정보들을 수정할때에도 _config.yml 파일의 내용을 수정하면 됩니다. 테마마다 다르니 천천히 빌드하며 자신의 스타일로 만드세요

감사합니다.