티스토리 뷰

웹페이지에 페이스북 공유 위젯을 설치해 두던, 설치해 두지 않던간에 요즘엔 유용하거나 재미있는 웹페이지를 알아서 페이스북 친구들과 공유하는 유저들이 많다. 

이렇게 웹페이지가 페이스북에 공유될 때, 페이스북은 해당 웹페이지 안에서 사용된 이미지들을 대상으로 썸네일 후보를 만들어 유저가 그 중 하나를 고를 수 있게 해 준다. 하지만, 이것은 어디까지나 자동화 된 썸네일 후보 리스트이기 때문에, 엉뚱한 이미지... 심지어 광고에 들어간 이미지 마저 썸네일 후보가 되는 경우가 허다해 질 수 있다. 공유를 시도하는 유저가 고심하여 썸네일을 골라보다가 적절한 썸네일이 없다고 판단되면 썸네일이 아예 뜨지 않게 하는 등의 성의를 보여준다면 매우 다행이겠으나 모든 유저에게 그것을 바랄 수는 없다. 

그렇다면, 현재의 페이지를 누군가가 페이스북에 공유하려 할 때, 페이지안에 어떤 이미지들이 포함되어 있건 간에 모두 무시하고 지정된 이미지만을 썸네일로 쓸 수 있게 하는 방법을 써 볼 수 있다.

방법은 매우 간단하다. 아래와 같은 엘리먼트를 <head> 안에 마크업 해 두면 된다.

<link rel="image_src" href="(PATH or URL)" />

페이지를 페이스북으로 공유할 때, 페이지 헤드에 이런 엘리먼트가 포함되어 있을 경우 페이스북은 자동으로 썸네일 이미지 후보를 생성하는 과정을 거치지 않고, 무조건 해당 이미지를 썸네일 이미지로 사용하게 된다. <link> 의 rel 속성으로 넣어준 값 image_src 가 하는 역할 중 하나가 바로 그것이다.


여기서 '역할 중 하나' 라는 표현에서 하나 유추할 수 있는 사실이 있을 것이다. image_src 라는 속성값이 오직 페이스북에만 쓰이기 위해 존재하는 값이 아니라는 사실.... 하지만, 일단은 페이스북으로 공유될 것에 대비할 때는 이렇게 사용되기도 한다는 것을 알아두자~

댓글