워드프레스 댓글에 좋아요 싫어요 버튼 추가하는 방법

0

네이버나 다음의 뉴스 기사의 댓글에 사용자들이 좋아요 또는 싫어요를 눌러 동의 여부를 표현할 수 있습니다. 워드프레스로 커뮤니티 사이트나 뉴스 사이트를 운영하는 경우 댓글에 좋아요/싫어요 버튼을 추가하려면 플러그인을 사용하거나 Disqus 같은 외부 댓글 시스템을 이용할 수 있습니다.

워드프레스 댓글에 좋아요, 싫어요 버튼을 추가하는 Comments Like Dislike 플러그인

Comments Like Dislike 플러그인을 사용하면 쉽게 워드프레스 댓글에 좋아요 또는 싫어요 버튼을 추가할 수 있습니다. 이 플러그인을 설치하려면 워드프레스 관리자 페이지에서 플러그인 > 새로 추가를 클릭한 다음 "Comments Like Dislike"를 검색하도록 합니다.

워드프레스 Comments Like Dislike 버튼 플러그인

플러그인을 설치하고 활성화하면 워드프레스 관리자 페이지 > 댓글 아래에 Comments Like Dislike 메뉴가 추가됩니다.

워드프레스 Comments Like Dislike 플러그인 설정

Comments Like Dislike 설정 페이지에서는 다음과 같은 옵션을 지정할 수 있습니다.

  1. Status : 체크하면 프런트엔드에 좋아요/싫어요 버튼이 댓글에 표시됩니다.
  2. Like Dislike Position : 버튼의 위치를 지정합니다. After Comment (댓글 뒤)와 Before Comment (댓글 앞) 중에서 선택할 수 있습니다.
  3. Like Dislike Display : 표시할 버튼을 지정합니다. Display Both (둘 다 표시), Display Like Only (좋아요 버튼만 표시), Display Dislike Only (싫어요 버튼만 표시) 중에서 선택 가능합니다.
  4. Like Dislike Restriction : 좋아요/싫어요 버튼을 누르는 것을 제한하는 옵션. IP Restriction을 선택하면 동일 IP가 두 번 이상 누르지 못하도록 제한합니다. 다음 네 가지 옵션이 제공됩니다:
    - Cookie Restriction (쿠키로 제한)
    - IP Restriction (IP 기준으로 제한)
    - Login User Restriction (로그인 사용자 제한)
    - No Restriction (제한 없음)
  5. Like Dislike Display Order : 좋아요 싫어요 버튼 표시 순서
  6. Like hover text, Dislike hover text : 버튼 위에 마우스를 올렸을 때 표시되는 문구

Design Settings 탭에서는 좋아요/싫어요 버튼의 디자인(템플릿)을 선택할 수 있고, 아이콘과 카운트 숫자의 색상을 지정할 수 있습니다.

워드프레스 댓글 좋아요 싫어요 디자인 설정

이외에 Help 탭을 클릭하면 이 플러그인에서 제공하는 후크를 확인할 수 있습니다. 이 플러그인을 활성화면 다음 그림과 같이 좋아요(Like)/싫어요(Dislike) 버튼이 표시됩니다.

워드프레스 댓글에 좋아요/싫어요 버튼 표시 예시
Comments Like Dislike 버튼의 작동 예시

마치며

워드프레스 기본 댓글 시스템에서 개별 댓글에 좋아요/싫어요 버튼을 표시하고 싶은 경우 이 글에서 소개한 플러그인을 이용할 수 있습니다. 다른 방법으로 Disqus 같은 서드파티 댓글 시스템을 이용하는 것도 가능합니다.

이 블로그에서는 오랫동안 Disqus 댓글 시스템을 사용했지만, 댓글이 구글 등의 검색엔진에 제대로 노출되지 않는 문제가 발생하여 어쩔 수 없이 워드프레스 기본 댓글 시스템을 사용하고 있습니다. Disqus 댓글이 구글에 보통 잘 노출되는 것 같지만, 제 블로그에서는 사용하는 플러그인 문제인지는 몰라도 구글에 노출이 안 되는 문제가 발생했습니다.

참고로 Disqus 댓글을 사용하면 Disqus를 통해서도 사용자가 유입되므로 SEO(검색엔진최적화)에 유리할 수 있습니다. 이 블로그의 경우 Disuqs를 제거한 후에는 Disqus에서 사용자가 전혀 유입되지 않고 있습니다.ㅠ

참고:

댓글 남기기

댓글을 입력해주세요!
이름을 입력해주세요