Custom Google +1 Text and Image

wafflestomper picture wafflestomper · Jul 8, 2011 · Viewed 12.5k times · Source

Does anyone know how to change the image and text from the Google +1 button that shows up in your Google profile? I have a website and I want to set custom text and image for when people press the +1 button. This info shows up in your Google profile under "+1" if you aren't aware.

In short, is there a way to have the Google +1 button function the same as a Facebook like button in regards to setting the custom text and image that shows up in your profile when you click it.

Answer

rbnzdave picture rbnzdave · Jul 21, 2011

Ok. After much ado about nothing - many many links to my profile later....

here's how you do it. ( the "post" I refer to is the entry in your profile's +1 page on google +, the "target page" is the page that you are referring to with the +1 button tag. )

  1. The title of the post on the target page is what gets read as the title for the post.
  2. The content of the post is pulled from the first block of text on your target page
  3. The image of the post ( as in the thumb ) is the first image found on the page
  4. The site name (in blue) is the domain of your page.

1st, create a in the body of your target page, and set the style attribute of the div to : "position:absolute; top:-1000px; left: -1000px;"

next, have the page itself include a title tag in its header that you want to have in the post. this would naturally be what the page should be called anyway.

then, include in the div you created a copy of the image you want to display as the thumb on the post, dont bother including size attribs on the img tag, google ignores it. also appears to ignore anything that isn't a picture ( ie; a resize script written in php that takes a file as a param ).

lastly, add the content/body text of the post into the div after the picture. I've no idea how much text you can have.

And thats it. Well, its google so it'll evolve, but thats whats working for me.

Dave.