When developing the new version of the module, and adding support for the HTML5 tag, I noticed that it didn't work as expected. The specification of Google Plus one +1 API http://code.google.com/apis/+1button/#plusonetag says:

An HTML5 equivalent syntax is available as follows:

The class must be set to g-plusone. Any included attributes need to be prefixed with data- such as data-size.

The attributes are not recognized. BUT, if the tag has the attributes without the 'data-' string, it will work. So the example will be:

I will update this issue if there is any update from Google +1 team.

Comments

corbacho’s picture

corbacho commented

Ups.. filter removed the code:

Again. This is the current documentation, with HTML5 valid "data-" attributes

An HTML5 equivalent syntax is available as follows:

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

The class must be set to g-plusone. Any included attributes need to be prefixed with data- such as data-size.

and this how it would work:

<div class="g-plusone" size="standard" count="true"></div>
ernestd’s picture

ernestd commented

Note that Google fixed the bug yesterday where data attributes were not recognized. Therefore the workaround described here will break now but not the one with data attributes.

corbacho’s picture

corbacho commented
Status: Postponed (maintainer needs more info) » Fixed

Yeah that happened. I fixed so the last recommended versions of 6.x and 7.x branch has the valid HTML5 attributes already.
Still I see some weird behaviors with the HTML5 syntax. I will test further tomorrow.. so I recommend the g:plusone syntax in the meanwhile.

Also I notice that google doesn't let you anymore to "fool" the href of the button. For example in the admin settings there is a a demo button pointing the href to "http://drupal.org". It was working before showing a counting > 60 last time I saw. But not today anymore.

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

mac_weber’s picture

mac_weber commented

It is still not validating as HTML5 http://html5.validator.nu

Error: Attribute href not allowed on element div at this point.
From line 221, column 78; to line 221, column 180
at:right"><div class="g-plusone" href="http://example.com" data-size="tall" ></div>

Is that href really necessary there?

corbacho’s picture

corbacho commented
Status: Closed (fixed) » Needs work

The href attribute It's not "needed". If you omit it, then Google will take the URL of the page dynamically via Javascript. BUT, there is edge cases, as always:

So, there is no problem when you are in a node-page, because the node URL corresponds to the URL of that page.

But this is not the case when Drupal displays more than one node in a single page (frontpage, search results, taxonomy term page, etc )

That's why href is needed. To say explicitly "hey, this is the URL of the thing you are +1'ing'"

The good news are that diving in the Forums I found the data-href should work too, making the HTML5 valid. Now seems obvious to me, but I didn't think about prefixing the href attribute with data-

So I will test it and soon will be uploaded.

Thanks for the report Mac

mac_weber’s picture

mac_weber commented

You are welcome, corbacho. Congrats for the module and active development.

agoradesign’s picture

agoradesign commented

You definitely have to change it to data-href, because it's the only way that works -> http://drupal.org/node/1206098#comment-4689002 :-)

corbacho’s picture

corbacho commented

Allright, this is important then. Last night I already pushed that change to 7.x dev branch. Later today I will do same for 6.x and create releases for both.

Thanks

Anonymous’s picture

Anonymous (not verified) commented
Issue summary: View changes

Does this module version 7.x-1.3 now work with Drupal 7 HTML5 sites?

I have a responsive drupal site that I need to add google plus 1 button to.

Let me know :)

corbacho’s picture

corbacho commented

yes @CD, the module supports HTML5 format of the button.
There were some issues in the early days, when Google released the G+ button but it was solved 3 years ago :)

Anonymous’s picture

Anonymous (not verified) commented

Wow, that was quick, thanks Corbacho!

I'll let you know if my installation works okay :)

Anonymous’s picture

Anonymous (not verified) commented

Hi Corbacho,

It works fine with what it is designed to do, e.g., it displays just fine on view teaser full content etc.

The one place I would also like it is with Taxonomy views but it doesn't have an option for this I can find. I tried to select everything, but it had no effect.

Is there an option for this, can I request if not for next issue.

corbacho’s picture

corbacho commented

There is no Views integration still. See https://www.drupal.org/node/1223728