Jekyll 기본 사항 » 이력 » 버전 2

Jinwuk Admin, 2018/07/11 16:03

1 1 Jinwuk Admin
h1. Jekyll 기본 사항
2 1 Jinwuk Admin
3 1 Jinwuk Admin
다음 페이지에 있는 내용을 textile로 변환하였다.
4 1 Jinwuk Admin
5 1 Jinwuk Admin
Github Page에 Jekyll 기반의 블로그를 만들면서 적용한 내용을 기록하려고 합니다.
6 1 Jinwuk Admin
7 1 Jinwuk Admin
h2(#직접-작성). 직접 작성
8 1 Jinwuk Admin
9 1 Jinwuk Admin
https://jekyllrb-ko.github.io/ 페이지를 방문하면 지킬을 설치해서 빠른 시작을 할 수 있습니다. 여러모로 손이 많이 가기 때문에 이미 만들어져 있는 테마를 활용하기로 합니다.
10 1 Jinwuk Admin
11 1 Jinwuk Admin
h2(#테마-선택). 테마 선택
12 1 Jinwuk Admin
13 1 Jinwuk Admin
http://jekyllthemes.org/ 에 방문해서 지킬 테마를 찾습니다.
14 1 Jinwuk Admin
15 2 Jinwuk Admin
MIT, Creative Commons, GPL가 많이 보이고 대다수가 "MIT 라이선스":https://ko.wikipedia.org/wiki/MIT_%ED%97%88%EA%B0%80%EC%84%9C 입니다.
16 1 Jinwuk Admin
17 1 Jinwuk Admin
Github Page를 이용하면 소스를 자연스럽게 공개하게 되지만, 복잡하게 생각하지 않으려고 MIT 라이선스가 적용된 테마를 선택했습니다. 해당 테마의 github 저장소를 Fork 한 뒤 가져온 저장소 이름을 @{github_id}.github.io@로 변경하면 생성이 완료됩니다.
18 1 Jinwuk Admin
19 1 Jinwuk Admin
h2(#설정). 설정
20 1 Jinwuk Admin
21 1 Jinwuk Admin
h3(#검색엔진-등록). 검색엔진 등록
22 1 Jinwuk Admin
23 1 Jinwuk Admin
Github Page를 생성하는 것 만으로는 검색엔진에 노출되기 어렵습니다. 다음 과정을 통해서 외부 노출설정을 합니다.
24 1 Jinwuk Admin
25 1 Jinwuk Admin
<ul>
26 1 Jinwuk Admin
<li><p>robots.txt : 검색엔진의 웹 크롤러가 방문하면 참고하는 정책을 명시합니다</p>
27 1 Jinwuk Admin
<div class="language-text highlighter-rouge">
28 1 Jinwuk Admin
29 1 Jinwuk Admin
<div class="highlight">
30 1 Jinwuk Admin
31 1 Jinwuk Admin
bc(highlight). User-agent: *
32 1 Jinwuk Admin
Allow: /
33 1 Jinwuk Admin
Disallow: /about.html
34 1 Jinwuk Admin
Sitemap: http://{github_id}.github.io/sitemap.xml
35 1 Jinwuk Admin
36 1 Jinwuk Admin
37 1 Jinwuk Admin
38 1 Jinwuk Admin
</div>
39 1 Jinwuk Admin
40 1 Jinwuk Admin
41 1 Jinwuk Admin
</div>
42 1 Jinwuk Admin
</li>
43 1 Jinwuk Admin
<li>feed.xml, sitemap.xml : RSS Feed, Sitemap 생성
44 1 Jinwuk Admin
<ul>
45 1 Jinwuk Admin
<li>@_config.yml@에 plugin을 추가합니다</li>
46 1 Jinwuk Admin
</ul>
47 1 Jinwuk Admin
48 1 Jinwuk Admin
<div class="language-yml highlighter-rouge">
49 1 Jinwuk Admin
50 1 Jinwuk Admin
<div class="highlight">
51 1 Jinwuk Admin
52 1 Jinwuk Admin
bc(highlight). plugins:
53 1 Jinwuk Admin
  - jekyll-feed
54 1 Jinwuk Admin
  - jekyll-sitemap
55 1 Jinwuk Admin
56 1 Jinwuk Admin
57 1 Jinwuk Admin
58 1 Jinwuk Admin
</div>
59 1 Jinwuk Admin
60 1 Jinwuk Admin
61 1 Jinwuk Admin
</div>
62 1 Jinwuk Admin
</li>
63 1 Jinwuk Admin
<li>Google Search Console :
64 1 Jinwuk Admin
<ul>
65 1 Jinwuk Admin
<li>robots.txt, feed, sitemap 설정이 끝났다면 google console에 블로그를 등록 합니다.</li>
66 1 Jinwuk Admin
<li>메뉴의 크롤링 &gt; Sitemaps를 클릭하여 위에서 생성한 sitemap.xml 파일을 등록합니다.</li>
67 1 Jinwuk Admin
</ul>
68 1 Jinwuk Admin
</li>
69 1 Jinwuk Admin
</ul>
70 1 Jinwuk Admin
71 1 Jinwuk Admin
h3(#disqus-추가). Disqus 추가
72 1 Jinwuk Admin
73 1 Jinwuk Admin
Jekyll은 ruby기반의 정적 웹사이트이므로 댓글을 넣기위해서 Disqus를 사용합니다.
74 1 Jinwuk Admin
75 1 Jinwuk Admin
우선 "Disqus":https://www.disqus.com/를 방문해서 가입합니다.
76 1 Jinwuk Admin
77 1 Jinwuk Admin
우상단의 설정을 누른 뒤 (톱니바퀴) Admin &gt; Start &gt; Installing Disqus &gt; Create a Site 메뉴를 순서대로 클릭해서 블로그를 등록합니다.
78 1 Jinwuk Admin
79 1 Jinwuk Admin
상당수의 지킬 테마에서 Disqus를 지원하고 있지만, 현재 사용중인 테마에 관련 코드가 없다면 "$":https://disqus.com/admin/universalcode/를 참고합니다.
80 1 Jinwuk Admin
81 1 Jinwuk Admin
테마에서 Disqus를 지원하고 있다면 @_config.yml@ 파일에 정보를 기입합니다. 변수명은 해당 코드가 들어가는 페이지를 참고해서 일치 시킵니다.
82 1 Jinwuk Admin
83 1 Jinwuk Admin
bq. @{ site.disqus.shortname }@를 설정파일에서 정의하면
84 1 Jinwuk Admin
85 1 Jinwuk Admin
86 1 Jinwuk Admin
87 1 Jinwuk Admin
<div class="language-yml highlighter-rouge">
88 1 Jinwuk Admin
89 1 Jinwuk Admin
<div class="highlight">
90 1 Jinwuk Admin
91 1 Jinwuk Admin
bc(highlight).   disqus:
92 1 Jinwuk Admin
    shortname: { disqus_id }
93 1 Jinwuk Admin
94 1 Jinwuk Admin
95 1 Jinwuk Admin
96 1 Jinwuk Admin
</div>
97 1 Jinwuk Admin
98 1 Jinwuk Admin
99 1 Jinwuk Admin
</div>
100 1 Jinwuk Admin
101 1 Jinwuk Admin
h3(#_configyml). @_config.yml@
102 1 Jinwuk Admin
103 1 Jinwuk Admin
최종적으로 루트의 @_config.yml@ 파일에 정의되어 있는 블로그 정보를 수정합니다.
104 1 Jinwuk Admin
105 1 Jinwuk Admin
h2(#포스트-작성). 포스트 작성
106 1 Jinwuk Admin
107 1 Jinwuk Admin
@/_posts@ 폴더 아래에 @yyyy-mm-dd-title.md@ 형식의 포스트를 작성합니다. 하위 폴더를 만들어서 계층적으로 작성도 가능합니다. 파일 최상단에 포스트 Meta 정보("YAML Front Matter":https://jekyllrb.com/docs/frontmatter/)를 입력합니다.
108 1 Jinwuk Admin
109 1 Jinwuk Admin
<div class="language-md highlighter-rouge">
110 1 Jinwuk Admin
111 1 Jinwuk Admin
<div class="highlight">
112 1 Jinwuk Admin
113 1 Jinwuk Admin
bc(highlight).   ---
114 1 Jinwuk Admin
  layout: post
115 1 Jinwuk Admin
  title: { 제목 }
116 1 Jinwuk Admin
  categories:
117 1 Jinwuk Admin
    - { 카테고리 }
118 1 Jinwuk Admin
  tags:
119 1 Jinwuk Admin
    - { 태그 }
120 1 Jinwuk Admin
  last_modified_at: 2017-01-01T10:30+09:00
121 1 Jinwuk Admin
  comments: true
122 1 Jinwuk Admin
  ---
123 1 Jinwuk Admin
124 1 Jinwuk Admin
125 1 Jinwuk Admin
126 1 Jinwuk Admin
</div>
127 1 Jinwuk Admin
128 1 Jinwuk Admin
129 1 Jinwuk Admin
</div>
130 1 Jinwuk Admin
131 1 Jinwuk Admin
h2(#블로그-업데이트). 블로그 업데이트
132 1 Jinwuk Admin
133 1 Jinwuk Admin
변경된 사항을 origin/master로 push하면 자동으로 github page에 업데이트 됩니다. 뿐만 아니라 @_config.yml@에 플러그인을 추가, 변경을 적용하면 자동으로 빌드까지 이루어지는 것으로 보입니다.
134 1 Jinwuk Admin
135 1 Jinwuk Admin
<div class="post-tags">
136 1 Jinwuk Admin
137 1 Jinwuk Admin
 github page
138 1 Jinwuk Admin
 jekyll
139 1 Jinwuk Admin
 블로그
140 1 Jinwuk Admin
141 1 Jinwuk Admin
</div>
142 1 Jinwuk Admin
143 1 Jinwuk Admin
144 1 Jinwuk Admin
</div>
145 1 Jinwuk Admin
146 1 Jinwuk Admin
<div class="section comments">
147 1 Jinwuk Admin
148 1 Jinwuk Admin
h2(#comments). Comments
149 1 Jinwuk Admin
150 1 Jinwuk Admin
<div id="disqus_thread">
151 1 Jinwuk Admin
152 1 Jinwuk Admin
153 1 Jinwuk Admin
154 1 Jinwuk Admin
</div>
155 1 Jinwuk Admin
156 1 Jinwuk Admin
Please enable JavaScript to view the "https://disqus.com/?ref&#95;noscript":%3Ca%20class=&quot;&gt;comments powered by Disqus.
157 1 Jinwuk Admin
158 1 Jinwuk Admin
</div>
159 1 Jinwuk Admin
160 1 Jinwuk Admin
<div class="section related">
161 1 Jinwuk Admin
162 1 Jinwuk Admin
h2(#related-posts). Related Posts
163 1 Jinwuk Admin
164 1 Jinwuk Admin
<ul>
165 1 Jinwuk Admin
<li>h3(#구글-한글-웹폰트-2018-04-24). "구글 한글 웹폰트 2018&#45;04&#45;24":https://pravusid.github.io/lifelog/2018/04/24/Google_hangul_fonts.html
166 1 Jinwuk Admin
</li>
167 1 Jinwuk Admin
<li>h3(#github-two-factor-authentication-사용으로-인한-authentication-failed-2018-03-27). "Github Two&#45;factor authentication 사용으로 인한 Authentication failed 2018&#45;03&#45;27":https://pravusid.github.io/git/2018/03/27/Github-Two-factor-authentication.html
168 1 Jinwuk Admin
</li>
169 1 Jinwuk Admin
<li>h3(#우분투-17.10-설치-후기-2017-10-29). "우분투 17.10 설치 후기 2017&#45;10&#45;29":https://pravusid.github.io/linux/2017/10/29/Ubuntu1710.html
170 1 Jinwuk Admin
</li>
171 1 Jinwuk Admin
</ul>
172 1 Jinwuk Admin
173 1 Jinwuk Admin
174 1 Jinwuk Admin
</div>
175 1 Jinwuk Admin
176 1 Jinwuk Admin
177 1 Jinwuk Admin
</div>
클립보드 이미지 추가 (최대 크기: 977.563 MB)