오픈그래프(OG) 메타태그 생성기 활용 가이드 및 SNS 카드 최적화
본 사이트의 **'오픈그래프 생성기'**는 카카오톡이나 페이스북, 트위터(X) 등의 SNS로 웹사이트 링크를 공유할 때, 썸네일 이미지와 요약 설명을 얹어 세련된 소셜 카드 형태로 렌더링되게 만드는 메타태그를 자동으로 코딩하고 프리뷰해 줍니다.
기입 항목 가이드
- 제목 (Title): 카드 타이틀 영역에 가장 크게 볼드체로 노출될 대표 텍스트입니다. (최대 30자 권장)
- 설명 (Description): 제목 하단에 상세 요약문으로 노출될 문구입니다. (최대 80자 내외 권장)
- 이미지 경로 (Image URL): 썸네일로 활용될 이미지의 절대 경로 주소입니다. 2:1 와이드 규격을 권장합니다.
- 사이트 URL 및 사이트명: 사용자가 클릭했을 때 연동되는 도메인 원본 주소 및 사이트의 대분류 타이틀입니다.
실시간 프리뷰 사용 요령
오픈그래프 생성기 우측에는 카카오톡 대화방 공유 시 출력되는 **실시간 가상 시뮬레이션 카드**가 배치되어 있습니다. 이미지가 찌그러지지는 않는지, 제목이 몇 글자에서 말줄임표(...) 처리가 되는지 눈으로 직접 검사하면서 텍스트의 길이를 수정해 조율할 수 있습니다.
코드 적용 매뉴얼
디자인 세팅이 완료되었다면 우측 하단의 복사 버튼을 클릭해 생성된 메타태그 소스코드를 클립보드에 담으세요. 이후 복사된 코드 조각을 사용자가 운영하는 개인 웹페이지 소스코드의 **<head>와 </head> 태그 사이**에 붙여넣어 배포하시면 즉각 적용됩니다.