41

因此，我一直在尝试使用 Google 的 +1 按钮将其放在我的网站上，但它不符合 W3C 标准。

这是代码：

<!-- Place this tag in your head or just before your close body tag -->
<script type="text/javascript" src="http://apis.google.com/js/plusone.js">
  {lang: 'en-GB'}
</script>

<!-- Place this tag where you want the +1 button to render -->
<g:plusone size="medium" href="http://www.example.org"></g:plusone>

有谁知道为什么会发生这种情况以及如何使其符合要求？谢谢

编辑：为了通过验证，我在我的网站上写了一篇文章。

4

12 回答 12

24

有谁知道为什么会这样？

因为谷歌将其设计为使用标签汤而不是 HTML

如何使其符合要求？

该文档具有在 HTML 5 规范草案下有效的替代标记：

<div class="g-plusone" data-size="standard" data-count="true"></div>

如果您希望它与 HTML 4.x 或 XHTML 1.x 一起使用，那么您可能不走运（尽管您可能能够使用 JS 添加不兼容的标记，但这只是一种隐藏它的技巧验证，而不是有效标记的精神）

于 2011-06-02T16:42:51.540 回答
11

在标题中插入此代码：

<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
      {lang:'en', parsetags:'explicit'}
</script>

然后将此代码插入您想要按钮的位置：

<div id="plusone-div" class="plusone"></div>

<script type="text/javascript">
      gapi.plusone.render('plusone-div',{"size": "small", "count": "true"});
</script>

完整的答案可以在这里找到（法语）

于 2011-06-23T14:09:05.503 回答
9

我猜您正在尝试验证 XHTML。最接近成功验证的方法是通过添加以下内容在元素上定义“g”命名空间：

xmlns:g="http://base.google.com/ns/1.0"

IE，

<html xmlns:g="http://base.google.com/ns/1.0"> ... </html>
于 2011-06-02T16:45:03.800 回答
6

使 Google Plus One 代码进行验证的最简单方法：只需输入：

<div class="g-plusone"></div>

代替：

<g:plusone size="medium" href="http://www.example.org"></g:plusone>

缺点：不能添加'count'或'size'等参数，否则代码将不再有效。

这是 Google 为 HTML5 提出的代码，但也适用于其他 (X)HTML 风格。在 HTML5 中，您可以添加诸如“数据计数”、数据大小等参数。

于 2011-06-12T14:13:38.947 回答
2

试试这个：

<div class="g-plusone" data-size="standard" data-count="true"></div>
于 2011-06-19T15:58:52.383 回答
2

在关闭 body 标签之前保留代码，并替换：

 <g:plusone size="medium"></g:plusone>

经过 ：

<div class="g-plusone" id="gplusone"></div>
<script type="text/javascript">
var ValidMe=document.getElementById("gplusone");
ValidMe.setAttribute("data-size","medium");
ValidMe.setAttribute("data-count","true");
</script>

像往常一样，它的伎俩...

于 2011-07-05T18:11:32.283 回答
1

http://james-ingham.co.uk/posts?p=google-plusone-w3c-valid

<!-- Put inside the <head> tag. -->
<script type="text/javascript"
        src="http://apis.google.com/js/plusone.js">
    {lang: 'en-GB'}
</script>

<!-- Put where you wish to display button. -->
<script type="text/javascript">
    document.write('<g:plusone size="medium" href="http://www.example.org/post"></g:plusone>');
</script>
于 2011-07-20T18:42:22.293 回答
1

它很简单

在 div 标签中使用以下内容，您可以将其配置为将其放置在页面中的任何位置并且它是有效的。

<div class="g-plusone"></div>

我在我们的网站www.armaven.com中使用它。看看这个。如果你想。

于 2011-07-30T14:29:35.810 回答
0

另一种方法是像我一样自定义 DTD。我下载了 xhtml1-strict.dtd

在 dtd 文件中找到以下实体定义

<!ENTITY % Flow "(#PCDATA | %block; | form | %inline; | %misc; )*">

并将其编辑如下（这将有助于解决上下文验证，即该标签应出现在哪里）

<!ENTITY % Flow "(#PCDATA | %block; | form | %inline; | %misc; | g:plusone)*">

现在定义新元素

<!ELEMENT g:plusone EMPTY>

然后列出属性

<!ATTLIST g:plusone
  href %URI; #IMPLIED
  size CDATA #IMPLIED
>
于 2012-01-04T23:17:56.253 回答
0

这是我想出的解决方案...

<span id="plusone"></span>
<script type="text/javascript">
    //< ![CDATA[    
       $("#plusone").html('<g:plusone></g:plusone>');
      (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);
      })();
    //]]>    
</script>

确保您<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>的标题中有或其他指向 jquery 脚本的链接！

于 2012-02-16T20:40:55.363 回答
0

我实施的解决方案已经存在于这个线程中，它是由 Gilbou 发布的，但我必须补充一点，这 <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> 不是必须放在标题中的。

<div id="plusone-div" class="plusone"></div> <script type="text/javascript"> gapi.plusone.render('plusone-div',{"size": "medium", "count": "true", "href": "http://www.YOURSITE.com/"}); </script>

将上面的代码放在您希望 +1 按钮所在的位置，但请确保http://www.YOURSITE.com/将页面链接替换为 +1。如果您想向 gabi.plusone.render 函数添加其他参数，请检查https://developers.google.com/+/plugins/+1button/#plusonetag-parameters并查看它是否符合 W3C 转到http://验证器.w3.org/。祝你好运！

于 2012-07-20T11:38:47.430 回答
0

继昆汀的回答之后，您可以使用以下方法添加符合 W3C 的href属性data-href：

<div class="g-plusone" data-size="standard" data-count="true"></div>
于 2015-01-26T15:18:06.527 回答