WhatsApp에서 링크의 썸네일 표시 || og : 이미지 메타 태그가 작동하지 않음 따르려고 시도했습니다. whatsapp

이 질문을 따르려고 시도했습니다. whatsapp 링크 공유를위한 사진 제공

여기에 이미지 설명 입력

기본 Facebook 메타 태그를 사용하여 간단한 HTML 웹 페이지를 만들었습니다.

<!--FACEBOOK-->
<meta property="og:title" content="San Roque 2014 Pollos" />
<meta property="og:description" content="Programa de fiestas />
<meta property="og:image" content="http://pollosweb.wesped.es/programa_pollos/play.png" />

Facebook linter는 올바르게 유효성을 검사하고 Facebook에서는 완벽하게 표시되지만 WhatsApp으로 공유하려고하면 이미지가 표시되지 않습니다.

Android의 WhatsApp에서 시도하고 있습니다.

샘플 웹 페이지 URL입니다.



답변

난 당신이 추가 할 필요가 보라 itemprop받는 og:image메타 태그에 이미지 크기가 설정되어 256x256있으며 그것은을 추가 해가되지 것 site_name, type그리고 updated_time 두 속성 :

<meta property="og:site_name" content="San Roque 2014 Pollos">
<meta property="og:title" content="San Roque 2014 Pollos" />
<meta property="og:description" content="Programa de fiestas" />
<meta property="og:image" itemprop="image" content="http://pollosweb.wesped.es/programa_pollos/play.png">
<meta property="og:type" content="website" />
<meta property="og:updated_time" content="1440432930" />

예를 들어 Google지도 에서 이러한 메타 태그가 작동중인 것을 볼 수 있습니다 .
메타 태그를 변경 한 후 가능한 캐시가 업데이트 될 때까지 잠시 기다려야 할 수 있습니다.

Facebook 디버거 에서 오픈 그래프 메타 태그를 디버그 / 확인할
수 있습니다. 모든 태그가 여기에 표시되면 태그가 제대로 표시되지 않는 사이트 / 앱에 오픈 그래프 태그에 대한 요구 사항이 다를 수 있습니다.

편집 : 링크
로 이미지를 지정 HTTP-Secure하려면 og:image:secure_url대신 을 사용해야 합니다 og:image.

EDIT2 : 네 가지 기본 필수 매개 변수 중 하나이므로
지정해야합니다 og:type.
<meta property="og:type" content="website" />올바른 방향으로 안내해야합니다.


답변

나는 같은 문제가 있었고 문제는 그림의 크기였습니다. Whatsapp은 크기가 300KB보다 큰 사진을 지원하지 않습니다.

따라서 Whatsapp에 이미지를 표시하는 가장 중요한 속성은 다음과 같습니다.

<meta property="og:image" content="url_image">

표시 할 이미지크기는 300KB 미만이어야합니다.


답변

나도 그 문제에 직면 해 드디어 해결했다

<meta property="og:image" itemprop="image" content="http://yourdomain.com/yourfolder/imagename.png" />

내 이미지 속성

  1. 치수 : 300X200
  2. 크기 : <300KB
  3. URL : http://yourdomain.com/yourfolder/imagename.png

이미지 이름에 공백이 없는지 확인하고 두 단어가 있으면 밑줄 기호를 사용하십시오.


답변

이것을 알아 내려고 몇 달을 보낸 후 마침내 문제를 해결했습니다. 내 해결책은 다음과 같습니다.

<!-- MS, fb & Whatsapp -->

<!-- MS Tile - for Microsoft apps-->
<meta name="msapplication-TileImage" content="http://www.example.com/image01.jpg">

<!-- fb & Whatsapp -->

<!-- Site Name, Title, and Description to be displayed -->
<meta property="og:site_name" content="The Rock Photo Studio">
<meta property="og:title" content="The Rock Photo Studio in Florida">
<meta property="og:description" content="The best photo studio for your events">

<!-- Image to display -->
<!-- Replace   «example.com/image01.jpg» with your own -->
<meta property="og:image" content="http://www.example.com/image01.jpg">

<!-- No need to change anything here -->
<meta property="og:type" content="website" />
<meta property="og:image:type" content="image/jpeg">

<!-- Size of image. Any size up to 300. Anything above 300px will not work in WhatsApp -->
<meta property="og:image:width" content="300">
<meta property="og:image:height" content="300">

<!-- Website to visit when clicked in fb or WhatsApp-->
<meta property="og:url" content="http://www.example.com">

위의 내용을 복사하여 웹 사이트의 헤드 영역에 붙여 넣습니다. Whatsapp 앱을 닫고 다시 연 다음 테스트하십시오. 캐시를 지울 필요가 없으며 데이터를 지울 필요도 없습니다.

모두에게 축복!


답변

여기에서 해결책을 찾았습니다. Whatsapp 미리보기 링크가 3 월 16 일에 게시되었습니다.

그리고 당신은 일하는 것을 봐야합니다

스크린 샷 전후

여기에 이미지 설명 입력

두 종류의 코드가 있습니다. 첫 번째 메타 og : <head> 내부 이미지

<meta property="og:image" content="url_image">

<body> 내부 schema.org의 미리보기 이미지 스키마

<link itemprop="thumbnailUrl" href="url_image">
<span itemprop="thumbnail" itemscope itemtype="http://schema.org/ImageObject">
  <link itemprop="url" href="url_image">
</span>

이 도움을 바랍니다. 감사.


답변

whatsapp에서 작업하는 데 필요한 최소 메타 태그 수에 대해 모르겠지만 어딘가에서 이것을 발견했으며 이것은 완벽하게 작동했습니다. 참고 : 이미지 해상도는 256 x 256입니다.

   <head>
    <meta property="og:site_name" content="sitename" />
    <meta property="og:title" content="title">
    <meta property="og:description" content="description">
    <meta property="og:image" itemprop="image" content="http://www.yoursite.com/yourimage.jpg">
    <link itemprop="thumbnailUrl" href="http://www.yoursite.com/yourimage.jpg">
    <meta property="og:image:type" content="image/jpeg">
    <meta property="og:updated_time" content="updatedtime">
    <meta property="og:locale" content="en_GB" />
    </head>

    <body>
    <span itemprop="image" itemscope itemtype="image/jpeg">
      <link itemprop="url" href="http://www.yoursite.com/yourimage.jpg">
    </span>

    </body>


답변

whatsapp 데이터 및 캐시를 지우거나 다른 whatsapp을 사용하십시오!

Android Phone : Go to SETTINGS > APPS > Application List > WhatsApp > Storage and Clear Data.

조심해 ! 이 작업 전에 메시지를 백업하십시오.

whatsapp 데이터 및 캐시 지우기

그런 다음 결과 : 데이터를 지우고 WhatsApp을 캐시하기 전후
공유 전후