将头像添加到Google plus徽章的最佳方法是什么？

Question

我想在我的博客中添加Google plus徽章。目前，我在博客中添加了一个google plus徽章，并尝试通过以下代码向其添加图片：

<div class="g-plus" data-width="208" data-height="69" style="float:left; direction:ltr;text-align:left" data-href="//plus.google.com/116527224364668694256" data-rel="author"></div>

<script type="text/javascript">
  (function() {
    var po = document.createElement('script'); 
    po.type = 'text/javascript'; 
    po.async = true;
    po.src = 'https://apis.google.com/js/plusone.js';
    var s = document.getElementsByTagName('script')[0]; 
    s.parentNode.insertBefore(po, s);
    var iab = document.getElementsByClassName("iab")[0];
    iab.style.backgroundimage = "url('https://googledrive.com/host/0B7YvaD77pFw9cDczZnBRanFFVWs/img/avatar.jpg')";
  })();
</script>

输出是这样的：

我想添加自己的头像，但它无法正常工作。这段代码有什么问题，最好的方法是什么？

Answer 1

无法在Google+徽章上显示您的头像。这里的文档：

https://developers.google.com/+/web/badge/

是否有关于徽章上可配置内容的最新信息。高级选项可让您设置徽章的宽度，可显示更多或更少的信息，但目前无法显示您的头像。

徽章呈现代码将覆盖您在其上设置的任何样式，这就是为什么您的附加设置不会更改徽章的显示方式。

如果您只想渲染自己的头像，可以使用Google API执行此操作，如Google API资源管理器中所示：

https://developers.google.com/apis-explorer/#p/plus/v1/plus.people.get?userId=109716647623830091721&_h=1&

然后从返回的人物对象中检索个人资料照片。