Where and how to add Google +1 code?...

User 122279 Photo


Senior Advisor
14,649 posts
Online Now

Haven't checked this out, but that underlined <br/> you added, SirAGE, seems to be outside of any table cell.

What I think is, that the 1+ button has to go into the same table cell as the lines of text ('Attorneys, Legal Assistants and other'...). When you use a H tag for the text, there is no need for any <br/>, what comes after a line of header text will always place itself on the next line.

Using a H tag may lead to too much space before the next line appears, throwing the site design out of whack. That can be regulated
1. either by setting rules on the h4 tag, like padding-bottom: 3px; (number can be adjusted), but of course it will then affect ALL the h4 tags in the document/site.
2. or by using the <b></b> around the text that is now in h4. If it is done this way, a <br/> after the text will be necessary, though.

Per is on the right track with placing text and 1+ button in the same cell.

I have not checked which of the code suggestions is the best, but since Jim's suggestion validates, I'd try that.

So, my complete suggestion, without any H tags, would be, for the document body:
<td><b>Attorneys, Legal Assistants and other process serving companies from all across the America love our service!</b><br />
<script type="text/javascript">

gapi.plusone.render
(
'plusone-div',
{
"size": "standard",
"count": "true"
}
);

</script></td>


And then Jim's header code in the document head.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 1948478 Photo


Senior Advisor
1,850 posts

Thank you, Inger, for the clarifying summary!

To avoid a possible misunderstanding, though, I would just remove the initial <td> in your code, since the cell actually has a lot of content before that point ;)

When I tested it earlier today with some regular text in lieu of the button, it all seemed to fit in quite nicely, even with the <h4> tags, just so long as I removed all the extra <br /> tags... May be different with actual button, though, so your points are well taken!
User 404575 Photo


Registered User
887 posts

Jim Cantrell wrote:
Here is what I use on my pages, and it does validate in W3C. The reason the normal code does not valiate is because it is HTML5 compliant.

In your </head> tag add this:-

<script type="text/javascript" src="https://apis.google.com/js/plusone.js">

{ parsetags: 'explicit' }

</script>


Where you want your button add this:-


<script type="text/javascript">

gapi.plusone.render
(
'plusone-div',
{
"size": "standard",
"count": "true"
}
);

</script>


You can try the code in your table td tags.

I have mine outside my main page as a static button using css.



Not showing up at all...
Melissa Rhiannon
OS Windows 10
User 404575 Photo


Registered User
887 posts

Inger Eik wrote:
Haven't checked this out, but that underlined <br/> you added, SirAGE, seems to be outside of any table cell.

What I think is, that the 1+ button has to go into the same table cell as the lines of text ('Attorneys, Legal Assistants and other'...). When you use a H tag for the text, there is no need for any <br/>, what comes after a line of header text will always place itself on the next line.

Using a H tag may lead to too much space before the next line appears, throwing the site design out of whack. That can be regulated
1. either by setting rules on the h4 tag, like padding-bottom: 3px; (number can be adjusted), but of course it will then affect ALL the h4 tags in the document/site.
2. or by using the <b></b> around the text that is now in h4. If it is done this way, a <br/> after the text will be necessary, though.

Per is on the right track with placing text and 1+ button in the same cell.

I have not checked which of the code suggestions is the best, but since Jim's suggestion validates, I'd try that.

So, my complete suggestion, without any H tags, would be, for the document body:
<td><b>Attorneys, Legal Assistants and other process serving companies from all across the America love our service!</b><br />
<script type="text/javascript">

gapi.plusone.render
(
'plusone-div',
{
"size": "standard",
"count": "true"
}
);

</script></td>


And then Jim's header code in the document head.


Just tried it, not showing up.

Uh, wait, just checked and it shows up in Internet Explorer but not in Seamonkey.

Melissa Rhiannon
OS Windows 10
User 187934 Photo


Senior Advisor
20,271 posts

Try this.

<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<g:plusone></g:plusone>
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 404575 Photo


Registered User
887 posts

SirAGE wrote:
Melissa,

I can not see the Google + button while I am editing it. So, I can not see where it renders on the page. But I did see it on your site and I forgot to add the <br />

This is the correct code.

Attorneys, Legal Assistants and other process serving companies from all across the America love our service!</h4>
<br/> </td> <br />
<td><g:plusone size="small" annotation="inline"></g:plusone></td>

Add that <br /> and it should move down to the correct spot. :P


Still only renders in Internet Explorer, and outside the table to the right.

Are we getting into that old saying about "too many cooks spoil the soup"? :lol:
Melissa Rhiannon
OS Windows 10
User 404575 Photo


Registered User
887 posts

Eric Rohloff (Rolly) wrote:
Try this.

<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<g:plusone></g:plusone>


That one renders in both, but still outside the table to the right. Arghhh...
Melissa Rhiannon
OS Windows 10
User 1948478 Photo


Senior Advisor
1,850 posts

Melissa Brookstone wrote:
...That one renders in both, but still outside the table to the right. Arghhh...


It will not be "outside the table to the right" if you place the G+1 code in the existing <td></td> cell, as Inger and I suggested in earlier posts!

And, yes there may be the problem with the number of cooks... :D (so I think I'll bow out now...)
User 122279 Photo


Senior Advisor
14,649 posts
Online Now

Per wrote:
Thank you, Inger, for the clarifying summary!

To avoid a possible misunderstanding, though, I would just remove the initial <td> in your code, since the cell actually has a lot of content before that point ;)

When I tested it earlier today with some regular text in lieu of the button, it all seemed to fit in quite nicely, even with the <h4> tags, just so long as I removed all the extra <br /> tags... May be different with actual button, though, so your points are well taken!


You are right, Per, the initial <td> must be removed. I tested it with only that bit of text...

I also placed a small text instead of the button, and it worked fine.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 404575 Photo


Registered User
887 posts

Per wrote:
Melissa Brookstone wrote:
...That one renders in both, but still outside the table to the right. Arghhh...


It will not be "outside the table to the right" if you place the G+1 code in the existing <td></td> cell, as Inger and I suggested in earlier posts!



I went back and got the code that's html compliant, so it renders in both browsers now, but it's still throwing the whole table out of whack if I include it in the text td
Melissa Rhiannon
OS Windows 10

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.