테마 설정

2023-10-16 hit count image

jekyll의 테마를 설정하여, 블로그를 좀 더 멋있게 만들어 보자.

jekyll 테마

jekyll의 테마를 설정하기 전에 jekyll의 설치 및 기본 프로젝트가 생성되있어야 한다. 아직 jekyll이 설치가 안되어있거나 프로젝트가 생성되지 않았다면, 이전 블로그인 jekyll 설치를 확인하자.

jekyll은 wordpress처럼 기본적으로 테마 설정이 가능하다. 여기에서는 우리가 사용한 테마를 설정하는 방법을 통해 jekyll의 테마 설정을 설명하도록 하겠다.

테마 검색

테마 설치

테마를 설치하는 방법은 크게 두가지가 있다.

  1. Gem을 통한 설치
  2. 파일 다운로드

Gem을 통한 설치

  1. Gemfile 파일 수정
gem "jekyll-theme-clean-blog"
  1. _config.yml 파일 수정
theme: jekyll-theme-clean-blog
  1. 테마 설치
bundle install
  1. 확인
bundle exec jekyll serve

jekyll을 실행해보면 새롭게 적용된 테마를 확인할 수 있다.

파일 다운로드

Gem 파일을 이용해 테마를 설치할 수 있다. 하지만 우리는 좀 더 자유롭게 테마를 수정하고 싶기 때문에, 테마 파일을 다운로드하여 적용하는 방식을 사용하기로 결정했다.

  1. 테마의 github 페이지 이동: startbootstrap-clean-blog-jekyll 테마

  2. Clone or download 버튼을 통해 다운로드

  3. 압축을 해제하고 파일 내용을 자신의 프로젝트로 복사한다.

  4. 확인

bundle exec jekyll serve

jekyll을 실행해보면 새롭게 적용된 테마를 확인할 수 있다.

테마 사용법

  1. Gem을 통한 설치
  • Gem을 통해 테마를 설치했다면 테마 사이트(Clean Blog)를 참고하여 사용하길 바란다.
  • 대부분의 테마 파일은 설치 방법과 사용 방법을 소개하고 있으므로 빠르게 시작하고 싶은 사람은 Gem을 통한 설치를 추천한다.
  1. 파일 다운로드
  • 우리는 테마를 좀 더 자유롭게 사용하기 위해 파일 다운로드 방식으로 프로젝트를 구성했다.
  • 다음 블로그인 폴더 구조를 통해 테마의 활용을 설명하도록 하겠다.

참고 사이트

제 블로그가 도움이 되셨나요? 하단의 댓글을 달아주시면 저에게 큰 힘이 됩니다!

앱 홍보

책 홍보

블로그를 운영하면서 좋은 기회가 생겨 책을 출판하게 되었습니다.

아래 링크를 통해 제가 쓴 책을 구매하실 수 있습니다.
많은 분들에게 도움이 되면 좋겠네요.

스무디 한 잔 마시며 끝내는 React Native, 비제이퍼블릭
스무디 한 잔 마시며 끝내는 리액트 + TDD, 비제이퍼블릭
[심통]현장에서 바로 써먹는 리액트 with 타입스크립트 : 리액트와 스토리북으로 배우는 컴포넌트 주도 개발, 심통
Posts