Google plus badge only working in IE

**angelize** · 31 July 2013, 07:28 AM

I'm trying to install a google plus badge on a site I'm working on and it works in IE but not in Chrome or FireFox any thoughts or explanations? I'm pulling my hair out here!

The site has been uploaded: www.bestfriendspetmarket.ca

**steve.ledger** · 31 July 2013, 07:56 AM

Seems to work fine in all browsers using the code provide by google (and my G+ data-href of course).

► https://developers.google.com/+/web/badge/

EDIT:
I've attached a WD9P *.web file for your Pet Market, and it works in all browsers here

Here's the code I used.

Code:

<!-- Place this tag where you want the widget to render. -->
<g:page href="https://plus.google.com/117653730420130906410" layout="landscape" rel="publisher"></g:page>

<!-- Place this tag after the last widget tag. -->
<script type="text/javascript">
  (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>

**angelize** · 31 July 2013, 10:20 AM

Thank you Steve. There is something wrong with my .xar file when I put your g+ button on the page it doesn't show in any browser other than IE. yet when I previewed your.web it worked fine. I'm using DP9.

I think I may have a problem with the G+ and Pet Ponderings both of these are calling Java scripts.

I can't upload the whole .xar file it's too large and when I copied the index page to a new page to try just uploading that the g+ button worked but pet ponderings didn't.

I may have to just do a static link to the G+ page for now.

**angelize** · 31 July 2013, 05:51 PM

No one else has any ideas how I might get these two things working together? I have to get this up so I'm going the static G+ link route for now, but if any one has any ideas how I might get the two warring js to both work on the same page would be great. I'll be doing upates to this site again eventually so I'm still interested in any possible solutions.

**steve.ledger** · 31 July 2013, 09:51 PM

F, instead of copying the index to a new page just remove all but the index page from your file and then save as a new file, then attach it here.

I haven't found any widget combination that prevents the G+ code from functioning.

**angelize** · 31 July 2013, 10:11 PM

Hi Steve, here is a link to the 3rd party script I'm using for pet ponderings http://www.javascriptkit.com/script/...2/ponder.shtml

What is happening is when the google code that goes in the head to link the site to G+ is there pet ponderings won't work. If that code is removed the G+ widget won't work in any browser except IE

I'll see what I can do to get a file that I can attach here. I have removed the G+ widget and created a static link to the G+ page

**steve.ledger** · 31 July 2013, 10:43 PM

Originally Posted by angelize

What is happening is when the google code that goes in the head to link the site to G+ is there pet ponderings won't work.

There is no G+ code that goes in the <head> for the badge, F.
It all goes into one single placeholder

EDIT:
Seems there's a problem with the ponder.js
To work around it, use an iframe like the attached.

**angelize** · 01 August 2013, 01:10 AM

Of course an iframe, then the ponder placeholders are on a page of their own and the scripts wouldn't conflict. Now why didn't I think of that! (it's what comes from working too late) Thanks for your help.

Oh and just to further explain the head code I was referring to doesn't come from the widget, it's a bit of code that google gives you when you set up your G+ page that direct links your page to your site and it goes in the head. When I had the code in place it buggered up the pondering and when I removed it the pondering worked but then the G+ widget didn't work properly.

**steve.ledger** · 01 August 2013, 01:19 AM

You are very welcome, I'm always glad to help

**angelize** · 01 August 2013, 01:30 AM

Ok I just had a closer look at what you did and how are you making the ponder script work with just the single place holder? I had to link to the ponder.js file and insert a bit of code into the head (that tells the browser to locate the ponder.js in the index_htm_files.) yet I can't find where in your file you have linked to the script or where you have added the bit to the head.