FaceBook 공유하기 이용

Facebook 에 이미지와 URL을 공유할때 주의해야 할점

- 이미지는 200px*200px 이상(470px*246px 권장)
- Redirect 는 안하는게 좋음
- Debug 를 하자
   https://developers.facebook.com/tools/debug 에 들어가서 Debug를 하자
   facebook 로그인하여 해당 URL에 접속하면 "Input URL" 이란 항목이 있다
   공유하고자 하는 페이지의 URL을 입력하고 Enter 를 치면 해당 URL 페이지에서 사용된 정보를 출력한다.
   이때 잘못된 내용이 있다면 빨간색 ! 느낌표로 잘못된 내용이 표기가 된다.
   해당 내용에 맞게 수정을 하자

   특히 이미지가 처음에 잘못 들어가면 Facebook 에서 캐쉬가 되는데 이 부분을 갱신하기 위해서는
   "Input URL" 밑에 "Fetch new scrape information" 버튼으로 해당 정보를 갱신해 줘야 한다.


PC환경

- 페이지내의 메타태그 추가
<meta property='og:title' content='페이지 제목'/>
<meta property='og:image' content='소개 이미지 URL'/>
<meta property="og:type" content="사이트의 성격 : game, article 등"/>
<meta property='og:site_name' content='사이트명'/>
<meta property='og:url' content='페이지 URL'/>
<meta property='og:description' content='페이지설명'/>  

- 스크립트
function shareFacebook() {
var fullUrl;
var url = '페이지 URL';
var image = '소개 이미지 URL';
var title = '페이지 제목';
var summary = '페이지설명';

var pWidth = 640;
var pHeight = 380;
var pLeft = (screen.width - pWidth) / 2;
var pTop = (screen.height - pHeight) / 2;

fullUrl = 'http://www.facebook.com/share.php?s=100&p[url]='+ url
      +'&p[images][0]='+ image
      +'&p[title]='+ title
      +'&p[summary]='+ summary;
fullUrl = fullUrl.split('#').join('%23');
fullUrl = encodeURI(fullUrl);
window.open(fullUrl,'','width='+ pWidth +',height='+ pHeight +',left='+ pLeft +',top='+ pTop +',location=no,menubar=no,status=no,scrollbars=no,resizable=no,titlebar=no,toolbar=no');
}


모바일 환경

- 페이지내의 메타태그 추가
<meta property='og:title' content='페이지 제목'/>
<meta property='og:image' content='소개 이미지 URL'/>
<meta property="og:type" content="사이트의 성격 : game, article 등"/>
<meta property='og:site_name' content='사이트명'/>
<meta property='og:url' content='페이지 URL'/>
<meta property='og:description' content='페이지설명'/>  

- 스크립트
function shareFacebook() {
    var fMsg = "사이트 제목 및 내용";
    var fUrl = "소개URL";
    var fLinkURL = fMsg + fUrl;
    url ="http://m.facebook.com/sharer.php?u="+ encodeURI(fUrl) + "&t=" + encodeURI(fLinkURL);
    target="_blank";
    window.open(url,target);
}