FastComments.com Blog

Hackaday.com과 같은 댓글 시스템 만들기

2020년 1월 24일
작성자: Devon Winrick

우와, 무슨 일이죠?

이 게시물은 FastComments를 사용하여 https://hackaday.com과 유사한 댓글 시스템을 만드는 데 대한 데모입니다.

우리는 당신이 그것들을 복사하는 것을 추천하지 않습니다. 하지만 이것은 FastComments의 유연성을 보여줍니다.

FastComments를 이렇게 보이도록 만드는 것은 간단합니다! 우리는 이를 위한 UI를 구축했습니다! 예를 들어, 다음은 FastComments가 이 페이지에 맞도록 설정한 구성입니다:

FastComments Hackaday Settings

코드에서 직접 수행하고 싶다면 동일하게 쉽습니다.

몇 가지 옵션만 설정하면 됩니다. 사실, 일곱 개입니다. 다음은 코드 스니펫입니다(사용자 정의 CSS는 생략됨). 이 방법으로 삽입할 수 있는 CSS는 한정적입니다. CSS 정의를 위해 위의 UI를 사용하는 것을 권장합니다. 또한, 이를 통해 CSS를 압축할 수 있으며, customCSS 속성을 정의하면 압축 최적화가 적용되지 않습니다.

각각의 의미는 무엇일까요?

  • commentCountFormat = 댓글 스레드 위의 제목 형식입니다. "[count]"는 실제 로컬화된 숫자로 대체됩니다.
  • commentCountUpdated = 댓글 수가 변경될 때 호출되는 함수입니다. 이를 사용하여 페이지 상단의 댓글 수를 설정합니다.
  • headerHTML = "답변 남기기" 상자 위에 표시되는 HTML입니다. 이 경우 제목 요소를 삽입하는 데 사용합니다.
  • hideAvatars = Hackaday에는 아바타가 없습니다. 그래서 우리는 이것을 true로 설정하여 숨깁니다.
  • inputAfterComments = 답글 상자를 댓글 피드의 하단으로 재배치합니다.
  • absoluteDates = 기본 날짜 형식(예: "11분 전")을 절대 날짜로 변경합니다.
  • customCSS = 사용자 정의 스타일링

모든 구성 옵션은 여기에 문서화되어 있습니다.