Open Graph

OG 필드 선택

App Router의 metadata.openGraph는 기본 웹사이트, 블로그 글, 상품 상세, Twitter Card를 같은 head 출력으로 연결합니다.

페이지 유형별 OG 구성

social preview

루트 웹사이트

app/layout.tsx에서 siteName, locale, 기본 이미지를 설정합니다.

블로그 글

generateMetadata로 title, description, article 타입을 글마다 생성합니다.

상품 상세

상품명, 설명, 대표 이미지 alt와 width, height를 함께 넘겨 공유 카드와 이미지 비율이 예측되게 합니다.

Twitter Card

summary_large_image는 OG 이미지와 같은 소재를 명시적으로 연결합니다.

title 카드 제목
description 클릭 맥락
url 정규 주소
images 1200x630 권장
locale ko_KR 기준
공유 카드 품질

OG 태그가 맞아도 플랫폼 캐시가 남을 수 있으므로, 배포 후 공유 디버거에서 새 미리보기까지 확인합니다.