블로그를 돌아다니다 보면 자신의 트위터와 페이스북의 글을 자동으로 가져 오는 위젯이 달려 있는 경우들을 볼 수 있습니다.
개인의 경우도 필요하겠지만 기업의 블로그나 페이스북을 운영하는 담당자하시는 분들은 꼭 필요한 요소죠.
물론 "소셜웹사이트"처럼 메인페이지 가운데에 크게 구현할 수 있다면 좋겠지만 별도의 개발 작업을 하거나 외부 업체를 이용해야 하기 때문에 위젯형태의 노출 방법을 많이 사용하게 되는것입니다.
오늘 다룰 내용은 페이스북의 내용을 가져 오는 위젯의 소스를 가져오는 방법과 네이버와 티스토리 블로그에 게시하는 방법을 알아 보겠습니다.
[소스생성하기]
https://developers.facebook.com/ <== 페이스북 앱 홈페이지에 접속합니다.
[페이스북 개발자 페이지 - 여기서 "웹사이트"를 선택합니다.]
"Facebook Website"를 선택하면 페이스북에서 제공하는 플러그인들에 대한 설명 페이지를 볼 수 있습니다.
이 페이지는 "Social Plugin"을 선택하면 페이스북에서 제공하는 각종 소셜플러그인의 목록들을 볼 수 있습니다.
"좋아요"버튼이나, "댓글달기"등의 기능도 이곳에서 소스를 가져 올 수 있습니다.
우리가 필요한 부분은 "Like Box"입니다.
각각의 항목에 대한 옵션은 아래와 같습니다.
 |
 |
※ 적용될 내용을 입력하고 나서 커서를 이동시키면 모든 옵션들에 대한 적용 결과를 우측에서 미리볼 수 있습니다.
위의 옵션을 모두 선택하고 "Get Code"를 선택하면 아래와 같이 레이어가 떠서 코그를 복사할 수 있게 됩니다.
여기서 "IFRAME"을 선택해야 블로그에서 사용할 수 있는 코드를 복사할 수 있습니다.
[생성된 소스를 블로그에 등록하기]
자 이제 원하는 소스 생성을 하였으니 이 소스를 가지고 티스토리나 네이버 블로그에 등록해 봐야겠죠.
1) 관리 페이지에서 "꾸미기 > 사이드바"를 선택합니다.
2) 모듈부분에서 제공하는 "HTML 배너출력"모듈을 오른쪽으로 이동시킵니다.
3) "편집"을 선택하여 위젯의 이름을 적고 "HTML 소스"부분에 페이스북에서 복사한 코드를 입력해 줍니다.
※ 티스토리의 위젯 가로폭은 200픽셀입니다. 소스코드 생성시 "width"부분을 반드시 200픽셀로 설정한 후에 코드를 다운 받으세요.
4) 확인을 누른 후 드래그를 통해 위젯의 위치를 조정하고 나서 반드시 우측 상단에 "저장"버튼을 눌러 블로그에 적용 시켜 주세요.
1) 블로그 관리자 페이지에서 "꾸미기 설정 > 디자인 설정 > 레이아웃·위젯 설정"을 선택합니다.
2) 레이아웃·위젯 설정페이지 우측 하단에 있는 "위젯직접등록"버튼을 클릭하면 입력창이 뜹니다.
 |
 |
3) "위젯명"에는 위젯에 이름을 적어주고, "위젯코드입력" 부분에 페이스북에서 가져온 소스코드를 입력해 줍니다.
※ 네이버의 위젯 가로폭은 170픽셀 입니다. 소스코드 생성시 "width"부분을 반드시 170픽셀로 설정한 후에 코드를 다운 받으세요.
4) "다음"버튼을 선택하면 미리보기로 전환되고 이상이 없으면 "등록"을 누른 후에 반드시 맨 하단에 있는 "적용"버튼을 눌러서 블로그에 적용시켜 주세요.
하나씩 따라하면 그렇게 어려운 부분은 아닙니다. 다만 처음 하시는 분들은 용어나 절차가 복잡하게 느껴지는 경우가 많기 때문에 페이스북 위젯을 등록하는 방법을 알아 봤습니다.
향후에는 좀더 간단한 트위터의 위젯을 등록하는 방법에 대해서 다뤄보도록 하겠습니다. ^^
'소셜미디어 이모저모 > 소셜미디어 지식창고' 카테고리의 다른 글
| 기업의 브랜드를 온라인으로 홍보할 때 놓치지 말아야 할 것 (0) | 2015.03.13 |
|---|---|
| 워드프레스를 사용하는 두가지 방법 – 워드프레스 설치형과 가입형 비교 (4) | 2012.12.20 |
| 페이스북의 효과를 측정할 수 있는 인사이트 확인방법 (0) | 2012.07.13 |
| 페이스북의 개인 계정을 페이지로 전환하는 방법 (38) | 2012.02.29 |
| [페북 TIP] 페이스북에서 사진 태그 기능 사용하기 (5) | 2012.02.27 |
