2010년 4월 30일 금요일

페이스북(Facebook) Social Plug In 을 웹페이지(블로그 포함) 욜라 쉬운 설치방법

어제 리바이스에서 페이스북의 라이크 버튼을 이용한 쇼핑몰 프랜즈 스토어에 대해서 간단하게 포스팅했다.

페이스북에서는 코드 몇줄만 가지고 모든 사용자들의 웹페이지에다가 쉽게 설치가 가능하다고 발표했다.

진짜 그런지 한번 알아보았다.

 

결론만 말하면, 진짜 쉽다.

 

단, 블로그, 카페 등등 내가 작성한 페이지마다 코드를 삽입해야 한다는 번거로움이 있다.

워드프레스나 각종 블로그의 플러그인처럼, 메인에다가 적용해놓으면, 알아서 페이지에다가 삽입해주는게 아니라, 내가 작성하는 페이지에다가 일일히 코드를 붙여주어야만 한다.

물론 코딩을 욜라 잘하는 사람들이면, 뭔가 조치를 할 수있을 것이나, 텍스트큐브, 티스토리와 같이 대충 스킨이나 달랑 바꿀 수 있는 블로그 툴에서는 그 작업이 그리 쉽지는 않을 것 같다.

나도 워드프레스 설치형 같이 파일을 몽창 내가 가지고 있는 경우, 약간의 조작으로, 페이지마다 자동으로 라이크 버튼이 붙게 할 수도 있지만, 그거하다가 날밤까느니, 백만년만에 한번 포스팅하는 블로그 페이지에다가 한줄 카피 해넣는데 더욱 수월할 것 같아서 그 짓꺼리는 안하기로 했다.

 

블로그 뿐만 아니라, 다음카페에 내가 쓴 글에도 iframe을 이용하여 삽입이 가능했다.

이건, 내가 운영자라서 카페 계시판에 iframe을 활성화 해놓고 썼기 때문에 가능하고, 만약 다음카페에 적용을 했는데, 표시 되지 않으면, 운영자에게 부탁해야한다.

다음카페에서 디폴트로다가 게시판에서 iframe을 금지 시켰는데, 이는 저작권과 관련이 있기 때문에 그렇다.

 

그럼 간단하게 알아보도록 하자.

 

일단, 페이스북 소셜 플러그인을 사용하려면 두가지 방법이 있다.

 

1) 페이스북 전용 스크립트를 메인 바디안에 삽입하고, 간단하게 코드를 삽입하는 방법

2) ifrmame을 이용하여, 페이지에 삽입하는 방법.

 

딱 두가지이다.

 

1)번부터 설명하자면, 블로그 스킨 메인에다가(<body></body> 사이에)

<div id="fb-root"></div>
<script>
  window.fbAsyncInit = function() {
    FB.init({appId: '118946321457712', status: true, cookie: true,
             xfbml: true});
  };
  (function() {
    var e = document.createElement('script'); e.async = true;
    e.src = document.location.protocol +
    document.getElementById('fb-root').appendChild(e);
  }());
</script>

 

위의 소스를 그대로 붙여넣는다.

(118946321457712 번호는 내 어플리케이션 ID 인데, 그냥 이것좀 써주면 대단히 감사하겠다.)

 

그런다음, 이번에 발표한 8가지의 코드를 마구 붙여넣으면 되는 것이다.
이번에 발표한 8가지의 플러그인은
http://developers.facebook.com/plugins 요기를 방문하면 된다.

 

 

1) 라이크 버튼 삽입 -> 아래의 박스에서 GET CODE를 눌러서 복사한다음 원하는 곳에다가 붙여넣으면 된다. 위의 스크립트를 저장했다면 짧은 주소를 , 그런거안했다면,iframe을 복사해서 붙여넣으면 된다.

 

 

2) Activity Feed(최근에 내 페이지를 Like 한 사람들의 현황을 알려준다.)

- 마찬가지로 박스에서 GET CODE를 눌러서 복사한 후 붙여넣는다. 단, 이건 블로그 같은데 가면 위젯 설정에서 HTML 위젯을 선택하고 그 안에다가 붙여 넣기 하면 된다. 텍스트 큐브에서 그렇다는거다.

 

3) Comments - 댓글다는건데, 여기에다가 댓글달면 페이스북에 올라간다. 그리고, 이것만 설치하면 라이크 버튼도 함께 설치된다.

 

 

4) 라이크박스 - 누가 내 페이지를 라이크 했는지 알려준다.설치방법은 동일하다. ㅎㅎ

 

5) 나머지 Live Stream, Login With Faces, Recommendation도 모두 위와 같이 GET CODE해서 붙여넣기만 하면 된다. 하다가 잘안되면 물어보면 되고, 잘 안되는건 억지로 하려고 하지는 말기를..ㅠ.ㅠ

 

이상으로 페이스북 소셜 플러그인 삽입 방법에 대해 간단히 알아보았다.

 

많이 설치해서 블로그 대박나기를 바란다. ㅎㅎ

그리고, 라이크 버튼 좀 팍팍 눌러주길~~~

 

P.S

다음카페도 내가 해봤는데, 잘되었다. ^^


 

 

댓글 없음:

댓글 쓰기