javascript 从 Google +1 按钮分享时指定图片
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13307146/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Specify image when sharing from Google +1 button
提问by hyperrjas
In this link, I have learned to specify a URL for the Google +1 button.
在此链接中，我学会了为 Google +1 按钮指定 URL。
specify custom url to gplus one button.
Can I also specify a specific image?
我还可以指定特定图像吗？
Edited
已编辑
I don't need to change the Google plus button gif or the background of the Google plus button. I need specify the image that a user want to share in social network.
我不需要更改 Google plus 按钮 gif 或 Google plus 按钮的背景。我需要指定用户想要在社交网络中分享的图像。
Is possible?
有可能吗？
回答by BrettJ
Yes this is possible.
是的，这是可能的。
What you mean is that you want to specify an image that will show up in the snippet that is generated by sharing on Google+. The +1 button does two things: 1) It adds a +1 to the count when clicked, and 2) optionally it allows a user to share your URL to Google+ and comment on it.
您的意思是您要指定一个图像，该图像将显示在通过在 Google+ 上共享而生成的代码段中。+1 按钮有两件事：1) 它在被点击时为计数添加 +1，以及 2) 可选地，它允许用户将您的 URL 分享到 Google+ 并对其发表评论。
What you're asking about is the second part of that interaction and is documented at https://developers.google.com/+/plugins/snippet/
您要问的是该交互的第二部分，并记录在https://developers.google.com/+/plugins/snippet/
That page has a tool that can help you generate the HTML you'd need to insert into your page. You can also choose from three different methods of specifying the snippet information.
该页面有一个工具可以帮助您生成需要插入到页面中的 HTML。您还可以从三种不同的指定片段信息的方法中进行选择。
An example using schema.org markup:
使用 schema.org 标记的示例：
<!-- Update your html tag to include the itemscope and itemtype attributes. -->
<html itemscope itemtype="http://schema.org/Article">
<!-- Add the following three tags inside head. -->
<meta itemprop="name" content="My Cool Article">
<meta itemprop="description" content="This is the greatest site ever">
<meta itemprop="image" content="http://example.com/mycoolimage.png">
回答by user2428118
To specify a custom image to be shared by the "share" button:
要指定要通过“共享”按钮共享的自定义图像：
Unfortunately, this is not possible. You can only customize the URL and the language; see the documentation.
不幸的是，这是不可能的。您只能自定义 URL 和语言；请参阅文档。
Edit:this actually is possible, see BrettJ's answer.
编辑：这实际上是可能的，请参阅BrettJ 的回答。
To use a custom image for the "+1" button:
要为“+1”按钮使用自定义图像：
Because Google wants the +1 buttons to look consistent, it's not possible with the official Google +1 JavaScript. However, with a trick such as this oneit's possible to customize the image.
因为谷歌希望 +1 按钮看起来一致，所以官方的谷歌 +1 JavaScript 是不可能的。但是，通过这样的技巧，可以自定义图像。
The trick is in setting the CSS opacity to 0, like this:
诀窍是将 CSS 不透明度设置为0，如下所示：
.myCustomButton *{
/*Hide real +1 button*/
opacity:0;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter:alpha(opacity=0);
}
.myCustomButton{
display:inline-block;
/*The width and height of your image. Not bigger than the Like button!*/
width: 10px;
height: 10px;
/*Your image*/
background:url(gplus.png);
}
