在一个网站上添加多个 Google+ 按钮，无法识别标题和描述或图片

Question

我网站上的博客是用PHP写的。我从 sql 数据库中获取所有数据。

foreach($db->query("SELECT * FROM news ORDER BY position") as $row){   
 echo "<h1> {$row['title']} </h1>";
 echo "<span> {$row['date']} </span>"; 
 echo "<div> {$row['text']} </div> "; 
 echo "<a href='http://www.mywebsite.ch/images/news/{$row['name']}'><img src='http://www.mywebsite.ch/images/news/{$row['name']}'/></a>"; }

我尝试在我的网站中实现社交分享按钮。我从 google+ 和 运行 开始解决了几个问题。我需要为每个博客条目设置一个 google+ 分享按钮，因此我将此代码放入我的 foreach 循环中。

<g:plusone size="medium" href="http://www.mywebsite.ch/images/news/<?php echo "{$row['name']}" ?>" ></g:plusone>

部分有效。每张图片下方都有 google+ 按钮，google+ 拍下了正确的图片。

Correct image for each google+ button

但是缺少描述和标题。所以我在互联网上搜索解决方案并找到了几篇文章 -> google 已删除此代码段。

所以没有标题和描述，但我找到了这个... https://developers.google.com/+/web/snippet/ ...并尝试实施 Schema.org 微数据并更改了我的代码，以便 google 能够识别标题和描述

foreach($db->query("SELECT * FROM news ORDER BY position") as $row){   
 echo "<h1 itemprop='title'> {$row['title']} </h1>";
 echo "<span itemprop='author'> myself </span>";
 echo "<span itemprop='datePublished'> {$row['date']} </span>"; 
 echo "<div itemprop='description'> {$row['text']} </div> "; 
 echo "<a href='http://www.mywebsite.ch/images/news/{$row['name']}'><img src='http://www.mywebsite.ch/images/news/{$row['name']}' itemprop='image' /></a>"; }

所以现在如果我点击 google+ 分享按钮，它会显示正确的标题和文字，但是 google 总是只获取我页面的最后一张图片。

我一直在网上搜索解决方案，但越来越困惑。在好几页上写着用我之前用的方法只能在一页上有几个google+按钮->

<g:plusone size="medium" href="http://www.mywebsite.ch/images/news/<?php echo "{$row['name']}" ?>" ></g:plusone> 

我不相信，因为有几个网站（可能不是用 php 编写的？）可以正常工作。

有人知道我做错了什么吗？

Answer 1

Google+ 显示从正在共享的 URL 的响应中解析的数据。

在第一个实例中，图像有效但没有标题。发生这种情况是因为您正在共享图像的直接 URL。 Google 获取 URL，发现它是一张图片并显示缩略图，因为没有 HTML 从中解析标题。

在第二种情况下，它正确解析了标题，但拍摄了最后一张图片。它是单个 URL，因此 Google 无法知道除了最后一张之外要显示的图像。

解决方案是每个图像都需要它自己的带有 Schema.org 标签的 HTML 页面，然后带有所有 Google+ 按钮的索引页面需要共享 URL 到包含图像的 HTML 页面，而不是直接到图像本身。