Blog

페이스북 공유시 썸네일 이미지 바로잡기

August 3, 2015

페이스북 공유시 썸네일 이미지 바로잡기

웹사이트에 좋아요, 공유하기 버튼을 설치하면 알아서 제목과 썸네일 이미지를 잡는다. 그런데 엉뚱한 제목이나 내용, 썸네일 이미지가 들어갈 수 있기 때문에 meta 태그에서 올바르게 설정해줘야 제대로 된 내용이 들어간다.

<meta property="og:title" content=“제목” />
<meta property="og:description" content=“내용” />
<meta property="og:image" content=“이미지 경로” />

그런데 문제는 이미지다. meta 태그로 제대로 설정해도 나오지 않는 경우가 있는데, 이럴 때는 사이즈가 문제가 될 때가 있다. 200 x 200 사이즈를 넘지 않으면 다른 이미지를 가져오는 경우가 있다. 내가 작업하는 페이지는 페이지별 대표 이미지가 180 x 260 사이즈였는데, 억지로 200 x 289 사이즈로 조정하니 그 이후에는 정상적으로 표기됐다.

이렇게 수정해도 바로 반영이 되지 않을 경우에는 페이스북 디버거 페이지에 접속하여, 변경하려는 URL을 입력한 후에 Fetch new scrape information 버튼을 누르면 확인할 수 있다.