Github page 코멘트 기능 만들기

깃허브 페이지에서 깃허브연동 코멘트섹션 만들기 아주 간단합니다! 잘 따라해 보세요 :-)

 

1. 깃에서 repo라는 이름으로 새로운 레포지토리를 생성합니다. 이때, 꼭 public 으로 설정해주세요!
2. 생성한 repo에서 Settings로 들어가서
3. Issues에 체크해줍니다.
4. Git Hub앱인 Utterances 앱을 설치합니다. App Install
5. Utterances 홈페이지를 방문합니다. https://utteranc.es
6. Configuration 저 빈칸에 본인아이디/repo 이렇게 넣어줍니다.
7. 그리고 밑으로 쭉내려서 Theme에서는 본인 디자인에 맞게 테마를 선택해주고,
8. 소스코드를 복사해서
9. 포스트가 나오는 부분 html의 밑부분에 저 코드를 붙여넣어주시면 됩니다! 저의 경우는 post-share.html파일에 붙여넣었습니다.
10. 완성입니다! 깃에 올리고 성공적으로 나오는지 테스트해보시면 됩니다 😃
    • repo에는 Issues로 들어가면 이렇게 달린 코멘트들을 확인할수있습니다. 코멘트가 저장되는 공간이라고 보시면 됩니다.

Post-share.html

<div class="post-share">
  <div class="post-date">Want to share?</div>
  <div class="sharing-icons">
    <a href="https://twitter.com/intent/tweet?text=Github page 코멘트 기능 만들기&amp;url=https://moniqueko.github.io/Github-page-Comment-Section-Making" target="_blank"><i class="fa fa-twitter" aria-hidden="true"></i></a>
    <a href="https://www.facebook.com/sharer/sharer.php?u=https://moniqueko.github.io/Github-page-Comment-Section-Making&amp;title=Github page 코멘트 기능 만들기" target="_blank"><i class="fa fa-facebook" aria-hidden="true"></i></a>
  </div>
  
  <script src="https://utteranc.es/client.js"
        repo="moniqueko/repo"
        issue-term="pathname"
        theme="github-light"
        crossorigin="anonymous"
        async>
</script>

</div>