[GitHub Pages] Jekyll Theme 커스트마이징
이 블로그는 minimal-mistakes 테마를 이용하여 생성하였고,
minimal-mistakes 가이드 바로가기
_config.xml 수정으로 사이트명, 설명, 카테고리 구조 등을 커스트마이징 할 수 있다.
1. config.xml 파일
_config.xml 파일에서 사이트명, 설명, 카테고리 구조등 커스트마이징이 가능하다.
#theme : "minimal-mistakes-jekyll"
remote_theme : "mmistakes/minimal-mistakes"
minimal_mistakes_skin : "default" # "air"
# Site Settings
locale : "ko-KR"
title : "Onda2Me"
title_separator : "-"
subtitle :
name : "onda2me"
description : "Java, Arduino, Algorithm, Scrath . . ."
# Site Author
author:
name : "onda2me"
avatar : "/assets/images/main/about-01.jpg"
bio : "Java, 알고리즘, 아두이노에 관심있는 개발자."
# Collections
collections_dir: webdocs
collections:
algorithm:
output: true
permalink: /:collection/:path/
blog:
output: true
permalink: /:collection/:path/
pets:
output: true
permalink: /:collection/:path/
# _blog
- scope:
path: ""
type: blog
values:
layout: single
author_profile: false
share: false
comments: true
2. navigation.yml
/_data/navigation.yml 에서 메인메뉴 및 문서별 메뉴를 설정한다.
# main links
main:
- title: "Posts"
url: /post/
- title: "Algorithm"
url: /algorithm/
- title: "GitHub Blog"
url: /blog/
- title: "About"
url: /about/
# documentation links
docs_blog:
- title: GitHub Pages
url: /blog/
children:
- title: "1. GitHub Pages 블로그?"
url: /blog/intro/
- title: "2. Ruby & Jekyll 설치"
url: /blog/setting/
- title: "3. GitHub Pages 만들기"
url: /blog/make/
- title: "4. Jekyll Theme 변경"
url: /blog/theme/
- title: "5. Jekyll Theme 커스트마이징"
3. 사이트 디렉토리 구조
onda2me # minimal-mistakes 디렉토리명 변경
├── _data # data files for customizing the theme
| ├── navigation.yml # main navigation links
| └── ui-text.yml # page내 한글/영어 UI 문구 Config
├── _includes
| ├── analytics-providers # snippets for analytics (Google and custom)
| ├── comments-providers # snippets for comments
| ├── footer
| | └── custom.html # custom snippets to add to site footer
| ├── head
| | └── custom.html # custom snippets to add to site head
| ├── search #
| | ├── google-search-scripts.html
| | └── search_form.html
| └── ...
├── _layouts
| ├── archive-taxonomy.html # tag/category archive for Jekyll Archives plugin
| ├── archive.html # archive base
| ├── categories.html # archive listing posts grouped by category
| ├── category.html # archive listing posts grouped by specific category
| ├── collection.html # archive listing documents in a specific collection
| ├── compress.html # compresses HTML in pure Liquid
| ├── default.html # base for all other layouts
| ├── home.html # home page - not used
| ├── posts.html # archive listing posts grouped by year
| ├── search.html # search page
| ├── single.html # single document (post/page/etc)
| ├── splash.html # 확인중
| ├── tag.html # archive listing posts grouped by specific tag
| ├── tags.html # archive listing posts grouped by tags
| └── splash.html # splash page
├── _sass # SCSS partials
| ├── minimal-mistakes # minimal-mistakes theme directory
| | ├── skins # jQuery plugins
| | ├── _air.scss # deault skin
| | ├── _aqua.scss # aqua skin
| | └── ... # etc skin
| | ├── vendor # vendor scss
| | ├── _archive.scss # archive layout scss
| | ├── _base.scss # base (= common) scss
| | ├── _footer.scss # footer layout scss
| | └── ... # etc scss
| └── minimal-mistakes.scss # minimal-mistakes theme import scss
├── assets
| ├── css
| | └── main.scss # main stylesheet, loads SCSS partials from _sass
| ├── images # image assets for posts/pages/collections/etc.
| | ├── blog # blog images directory
| | └── main # main images directory
| ├── js
| | ├── plugins # jQuery plugins
| | ├── vendor # vendor scripts
| | ├── _main.js # plugin settings and other scripts to load after jQuery
| | └── main.min.js # optimized and concatenated script file loaded before </body>
├── webdocs # post file directory
| ├── _algorithm # algorithm category post
| ├── _blog # blog category post
| ├── _pages # page post
| └── _posts # post
├── _config.yml # site configuration
├── Gemfile # gem file dependencies
├── index.md # home page showing recent posts & algorithm collections
└── package.json # NPM build scripts
댓글남기기