페이스북 공유 페이지 만들기

    <!-- Facebook meta tags -->

<meta property="og:type" content="article" />

<meta property="og:title" content="장철희 resume" />

<meta property="og:url" content="http://intro.jcon.tk/responsive/index.html" />

<meta property="og:image" content="http://intro.jcon.tk/responsive/img/img03_s.jpg" />

<meta property="og:site_name" content="프론트엔드 개발자" />

<meta property="og:description" content="잘하는 것도 중요하지만 자라는 것을 더 중요하게 생각합니다" />

//http://www.facebook.com/sharer.php?u={페이지 제목}&t={페이지링크}

$(".facebook").click(function(e){

e.preventDefault();

window.open('https://www.facebook.com/sharer/sharer.php?u='                 +encodeURIComponent(document.URL)                 +'&t='+encodeURIComponent(document.title),                 'facebooksharedialog',                 'menubar=no, toolbar=no, resizable=yes, scrollbars=yes, height=300, width=600');

});

메타테그를 입력 후 자바스크립트를 통해 이벤트를 붙여 페이스북 공유가 가능하게 한다.

og:title : 공유화면에서 나타내고 싶은 타이틀을 입력

og:site_name : 공유화면에서는 나타나지 않음

og:description : 타이틀 밑에 페이지를 설명하는 글로 나타남

페이스북 공유 디버깅

https://developers.facebook.com/tools/debug/sharing

위 사이트로 들어가 공유하고 싶은 페이지의 url을 입력하면 정상적으로 작동하는지 확인할 수 있다.