블로그 제작기

깃허브 블로그를 만들기 위해 Ruby를 설치하여 jekyll을 설치한 뒤 적용시킬 블로그 테마를 다운로드 하여 커스터마이징 하는 과정을 포스팅했다.

1.Jekyll 설치 및 초기 설정

• RubyInstaller를 사용하여 x86 버전 윈도우용 Ruby를 설치한다.

• Windows 시작 > Start Command Prompt with Ruby 실행한다.

  gem install jekyll bundler
  

• 새로운 jekyll 사이트를 생성한다.

  jekyll new [user_name].github.io
  

• 생성한 jekyll 디렉토리로 이동하여 init후 remote repository에 push

  git init
  git remote add origin https://github.com/[user_name]/[user_name].github.io.git
  git push -u origin main
  

2. github 블로그에 테마 적용하기

테마를 직접 다운로드 하여 적용한다.

• Jekyll Themes에 들어가면 다양한 블로그 테마가 있다.

• 마음에 드는 테마를 골랐다면 다운로드 한다.

• 만들었던 [user_name].github.io 디렉토리로 이동한다.

  cd [user_name].github.io
  

• 디렉토리의 내용을 다운 받은 테마의 내용으로 덮어쓴다.
  
  

3. 테마를 나에게 맞게 커스터마이징 하기

다운 받은 테마의 기본 내용을 수정하여 나의 블로그로 커스터마이징 한다.

• 내가 적용한 테마는 Jekyll Themes에 있는 texture 테마이다.

• _config.yml에 있는 texture의 title, tagline, style, showPicker 기본값을 수정했다.

  texture:
  title: DaeYeol Sung
  tagline: Backend Developer
  date_format: "%b %-d, %Y"
  style: blue
  showNav: false
  showPicker: false
  

• showPicker는 테마의 색상을 변경하는 창을 띄워주는 역할을 하는데 필요하다면 사용할 수도 있다.

  showPicker: true
  

• page_header.html의 tagline밑에 학교명이 나오도록 태그를 하나 추가했다.

<h3>Sungkonghoe University</h3>

• twitter와 linkedin계정이 없기 때문에 page_header.html의 아래 내용을 주석처리하여 제거했다.

<a href="https://linkedin.com/"><li><i class="icon-linkedin-squared"></i></li></a>

<a href="https://twitter.com/"><li><i class="icon-twitter-squared"></i></li></a>

• github아이콘을 클릭했을 때 내 깃허브 주소로 이동하도록 _config.yml에 있는 social_link를 수정했다.(twitter, linkedin은 위의 과정에서 주석처리 했기 때문에 따로 손대지 않음.)

   social_links:
    twitter: thelehhman
    github:  Daeye0l
    linkedIn: in/thelehhman
    rss: rss
  

4. 추가로 하고싶은 작업

• post_header.html을 분석하여 포스팅 헤더에 태그 부여하기

• github뿐만 아니라 추가할 수 있는 social_link 더 추가하기