Android 显示WhatsApp | | og中链接的缩略图：图像元标记不'；行不通_Android_Html_Facebook Opengraph_Meta Tags_Whatsapp

Android 显示WhatsApp | | og中链接的缩略图：图像元标记不'；行不通

android html

Android 显示WhatsApp | | og中链接的缩略图：图像元标记不'；行不通,android,html,facebook-opengraph,meta-tags,whatsapp,Android,Html,Facebook Opengraph,Meta Tags,Whatsapp,试图回答这个问题：我用基本的Facebook元标记创建了一个简单的HTML网页：  <meta property="og:title" content="San Roque 2014 Pollos" /> <meta property="og:description" content="Programa de fiestas" /> <met

试图回答这个问题：

我用基本的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上试用它

→

我相信您需要将

itemprop

添加到

og:image

meta标记中，将图像大小设置为

256x256

，并且添加

站点名称

、

类型

和

更新时间

属性也不会有任何伤害：）

例如，您可以在上看到这些元标记的作用。
更改元标记后，可能需要等待一段时间，以更新可能的缓存

您可以从
如果您可以在那里看到所有标记，则标记未正确显示的站点/应用程序可能对打开的图形标记有不同的要求

编辑：
如果要通过

HTTP-Secure

链接指定图像，则需要使用

og:image:Secure\u url

而不是

og:image

编辑2:
您还需要指定

og:type

，因为它是四个基本必需参数之一。

应该会让您走上正确的方向。

我相信您需要将

itemprop

添加到

og:image

元标记中，将图像大小设置为

256x256

，并且添加

站点名称

、

类型

和

更新时间

属性也不会有任何伤害：）

例如，您可以在上看到这些元标记的作用。
更改元标记后，可能需要等待一段时间，以更新可能的缓存

您可以从
如果您可以在那里看到所有标记，则标记未正确显示的站点/应用程序可能对打开的图形标记有不同的要求

编辑：
如果要通过

HTTP-Secure

链接指定图像，则需要使用

og:image:Secure\u url

而不是

og:image

编辑2:
您还需要指定

og:type

，因为它是四个基本必需参数之一。

应该能帮你找到正确的方向。

我在这里找到了解决方案

你应该看到工作

有两种代码。第一个元og：内部图像

内部schema.org中的缩略图架构

希望这有帮助。谢谢。

我在这里找到了解决方案

你应该看到工作

有两种代码。第一个元og：内部图像

内部schema.org中的缩略图架构

希望这有帮助。谢谢。

您只需在邮件开头键入“http://”。例如：

显示缩略图，但www.google.com no.

您只需在邮件开头键入“http://”。例如：

显示缩略图，但www.google.com no.

我也有同样的问题，问题是图片的大小。Whatsapp不支持大小大于300KB的图片

因此，在Whatsapp上显示图像最重要的特性是：

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

要显示的图像大小必须小于300KB，我也有同样的问题，问题是图片的大小。Whatsapp不支持大小大于300KB的图片

因此，在Whatsapp上显示图像最重要的特性是：

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

并且要显示的图像的大小必须小于300KB，以响应

请尝试schema.org的更新版本

<span itemprop="image" itemscope itemtype="http://schema.org/ImageObject"> 
 <link itemprop="url" href="imgurlHere">
 <meta itemprop="width" content="1200">
 <meta itemprop="height" content="800">
</span>

或者使用谷歌的json ld格式

<script type="application/ld+json">
 {
"@context": "http://schema.org/",
"@type": "ImageObject",
 "url": "ImgURLhere",
    "height": 800,
    "width": 1200

 }
 </script>


{
“@context”：”http://schema.org/",
“@type”：“ImageObject”，
“url”：“ImgURLhere”，
“高度”：800，
“宽度”：1200
}

请尝试schema.org的更新版本

<span itemprop="image" itemscope itemtype="http://schema.org/ImageObject"> 
 <link itemprop="url" href="imgurlHere">
 <meta itemprop="width" content="1200">
 <meta itemprop="height" content="800">
</span>

或者使用谷歌的json ld格式

<script type="application/ld+json">
 {
"@context": "http://schema.org/",
"@type": "ImageObject",
 "url": "ImgURLhere",
    "height": 800,
    "width": 1200

 }
 </script>


{
“@context”：”http://schema.org/",
“@type”：“ImageObject”，
“url”：“ImgURLhere”，
“高度”：800，
“宽度”：1200
}

对于所有仍然有这个问题的人，而对于我来说，所有发布的解决方案都不起作用

我也有过类似的问题。图像在所有其他共享对话框中正确显示。只有WhatsApp无法显示图像，即使facebook调试器的og:image标记正确

对我有效的解决方案是：我用的是firebase。对于其存储中的上载内容，您将获得一个带有媒体令牌的唯一下载URL。比如：

？alt=media&token=yyyyyyyyyyyyyyyy-yyyyyyyyyyyyyyyyyyyy

我在og:image元标记中使用了这个URL。它适用于Facebook等网站，但WhatsApp似乎无法从这个URL下载图像。相反，您需要将图像包含在项目目录中，并将此链接用于og:image标记。现在它在WhatsApp中也能正常工作

之前（不是在WhatsApp工作，而是在facebook等）

之后（现在在所有测试的共享对话框中工作，包括WhatsApp）

希望它能对你们中的一些人有所帮助：）

对于所有仍然有这个问题的人，而对于我来说，所有发布的解决方案都不起作用

我也有过类似的问题。图像在所有其他共享对话框中正确显示。只有WhatsApp无法显示图像，即使facebook调试器的og:image标记正确

对我有效的解决方案是：我用的是firebase。对于其存储中的上载内容，您将获得一个带有媒体令牌的唯一下载URL。比如：

？alt=media&token=yyyyyyyyyyyyyyyy-yyyyyyyyyyyyyyyyyyyy

我在og:image中使用了这个URL

<meta property="og:image" itemprop="image" content="https://firebasestorage.googleapis.com/v0/b/XXXX.XXXXXXX.com/your_image?alt=media&token=YYYYYYYY-YYYYYYYYYY-YYYYYYYYYYYYY">

<meta property="og:image" itemprop="image" content="https://domain_name/path_to_image">

<meta property="og:title" content="Title goes here">
<meta property="og:site_name" content="Site name">
<meta property="og:image" content="imageURLShouldBeFromSameDomainName">
<meta property="og:image:width" content="640">
<meta property="og:image:height" content="300">

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

   <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>

<meta property="og:title" content="Title of your website | website.com"/>
<meta property="og:type" content="Most popular business directory of Bangladesh"/>
<meta property="og:url" content="http://www.website.com/"/>
<meta property="og:image" content="http://www.moumaachi.com/images/dhaka-city.jpg"/>
<meta property="og:site_name" content="@website"/>
<meta property="fb:admins" content="Author"/>
<meta property="og:description" content="website.com is your online business directory of Country"/>

<meta property='og:locale' content='ar_AR' />

<!-- 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">

minify: {
    ...
    removeAttributeQuotes: false,
    ...
}

    <meta property="og:title" content="Testing Title" />
    <meta
      property="og:description"
      content="This is best way to view your Time Table & Join Meetings"
    />
    <meta
      property="og:image"
      itemprop="image"
      content="//upload.wikimedia.org/wikipedia/commons/d/d4/JPEG_example_image_decompressed.jpg"
    />
    <meta property="og:url" content="https://google.com/" />
    <meta property="og:type" content="website" />
    <meta property="og:image:type" content="image/jpeg" />

<meta property="og:image" itemprop="image" content="//test.com/img.jpg"/>

<meta property="og:title" content="ABC Blabla 2020 Friday" />
<meta property="og:url" content="https://bla123.neocities.org/mp/friday.html" />
<meta property="og:description" content="Photo Album">
<meta property="og:image" itemprop="image" content="https://bla123.neocities.org/mp/images/thumbs/IMG_327.JPG"/>
<meta property="og:type" content="article" />
<meta property="og:locale" content="en_GB" />

<link itemprop="thumbnailUrl" href="https://bla123.neocities.org/mp/images/thumbs/IMG_327.JPG">

<span itemprop="thumbnail" itemscope itemtype="http://schema.org/ImageObject">
<link itemprop="url" href="https://bla123.neocities.org/mp/images/thumbs/IMG_327.JPG">
</span>

<head>
 <meta content='myTitle' property='og:title'/>
  <meta content="myDescription" property="og:Description"/>
  <meta property="og:type" content= "website" />
  <meta property="og:image" itemprop="image primaryImageOfPage" content="https://i.ibb.co/1GRpwND/600px-Approve-icon-svg.png" />
</head>

<a href="https://wa.me/?text=https://myaddress.blogspot.com/2020/11/try-16.html" target="_blank" rel="nofollow">Hello whatsApp</a>