페이스북에서 글을 공유하면 페이스북이 알아서 미리보기 그림(썸네일)을 넣어 준다. 그런데 엉뚱한 그림이 들어가거나 바라는 그림이 뒤로 밀릴 때가 잦다. 앞서 공개했던 SNS에 글 보내는 단추 달기 확장기능(플러그인)에서 그런 일이 생겨서 와일드님이 물으신 적이 있는데, 이 문제는 확장기능과는 무관하다.
페이스북 공유하기를 살피다가 다음과 같은 규칙을 알아 냈다.
페이스북은 <img> 태그 안의 그림을 미리보기로 넣는다.
미리보기 그림 순서는 파일 이름 순으로 들어간다.
CSS에서 background(background-image) 속성으로 넣은 그림은 들어가지 않는다.
블로그 스킨(테마)에 붙인 그림이 페이스북 공유하기에 들어가지 않게 하려면 아래처럼 그림 경로를 <img>에 넣지 말고 CSS로 넣도록 바꾼다.
HTML : <div class="imagebox"><img src="그림 경로" /></div>
<head> ~ </head> 사이에 들어간 내용은 보통 테마(스킨)에서 header.php 파일에 들어 있습니다. 파일을 고쳐 올리거나 관리 화면의 편집기로 파일을 고칠 수 있습니다.
웹 누비개(브라우저)와 블로그 자체의 시렁(캐시) 기능이 작동하지 않을 때는 테마 파일을 고치자마자 모든 글에 적용됩니다.
덧글을 달아 주세요
limika 2012/02/23 16:25 고유주소 고치기 답하기
유익한 정보 감사합니다 <meta property="og:image" href="그림 경로" />에서 href를 content로 써야할 것 같아요~
팥알 2012/02/23 16:34 고유주소 고치기 답하기
모르고 넘어갈 뻔했는데 짚어 주셔서 고맙습니다.
og:image에서 href로 쓴 걸 content로 고쳐 넣었습니다.
이준혁 2013/08/16 01:31 고유주소 고치기 답하기
워드프레스를 사용하고 있습니다.
글에서 HTML로 변환하면 Head는 없고 <H1> 부터 시작하는데
편집기 가서 소스를 고쳐줘야 하나요?
편집기에서 소스를 고치면 모든 글에 다 적용 되는거 아닌가요???
팥알 2013/08/17 12:26 고유주소 고치기 답하기
<head> ~ </head> 사이에 들어간 내용은 보통 테마(스킨)에서 header.php 파일에 들어 있습니다. 파일을 고쳐 올리거나 관리 화면의 편집기로 파일을 고칠 수 있습니다.
웹 누비개(브라우저)와 블로그 자체의 시렁(캐시) 기능이 작동하지 않을 때는 테마 파일을 고치자마자 모든 글에 적용됩니다.