블로그에 페이스북 좋아요 박스(Facebook Like box) 삽입하는 방법

2014.04.05 10:36 IT·인터넷/블로그

블로그에 페이스북 좋아요 박스(Facebook Like box) 삽입하는 방법

블로그는 게시판과 달리 하나의 포스트에 집중하는 구조라서 방문하시는 분이 다른 글도 봐 주었으면 하는 욕심을 항상 갖습니다. 그래서 여러 가지 방법을 사용합니다만, 그중의 하나가 페이스북의 좋아요 박스입니다. 바다야크 블로그의 하단에 보이는 커다란 페이스북 소셜 플러그인이죠. 이 좋아요 박스는 포스트 목록과 함께 페이스북의 친구 얼굴이 함께 나와서 더욱 좋습니다. 뿐만 아니라 바다야크에 올려진 글만 소개되는 것이 아니라 다른 분께 소개하고 싶은 글이나 소식도 함께 올릴 수 있어서 좋지요.

가끔 이 플러그인을 어떻게 설치하느냐고 물어 오시는 분이 있어서 설치 방법을 정리해 보겠습니다. 

  1. 페이스북 페이지 생성
    https://www.facebook.com/pages/create.php
  2. 페이스북 소셜 플러그인에서 Like Box 코드 생성
    https://developers.facebook.com/docs/plugins/like-box-for-pages

좋아요 박스를 사용하기 위해서는 페이스북 페이지를 만드셔야 합니다. 페이스북을 하고 있다면 그 주소를 이용하면 좋겠는데 그것은 안 되고 페이스북 페이지만 사용이 가능합니다. 페이스북 페이지를 만드는 방법은 매우 간단합니다. 버섯돌이 블로그에 페이스북 페이지를 만드는 자세한 방법이 설명되어 있네요. 참고하셔서 멋진 페이스북 페이지를 만드세요.

  • http://mushman.co.kr/2691433

페이스북 페이지를 만들었다면 페이스북 소셜 플러그인에서 Like Box를 선택합니다.

  1. 페이스북 페이지 URL을 입력하고
  2. 적닥한 폭을 입력합니다.
  3. 기사를 함께 보여 주고 싶다면 "Show Posts"를 체크하세요.
  4. 이제 Get Code를 클릭하면 블로그 또는 웹 페이지에 삽입할 수 있는 코드를 구할 수 있습니다.

코드가 두 부분으로 나뉘어 있습니다. 첫 번째에 있는 소스 코드는 블로그나 웹 페이지의 <body> 다음에 붙여넣기를 합니다.

티스토리에서 첫 번째 코드를 붙여넣기한 모습입니다. 두 번째 코드는 라이크 박스가 위치할 곳에 붙여넣기를 하면 됩니다.

저 같은 경우 페이지 번호 아래에 추가했어요. 이렇게 소스 코드를 붙여넣기를 하면 페이스북 좋아요 박스 설치가 완료 됩니다.

* 글에 대한 의견은 바다야크 페이스북(www.facebook.com/badayak)에서도 받고 있습니다.

신고
이 댓글을 비밀 댓글로
    • 낙린
    • 2014.04.05 12:37 신고
    이렇게 바로 블로그로 올려 주시다니!
    감사합니다^^
  1. 앗 좋은정보 감사합니다. 저는 그냥 티스토리에서 플러그인으로 좋아요 버튼 사용하고 있었는데 이러한 방법으로 하니 다양한 설정으로 좋아요버튼을 달수 있네요^^. 잘보고 갑니다~~~
    • 질문
    • 2014.04.21 16:46 신고
    똑같이 했는데요.
    저는 설치했을 때 IE에서는 보이고 크롬에서는 안 보여요.
    혹시 왜 그런지 알 수 있을까요?
    • 글쎄요, 혹시 플러그인 때문이 아닐까요?
      다른 컴퓨터의 크롬에서도 같은 증상인가요?
      사이트 주소를 알려 주시면 저도 확인해 보겠습니다.