Suwol Web Tools

개발자 유틸

Open Graph 미리보기

소셜 공유 카드를 미리보고 Open Graph 메타 태그를 생성합니다.

Open Graph 미리보기

Open Graph와 Twitter card 입력

미리보기 카드

입력한 값으로 카드를 미리봅니다.

이미지 미리보기
사이트 이름 또는 URL제목

설명

생성된 메타 태그

이 태그를 페이지 head 안에 넣으세요.

<meta property="og:type" content="website">
<meta name="twitter:card" content="summary_large_image">

Open Graph 미리보기란?

소셜 공유 카드가 어떻게 보일지 확인합니다.

Open Graph 미리보기란?

Open Graph 미리보기는 제목, 설명, URL, 이미지, 사이트 이름, type, Twitter card 설정으로 로컬 미리보기 카드를 만들고 대응하는 메타 태그를 생성합니다.

사용 방법

  1. Open Graph와 Twitter card 값을 입력합니다.
  2. 미리보기 카드를 확인합니다.
  3. 생성된 메타 태그를 복사합니다.

주의사항

이 미리보기는 원격 URL을 가져오거나 검증하지 않습니다. 실제 플랫폼은 이미지를 다르게 자르거나 캐시할 수 있습니다.

FAQ

이미지 URL을 실제로 가져와 검증하나요?

아니요. 브라우저 미리보기 안에 표시만 합니다.

소셜 플랫폼 캐시를 지우나요?

아니요. 캐시 갱신은 각 플랫폼 디버깅 도구를 사용해야 합니다.

데이터가 서버로 전송되나요?

아니요. 미리보기와 태그 생성은 로컬에서 처리됩니다.

4 도구

SEO 메타 태그 생성기

인기

title, description, canonical, robots, author 태그를 생성합니다.

이미지 리사이저 / 변환기

인기

이미지를 원하는 크기로 바꾸고 PNG, JPG, WebP 형식으로 변환합니다.

HTML 이스케이프 / 복원

인기

예약된 HTML 문자를 이스케이프하고 일반 HTML 엔티티를 복원합니다.

URL 인코딩 / 디코딩

인기

URL 컴포넌트를 브라우저에서 안전하게 인코딩하고 디코딩합니다.