문의 시, 디벨로퍼스 앱ID를 알려주세요.
안녕하세요. 공유하기 시 채팅창 내 썸네일 문의 드립니다.
같은 페이지를 공유하는건데 위와 같이 이미지 비율이 달라집니다.
케이스별로 이미지가 짤리지 않게 보이는 게 목표인데
이런 경우 이미지를 여러개 준비 해야 하나요? 그렇다면 og:image태그를 여러개 작성하면 되는건지?
현재는 og:image태그 하나만 존재합니다.
알려주시면 감사하겠습니다.
안녕하세요.
카카오톡 공유하기 또는 URL 미리보기의 이미지 비율은 2:1 입니다.
800 x 400 사이즈 처럼 비율을 맞추어 이미지를 제공 부탁드립니다.
추가로, 썸네일에 표시되는 이미지는 카카오의 최적화 과정을 거치게 됩니다.
이 때, 의도하신 바와 달리 확대되거나 할 수 있습니다.
예를 들어 전부 흰 화면 가운데 사람이 작게 있다면 비율과 상관없이 가능한 이를 확대하여 표시하는 등의 보정기능이 함께 있으므로
이미지를 준비하실 때, 너무 빈 공간이 많지 않게 구성 부탁드립니다.
그럼 og:image는 2:1 비율 하나만 준비하면 되나요?
위 이미지와 같이 1:1 비율로 카카오톡 전송되는 경우도 짤리면 안되어서요.
그리고 현재 2:1비율로 보이는 경우도 의도하지 않게 짤려보이는데 최적의 이미지 샘플이 있다면 알려주세요…
첫번째 이미지와 같은 URL 미리보기 또는 기본 템플릿 사용하는 스크랩 방식의 카카오톡 공유하기에서 참고하는 og:image 는 2:1 비율로 준비 부탁드립니다.
두번째 이미지의 경우 사용하신 메시지 템플릿 에서 이미지 비율을 600 x 314로 지정 해두신 상태입니다.
2:1 비율의 이미지를 전달 시, 600 x 314 로 재조정하기에 이미지가 잘릴 수 있습니다.
지정해두신 이미지 비율에 맞는 이미지 경로를 파라미터로 전달 부탁드립니다.
자세한 확인을 위해 이미지 경로 부탁드립니다.
앞서 첨부해 주신 Web보기 App 보기 버튼이 있는 메시지 말씀하시는건가요?
아니요 가장 처음 첨부한 첫번째 사진이요~ url로 공유하기로 한건데, 썸네일이 짤려서 보이는데, 카카오톡 메세지 디버깅에서는 안짤려보이네요.
해당 이미지는 600 x 314 사이즈로 되어 있습니다.
2:1 비율로 변경해 보시겠어요?
혹시 카카오톡 애플리케이션 메세지 템플릿에서 조정을 해야할까요? 아님 메타태그에 이미지 width, height를 명시하는 걸까요?
실제 이미지의 비율을 변경하셔야 하는데요
이미지를 다운받아 보면 현재 600 x 314 사이즈로 되어 있습니다.
아 네, url 직접 공유를 통해 2:1 비율로 전송하는 경우 이미지 크기를 2:1 비율로 조절하니 안 짤리고 잘됩니다. 그런데 카카오톡 공유하기 api를 사용(web보기/app보기 버튼이 있는 메세지)의 경우 1:1비율로 전달되어서 여전히 짤려서 보이는데요. 이 메세지의 이미지는 어떻게 조절해주면 되나요?
재현 가능한 URL 부탁드립니다.
https://www.kyobo.com/dgt/web/event/event-detail/307?gubn=ing
이곳에서 공유하기 아이콘 눌러서 카카오톡 전송이요. 모바일로 해야합니다!
https://www.kyobo.com/file/ajax/display-img?fName=%2Fdtc%2F2024%2F10%2F31%2FNWU4NGM5ZDgt_%EC%9D%B4%EB%B2%A4%ED%8A%B8+2_+%EC%A0%80%EC%B6%95%EB%B3%B4%ED%97%98+%EA%B0%80%EC%9E%85+%EC%9D%B4%EB%B2%A4%ED%8A%B8+11%EC%9B%94+%EC%9D%B4%EB%B2%A4%ED%8A%B8%EB%B0%B0%EB%84%88.png
네, 앞서 말씀드린바와 같이
2:1 또는 3:4 또는 1:1 비율로 이미지 제공 부탁드립니다.
아, 아니요. 제가 테스트를 2:1 비율 이미지로 변경했는데 url공유 시 2:1 비율로 잘 전달됩니다.
말씀드린대로 web보기/app보기가 있는 메세지는 여전히 1:1로 전송되어 잘려 보입니다.
https://t.kyobo.com/dgt/web/event/event-detail/703?gubn=ing
위 링크 모바일로 다시 테스트 부탁 드립니다.
사용하신 기본 템플릿의 경우 이미지 영역은 400x400 으로 제공됩니다.
이를 전달하신 이미지와 동일하게 하고자 하시는 경우 아래와 같이 구현 부탁드립니다.
Kakao.Link.sendDefault({
objectType : "feed",
//내용
content:{
title : title
, description : description
, imageUrl : imgUrl
, imageWidth: 600, <- 사이즈 지정
, imageHeight: 300, <- 사이즈 지정
,link: {
mobileWebUrl: linkUrl,
webUrl: linkUrl
}
},
...