GitHub Pages 및 Jekyll 정보

Jekyll 정보

Jekyll은 GitHub Pages 및 간소화된 빌드 프로세스를 기본적으로 지원하는 정적 사이트 생성기입니다. Jekyll은 Markdown 및 HTML 파일을 가져와 선택한 레이아웃에 따라 완전한 정적 웹 사이트를 만듭니다. Jekyll은 사이트에 동적 콘텐츠를 로드하는 템플릿 언어인 Markdown 및 Liquid를 지원합니다. 자세한 내용은 Jekyll을 참조하세요.

Jekyll은 Windows에서 공식적으로 지원되지 않습니다. 자세한 내용은 Jekyll 설명서의 “Windows의 Jekyll”을 참조하세요.

GitHub Pages에서 Jekyll을 사용하는 것이 좋습니다. 원하는 경우 다른 정적 사이트 생성기를 사용하거나 로컬로 또는 다른 서버에서 자체 빌드 프로세스를 사용자 지정할 수 있습니다. 자세한 내용은 "GitHub Pages 정보"을(를) 참조하세요.

GitHub Pages 사이트에서 Jekyll 구성

_config.yml 파일을 편집하여 사이트의 테마 및 플러그 인과 같은 대부분의 Jekyll 설정을 구성할 수 있습니다. 자세한 내용은 Jekyll 설명서의 “구성”을 참조하세요.

GitHub Pages 사이트에 대해 일부 구성 설정은 변경할 수 없습니다.

lsi: false
safe: true
source: [your repo's top level directory]
incremental: false
highlighter: rouge
gist:
  noscript: false
kramdown:
  math_engine: mathjax
  syntax_highlighter: rouge

기본적으로 Jekyll은 다음과 같은 파일 또는 폴더를 빌드하지 않습니다.

/node_modules 또는 /vendor라는 폴더에 있음
_, . 또는 #로 시작함
~로 끝남
구성 파일의 exclude 설정에 의해 제외됨

Jekyll이 해당 파일을 처리하도록 하려면 구성 파일에서 include 설정을 사용할 수 있습니다.

프런트 매터

사이트의 페이지 또는 게시물에 대해 제목 및 레이아웃과 같은 변수와 메타데이터를 설정하기 위해 Markdown 또는 HTML 파일의 맨 위에 YAML 전문을 추가할 수 있습니다. 자세한 내용은 Jekyll 설명서에서 “전문”을 참조하세요.

site.github를 게시물 또는 페이지에 추가하여 리포지토리 참조 메타데이터를 사이트에 추가할 수 있습니다. 자세한 내용은 Jekyll 메타데이터 설명서에서 “site.github 사용”을 참조하세요.

테마

GitHub Pages 사이트에 Jekyll 테마를 추가하여 사이트의 모양과 느낌을 사용자 지정할 수 있습니다. 자세한 내용은 Jekyll 설명서의 “테마”를 참조하세요.

GitHub에서 지원되는 테마를 사이트에 추가할 수 있습니다. 자세한 내용은 GitHub Pages 사이트의 "지원되는 테마"와 "Jekyll을 사용하여 GitHub Pages 사이트에 테마 추가"를 참조하세요.

GitHub에서 호스트되는 다른 오픈 소스 Jekyll 테마를 사용하려면 테마를 수동으로 추가할 수 있습니다. 자세한 내용은 GitHub에 호스트된 테마와 “Jekyll을 사용하여 GitHub Pages 사이트에 테마 추가”을(를) 참조하세요.

테마의 파일을 편집하여 테마의 기본값을 재정의할 수 있습니다. 자세한 내용은 테마 설명서와, Jekyll 설명서의 “테마의 기본값 재정의”를 참조하세요.

플러그 인

Jekyll 플러그 인을 다운로드하거나 만들어 사이트의 Jekyll 기능을 확장할 수 있습니다. 예를 들어 jemoji 플러그 인을 사용하면 GitHub에서와 동일한 방식으로 사이트의 모든 페이지에서 GitHub 버전의 이모지를 사용할 수 있습니다. 자세한 내용은 Jekyll 설명서의 “플러그 인”을 참조하세요.

GitHub Pages는 기본적으로 사용하도록 설정되며 사용하지 않도록 설정할 수 없는 플러그 인을 사용합니다.

_config.yml 파일의 plugins 설정에 플러그 인의 gem을 추가하여 추가 플러그 인을 사용하도록 설정할 수 있습니다. 자세한 내용은 Jekyll 설명서의 “구성”을 참조하세요.

지원되는 플러그 인 목록은 GitHub Pages 사이트의 “종속성 버전”을 참조하세요. 특정 플러그 인에 대한 사용 정보는 플러그 인의 설명서를 참조하세요.

팁: GitHub Pages gem을 지속적으로 업데이트하여 모든 플러그 인의 최신 버전을 사용하도록 보장할 수 있습니다. 자세한 내용은 GitHub Pages 사이트에서 “Jekyll을 사용하여 로컬로 GitHub Pages 사이트 테스트” 및 “종속성 버전”을 참조하세요.

GitHub Pages는 지원되지 않는 플러그 인을 사용하여 사이트를 빌드할 수 없습니다. 지원되지 않는 플러그 인을 사용하려면 사이트를 로컬로 생성한 다음 사이트의 정적 파일을 GitHub Enterprise Cloud에 푸시합니다.

구문 강조

사이트를 더 쉽게 읽을 수 있도록 GitHub Pages 사이트에서 코드 조각이 GitHub Enterprise Cloud에서 강조 표시된 것과 동일한 방식으로 강조 표시됩니다. GitHub Enterprise Cloud의 구문 강조 표시에 대한 자세한 내용은 “코드 블록 만들기 및 강조 표시”을(를) 참조하세요.

기본적으로 사이트의 코드 블록은 Jekyll에 의해 강조 표시됩니다. Jekyll은 Pygments와 호환되는 Rouge 강조 표시자를 사용합니다. _config.yml 파일에서 Pygments를 지정하면 대체로 Rouge가 사용됩니다. Jekyll은 다른 구문 강조 표시자를 사용할 수 없으며 _config.yml 파일에 다른 구문 강조 표시자를 지정하면 페이지 빌드 경고가 표시됩니다. 자세한 내용은 "GitHub Pages 사이트에 대한 Jekyll 빌드 오류 정보"을(를) 참조하세요.

highlight.js와 같은 다른 강조 표시자를 사용하려면 프로젝트의 _config.yml 파일을 업데이트하여 Jekyll 구문 강조 표시를 사용하지 않도록 설정해야 합니다.

kramdown:
  syntax_highlighter_opts:
    disable : true

테마에 구문 강조 표시를 위한 CSS가 포함되지 않은 경우 CSS를 강조 표시하는 GitHub의 구문을 생성하고 프로젝트의 style.css 파일에 추가할 수 있습니다.

rougify style github > style.css

로컬로 사이트 빌드

분기에서 게시하는 경우 변경 내용이 사이트의 게시 원본에 병합될 때 을 사이트에 자동으로 게시합니다. 사용자 지정 GitHub Actions 워크플로에서 게시하는 경우 워크플로가 트리거(일반적으로 기본 분기로 푸시)될 때마다 변경 내용이 게시됩니다. 변경 내용을 먼저 미리 보려면 GitHub Enterprise Cloud 대신 로컬에서 변경할 수 있습니다. 그런 다음 로컬에서 사이트를 테스트합니다. 자세한 내용은 "Jekyll을 사용하여 로컬로 GitHub Pages 사이트 테스트"을(를) 참조하세요.