Facebook Page iFrame 스크롤 삭제 방법 2가지

공유 버튼

예전에 Post 했던 내용인데요 예전 버전에 문제점이 있어서 정리해서 다시 공유합니다.

Facebook Page에 iFrame 사용을 많이 하고 있습니다. 컨텐츠 넓이, 높이에 따라 나타나는 스크롤이 있으면 완성도가 좀 떨어져 보임니다. 따라서 많은분들이 스크롤을 안나타나게 하고 싶어 하실거라 생각합니다.
아래 두가지 버전으 코드 수정만 간단히 하시면 쉽게 스크롤을 숨기고 page iframe을 사용하실 수 있습니다.

아래 두개 버전 모두 사용가능합니다.
차이점은 크게 없습니다. 사용하기 편하신 방법으로 작성해 주시면 됩니다.
빨간색 글자만 수정하시면 됩니다.
파란색 글자에 원하시는 컨텐츠를 등록하셔서 사용하시면 됩니다.

모든 Tag 복사하셔서 작업하시는게 편리합니다.

첫 번째 방법: 업그레이드 된 버전입니다.

<html> 
<head> 
<script type="text/javascript"> window.fbAsyncInit = function() { 
FB.Canvas.setSize({ width: 520, height: 높이설정 }); 
FB.Canvas.setAutoResize(); } 
</script> 
</head> 
<body>



//컨텐츠 위치 
<div id="fb-root"></div> <-이 부분 Social Plugin 코드에 있으면 삭제하세요. 
//Social pulgin 위치




</body> 
</html>

두 번째 방법: 새로운 Javascript SDK를 사용하는 방법입니다.

Facebook Social Comment 추가 시 높이 설정에 따라 스크롤 노출 될 수 있습니다.

Comment 없는 페이지 사용에 편리합니다.

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<script type="text/javascript">
function framesetsize(w,h){
var obj =   new Object;
obj.width=w;
obj.height=h;
FB.Canvas.setSize(obj);
}
</script>
</head>
<body onload="framesetsize(가로넓이,세로높이)"> <!--원하는 사이즈 변경-->
<div id="fb-root"></div> <!--this div is required by the Javascript SDK-->
<div style="height: 높이설정px">

//컨텐츠 위치
</div>
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>
</body>
</html>

Author: 장 정우

FBML.co.kr은 중/소기업에서 소셜미디어 마케팅 및 온라인 마케팅을 하시는 분들에게 쉽게 사용 가능한 자료를 제공하고 있습니다.