🖼️ 워드프레스에 OG(Open Graph) 태그 설정으로 SNS 미리보기 최적화하기

2025. 4. 14.

by. 친절한 고모

🖼️ 워드프레스에 OG(Open Graph) 태그 설정으로 SNS 미리보기 최적화하기

(썸네일·제목·설명 제대로 보이게 하기)

페이스북, 카카오톡, 트위터에 글 링크를 공유했는데…
❌ 썸네일이 없고
❌ 제목이 엉뚱하거나
❌ 설명이 빠져 있다면?

그건 바로 Open Graph 태그가 누락되었기 때문입니다.

이번 글에서는
✔ OG(Open Graph) 태그란?
✔ 워드프레스에서 OG 태그를 설정하는 방법
✔ SNS 미리보기 카드 점검 도구
✔ OG 설정 시 주의사항
을 차근차근 설명드립니다.

✅ 1. OG(Open Graph) 태그란?

OG 태그는 페이스북이 만든
웹페이지의 메타정보(제목, 이미지, 설명 등)를 SNS에 정확히 전달하는 HTML 태그입니다.

항목역할

og:title	SNS 카드 제목
og:description	SNS 카드 설명
og:image	썸네일 이미지
og:url	페이지 고유 주소

이 정보는 공유 시 SNS가 자동으로 가져와 보여주는 미리보기에 사용됩니다.

🧩 2. 워드프레스 OG 태그 설정 방법

방법 ① SEO 플러그인 활용 (추천)

✅ Yoast SEO

플러그인 설치 후 활성화
관리자 > SEO > 소셜 탭
페이스북, 트위터 항목 각각 활성화
각 글 작성 화면 → Yoast 패널에서 OG 이미지·제목·설명 설정 가능

✅ Rank Math SEO

더 직관적인 UI
OG 태그 + 트위터 카드 통합 관리
WooCommerce 제품 페이지도 지원

방법 ② 직접 코드 삽입 (고급자용)

<head> 영역에 아래 코드 추가:

html

복사편집

💡 단, 자동화되지 않으므로 추천되지 않음

📸 3. OG 태그 실전 구성 예시

html

복사편집

🛠️ 4. SNS 미리보기 점검 도구

플랫폼테스트 도구설명

페이스북/인스타	Sharing Debugger	OG 태그 인식 확인, 캐시 초기화 가능
카카오톡	카카오 디벨로퍼스	OG 이미지, 제목 표시 테스트
트위터	Card Validator	트위터 카드 미리보기 확인

공유가 이상할 땐 먼저 “캐시 초기화 버튼” 눌러주세요!

✅ OG 태그 설정 체크리스트

항목완료 여부

SEO 플러그인 설치 (Yoast / Rank Math)	✅ / ❌
OG 활성화 (소셜 탭 설정)	✅ / ❌
각 글마다 OG 이미지 등록	✅ / ❌
썸네일 크기 (최소 1200x630 권장)	✅ / ❌
SNS 미리보기 테스트 완료	✅ / ❌

📘 다음 글 예고

👉 워드프레스에 스키마 마크업 적용하기 (검색결과 강화용 구조화 데이터 설정)
: 리뷰, 별점, FAQ 등 구조화 데이터를 적용하여 구글 검색 노출을 강화하는 방법을 안내합니다.

🖼️ 워드프레스에 OG(Open Graph) 태그 설정으로 SNS 미리보기 최적화하기

저작자표시 비영리 변경금지

'워드프레스' 카테고리의 다른 글

🎛️ 사용자 역할(Role) & 권한(Capabilities) 제어 실전 설정법 (0)	2025.04.15
🔗 워드프레스에 관련 글 자동 추천 기능 넣기 (0)	2025.04.15
💬 워드프레스 댓글 기능을 비회원에게도 안전하게 여는 방법 (0)	2025.04.15
🌟 워드프레스에 스키마 마크업 적용하기 (0)	2025.04.15
🤖 워드프레스 robots.txt 설정으로 검색 노출 제어하기 (2)	2025.04.14
🗺️ 워드프레스에 검색엔진용 사이트맵 제출하기 (0)	2025.04.14
🌍 워드프레스 다국어 사이트 구축하기 (0)	2025.04.14
🔐 워드프레스 사이트 HTTPS(SSL) 적용하기 (0)	2025.04.14

친절한 우리 고모