Jekyll테마를 사용해서 github 블로그 만들때 Comment기능을 추가 하는 방법 입니다.
참고로 다음 설명에서는 TeXt Theme 사용 기준으로 설명 합니다.
준비
-
disqus 회원 가입
disqus 홈페이지에서 회원가입을 합니다. -
유형을 선택합니다.
-
사이트 정보를 입력합니다.
- Website Name은 github Jekyll테마에서 수정할때 사용되므로 기억해 둡니다.
- Plan은 무료 버전인 Basic으로 선택해도 됩니다.
- Platform은 Jekyll로 선택 합니다.
- Website Name은 github Jekyll테마에서 수정할때 사용되므로 기억해 둡니다.
github Jekyll테마에 적용
Universal Embed Code링크를 눌러 해당 페이지로 가서 하단에 보면
Comment삽입관련 HTML태그 가이드를 볼 수 있습니다.
github 해당 테마의 레파지토리에서 _config.yml 설정 파일을 수정 합니다.
해당 부분은 어떤 테마를 쓰는지에 따라 다를 수 있습니다.
위에 shortname은 disqus에서 Website Name에서 설정했던 이름을 입력하면 됩니다.
_include 폴더내에 disqus.html파일을 생성하고 Comment HTML가이드에서 나온 태그를 그대로 복사해서 붙여넣기 해줍니다.
위 설정 까지 했다면 다음과 같이 포스트 하단에 disqus에서 제공하는 Comment기능이 추가 된것을 볼 수 있습니다.
추가로 포스트 작성시 key: 고유key 속성을 부여 해주어야 각 포스트마다
개별 Comment 작성이 가능 합니다.
key는 고유해야 하며, 형식은 다음 규칙 조건을 따릅니다.
([A-Za-z]) and may be followed by any number of letters,
digits ([0-9]),
hyphens (-),
underscores (_),
colons (:),
and periods (.).
TeXt Theme가 아닌 경우 추가 설정
TeXt Theme가 아닌 경우 추가 설정이 필요 할 수 있습니다.
_layout폴더내에 article.html 수정
_layout폴더내에 post.html 또는 article.html 파일에서
_includes폴더에 생성 했던 disqus.html 내용을 include 해주어야 합니다.
html내에서 include하는 방법은
형식으로 추가 할 수 있으며, if표현식으로 다음과 같이 처리 할 수 있습니다.
shortname이 지정되어 있는 경우 특정 html include처리
그리고 포스트 작성시 comments: true 옵션을 추가해야 표시 될 수 있으니 이 부분도 체크해봐야 합니다.
TeXt Theme에서는 _config.yml 설정 옵션에 따라 기본적으로 포스트 작성시 Comment provider가 사용 되도록 설정 되어 있습니다.