2018 Nam Insik Portfolio site ː Designed by werty.co.kr ː nis@werty.co.kr
 
 
 
 
 
 
 
 
페이스북 공유시 나오는 정보 수정 방법

일단 페이스북에 주소를 입력하거나 공유하게 되면 나오는 정보들이 있다.
이 정보들을 사이트에 설정하려면 아래 링크를 찾아가서 메타 태그를 헤더안에 넣으면 된다.

https://developers.facebook.com/docs/sharing/best-practices?locale=ko_KR

 

그리고 나온 정보가 제대로 반영되지 않을 때는 페이스북 개발툴에서 캐시를 삭제한다. 

https://developers.facebook.com/tools/debug/og/object/

위 주소로 접속하면 캐시를 지울 사이트 주소를 입력하는 칸이 나온다.
주소를 입력하고 ‘Show existing scrape information’를 누르면 설정된 값들이 나열 된다.
 ‘Fetch new scrape information’ 라는 버튼을 누르면 캐시를 삭제하고 새로운 정보를 불러오게 된다.

앞으로 새로 바뀐 정보로 노출되게 된다.


추가) 공유시 정보가 나오게 하는 html 태그 입력 방법

페이스북에서 제공해주는 샘플 이미지를 이용해서 만들어 보도록 하겠다.

url을 입력하거나 공유하게 되면 이렇게 정보가 뜬다.
샘플 이미지에 있는 Forever21 Red ~~ 라고 쓰인 글은 og:title  , $2 Shipping ~ 라고 쓰인 글은 og:description , www.vinted.com 아라고 쓰인 글은 og:url 이다.

그러면 아래와 같이 코드를 <head>와 </head> 사이에 아무 곳에나 넣으면 된다.

 위 코드에서 site_name과 author는 샘플 이미지에 노출되는 값은 없다.

하지만 다른 기능에서 활용되어질 때 사용되어지니 쓰는 편이 좋다.

그리고 썸네일로 쓰여질 이미지의 사이즈는 페이스북에서 1200 x 630 가 고해상도 디바이스에서도 잘 보이는 최적의 사이즈라고 한다.

그래도 너무 크다 싶으면 600 x 315 의 사이즈를 만들라고 한다. 이렇게 만들면 아래와 같이 큰 이미지로 위 아래 분할되어 나온다.

 

또는 이미지를 작게 해서 컨텐츠와 좌 우로 분할되어서 나오게 하려면 600 x 315 작게 만들면 된다.

이렇게 작게 나오면서 좌측에 배치되게 된다.

 

nain

이메일 : nis@naminsik.com

리뉴얼하려고 생각한지가 어느덧 3년이 지났다. ㅠ 망...
.