본문 바로가기
IT 정보 꿀팁

워드프레스 '좋아요' 버튼 설치하기 (LikeBtn 플러그인)

by 청춘23 2023. 4. 10.

정성 들여 쓴 글에 '좋아요'가 보일 때 그 기분을 어떻게 표현할 수 있을까요? 정말 큰 힘이 되지요? ^^

 

워드프레스에 '좋아요' 같은 공감 버튼을 설치하고 싶을 때는 어떻게 해야 할까요?

이번 포스팅에서는 LikeBtn 플러그인을 설치하여 글에 '좋아요' 버튼이 보이는 방법을 알아보겠습니다.

 

워드프레스 LikeBtn 플러그인 설치

 

 

 

1. LikeBtn 플러그인 설치하기

 

먼저, 워드프레스 관리페이지에서 LikeBtn 플러그인을 추가하겠습니다.

 

● 관리페이지 ▶ 플러그인 ▶ 새로추가 ▶ 플로그인 검색창에 LikeBtn 입력하여 검색 (저는 Like Button으로 검색했어요!)

 

제가 LikeBtn 플로그인을 선택한 이유는 일단 리뷰도 많고, 군더더기 없이 쉽게 좋아요 버튼을 만들 수 있는 점 때문입니다.

일단 쉽게 만들 수 있는 것이 정말 중요했어요.

 

 

워드프레스 LikeBtn 플러그인 설치 1

 

 

LikeBtn을 검색으로 찾았다면 설치한 후, 활성화까지 완료해 주세요.

 

LikeBtn은 무료부터 다양한 가격 정책이 있는데요.

저는 무료로 이용하고 있습니다.

 

이번 제 포스팅을 보시고 이 정도 기능이면 괜찮겠다 하시는 분들은 무료로 진행하셔도 좋을 듯합니다.

 

 

워드프레스 LikeBtn 플러그인 설치 2

 

 

 

LikeBtn 플러그인이 설치되어 활성화까지 완료되면, 왼쪽의 관리페이지 메뉴창에 'Like Buttons' 메뉴가 생성됩니다. 

먼저 세팅을 해주겠습니다. 

 

 

 

 

2. LikeBtn 플러그인 세팅하기

 

 

관리페이지 ▶ Like Buttons ▶ Settings

 

화면의 오른쪽 상단에 Plan & Features가 보입니다.

유료인 $7.99 프로그램의 7일 시행판으로 세팅되어 있던데, 저는 그냥 처음부터 무료(Free)를 클릭하여 적용시켜 놓았습니다.

 

 

워드프레스 LikeBtn 플러그인 설치 3

 

 

플러그인을 적용하기 위해서는 플러그인의 홈페이지에서 API Key 번호Site ID 번호가 필요해요.

 

Account Details에 나와 있는 링크 주소 LikeBtn.com을 클릭하여, 회원가입을 하겠습니다.

 

LikeBtn.com 홈페이지에서 회원가입을 먼저 해주세요!

로그인을 하면, 웹사이트 주소를 입력하라는 입력창이 보입니다.

 

본인의 워드프레스 홈페이지 주소를 입력해 주세요.

웹사이트 추가 버튼을 클릭하여 완료합니다.

 

 

워드프레스 LikeBtn 플러그인 설치 4워드프레스 LikeBtn 플러그인 설치 5마우스 오른쪽 버튼에서 한국어로 번역 클릭

 

 

영어로 되어 있는 사이트인데 저는 크롬 Google에서 지원하는 한국어 번역을 이용했습니다. 

 

크롬 브라우저 사용 마우스 오른쪽버튼 ▶ 한국어(으)로 번역 클릭

 

영어에 약한 저는 워드프레스를 볼 때도 이렇게 한국어로 번역하여 내용을 이해합니다. ^^

혹시 저와 같은 영어 울렁증이 있으신 분들 계시면, 한번 활용해 보세요.

 

 

홈페이지 주소를 입력하여 추가되면, 아래 이미지가 나타납니다. 

나만의 API Key 번호Site ID 번호가 생겼습니다.

 

이제 이 번호를 워드프레스에 해당 페이지에 각각 입력하면 됩니다. 

 

제일 위에 있는 입력창에 E-mail까지 입력한 후, 'Check Account DataSave All Changes' 버튼을 클릭합니다.

 

 

워드프레스 LikeBtn 플러그인 설치 6워드프레스 LikeBtn 플러그인 설치 7

 

 

 

 

3. LikeBtn 플러그인에서 '좋아요' 버튼 만들기

 

이제 버튼 모양을 만들어 보겠습니다.

메뉴에서 Buttons를 클릭해 주세요.

 

관리페이지 ▶ Like Buttons ▶ Buttons

 

저는 글이 있는 페이지에서만 보이게 하고 싶어서 메뉴 중 페이지만 선택하여 Enable Like Button 체크박스에 체크해 주었습니다.

 

화면 아래에서 버튼이나 폰트 사이즈, 색상 등을 직접 선택하여 설정할 수 있습니다. 

 

선택한 후 Save Changes 버튼을 클릭하면 Preview에 나타나는 이미지를 통해 변경된 모양을 미리볼 수 있어요.

하단에 코딩을 직접 넣어 꾸미기도 할 수 있는데, 저는 여기에 있는 사항을 선택하여 조정하는 것으로 충분하더라고요!

 

 

워드프레스 LikeBtn 플러그인 설치 8워드프레스 LikeBtn 플러그인 설치 9

 

 

아, 그리고 좋아요/싫어요 중, 저는 '좋아요'만 보이도록 설정했습니다.

싫어요 있으면 우울하잖아요 ㅜㅜ

 

이렇게 저처럼 '좋아요' 버튼 한가지만 설정하는 것도 가능하니, 참고해 주세요.

나타나는 문구는 한글/영문 자유롭게 입력 가능합니다. '엄지 올리기' 아이콘도 있지만, '하트' 아이콘 선택도 가능합니다.

 

이것저것 입력하고 수정하면서 마음에 쏙 드는 '좋아요' 버튼을 만들어 보세요 ^^

 

 

워드프레스 LikeBtn 플러그인 설치 10

 

 

글의 위나, 하단에 좋아요 버튼을 달 수 있는데, 저는 글의 하단에 이렇게 달았습니다.  ^^

엄지 올린 손이 처음에는 회색인데, 클릭하면 파란색으로 변합니다. 클릭한 사람의 숫자도 표시됩니다.

이런 설정 역시 모두 플로그인 Buttons 메뉴에서 직접 선택하여 설정할 수 있답니다.

 

무료임에도 Reports 메뉴에서 간단한 보고서를 볼 수 있습니다.

 

관리페이지 ▶ Like Buttons ▶ Reports

 

 

워드프레스 LikeBtn 플러그인 설치 11

 

 

Reports에서는 일자별로 버튼을 클릭한 수치를 그래프로 볼수 있고 하단으로 내리면 어떤 포스팅을 클릭했는지도 알수 있습니다.

 

앞으로 워드프레스 홈페이지에서 '좋아요' 버튼 많이 받으며 사랑받기를!!! ^^ 부디!

 

 

 

 

 

2023.03.14 - [IT 정보 꿀팁] - 구글 애드센스 ads.txt 파일 문제 해결(워드프레스, 파일질라)

 

구글 애드센스 ads.txt 파일 문제 해결(워드프레스, 파일질라)

① 파일질라를 이용하여 워드프레스 제작하고, ② 워드프레스로 구글 애드센스 승인 받은 후 애드센스 페이지 상단에 ads.txt 오류가 보인다면 아래 방법으로 해결해 보세요. 오류 메시지 창의 '

young23.linkwe.kr

 

 

2023.04.04 - [IT 정보 꿀팁] - 워드프레스 관리자 이메일 주소 변경(카페24 호스팅)

 

워드프레스 관리자 이메일 주소 변경(카페24 호스팅)

워드프레스 관리자 이메일 주소를 변경하는 방법을 알아보겠습니다. 호스팅은 '카페24'를 이용하고 있으니 참고햇 주세요. 1. 워드프레스 관리페이지에서 변경해보기 2. PHP MyAdmin - wp_options 3. 워

young23.linkwe.kr

 

 

2023.04.21 - [IT 정보 꿀팁] - 워드프레스 백업하기 - Updraftplus 플러그인

 

워드프레스 백업하기 - Updraftplus 플러그인

워드프레스 백업*에 대해 큰 고민이 없었고 별도로 조치하지도 않았었는데요. 어느 날 해킹 위협을 받고 이를 수습하면서 백업의 중요성을 알게 되었습니다. *백업(back-up) : 잘못된 조작 때문에

young23.linkwe.kr

 

 

 

 

 

 

 

 

댓글