Open Graph
Open Graph
배포한 프로젝트를 카카오톡이나 SNS로 공유 했을 때 상대방에게 보여지는 썸네일
카카오톡 말고도, 페이스북이나 티스토리 등 링크를 공유 했을 때 Open Graph 를 가져오는
플랫폼에 전송을 했을 때도 보여집니다.
index.html
프로젝트 썸네일 ( og:image )
<meta property="og:image" content="%PUBLIC_URL%/thumbnail.png"/> // content 경로는 React 프로젝트 예시
웹 이름 ( og:site_name )
- 링크 공유 시 사이트 이름이 어떻게 보일 지
<meta property="og:site_name" content='사이트 이름 입력'/>
웹 이름 아래에 보여지는 설명 글 ( og:description )
<meta property="og:description" content="설명 글 입력"/>
만약 Open Graph 적용이 보이지 않을 경우
- Open Graph 의 데이터들을 링크가 공유 될 때 마다 가져오는 것이 아니라 한 번 가져오면 캐시 처럼 보관해놓고 사용하기 때문에, Open Graph 설정을 변경 했을 때 바로 적용이 되지 않습니다.
- 하지만 가만히 두면 아예 적용이 안될 수 있기 때문에 아래의 방법을 따라 합니다.
- https://developers.kakao.com/ 접속
- 도구 항목 클릭 -> 초기화 도구 ( 회원가입이 필요하면 하고 )
- URL 입력 후 초기화
- 다시 링크를 보내면 정상적으로 Open Graph 가 보여집니다.
참고
Author And Source
이 문제에 관하여(Open Graph), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@hoho_0815/Open-Graph저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)