Facebook Like Box

Hello,

I'm using a custom theme for my G2's albums (i.e.: http://www.rocsca.it/gallery2/guest.php?g2_itemId=7755).

I would like to put 'Like Box' on the left bar of my custom theme.

Indeed, I succeded for every of my 'non G2' page (as you can see browsing the site above), but not in G2 pages..

The XFBML code is:

<fb:like-box href="http://www.facebook.com/pages/Graziano-Scappatura/100900293301273?ref=sgm" width="160" stream="false" header="false"></fb:like-box>

Providing to put the Javascript SDK too:

<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'your app id', status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>

I've put all in my 'theme.tpl'. But when I load the page (as just you can see) I can't find the Like box. I also see an 'empty' one that is the border of the div (take a look at the left down corner of an album page). It just seem that the JS code from facebook is not loaded. The source HTML and JS code inside the pages of my albums is just the same of the other 'non G2' pages. But simply the code of G2 is not loaded (At least for what I can see..).

Any idea of what the cause of the problem could be?

Thanks in advance,

rocsca

Hello suprsidr,

ok but why is null? If I look at the source of the page I see:

<div id="fb-root"></div>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: 'your app id', status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/it_IT/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>

so 'fb-root' is defined...

rocsca

It works on FF, but still it does not on IE! I can't figure out why!

rocsca

I have just removed the duplicate tags.. I have also move div 'fb-root' a little bit around the code.. but nothing has changed on IE.. How can I find the mistake? Any idea?

rocsca

It still doesn't works.. I also tried to pull out of div the line:

<fb:like-box href="http://www.facebook.com/pages/Graziano-Scappatura/100900293301273" width="160" stream="false" header="false"></fb:like-box>

but without success..

rocsca

I also have IE8, but I swear that FB Like box doesn't appear..

I also clean IE cache and also G2 template cache..

That's incredible! Anyway.. I'll take a depth look tomorrow...

Thanks of all!

rocsca

Please, could somebody give me some hint on this issue? I have included the 'Like box' of facebook in my custom theme. I can see correctly while I visit gallery with FF while I can't see the box when I surf gallery with IE8. Everyone could see by himself. Anyone imagine why this happens? I have included the box in the theme of the remaining part of my site (gallery is included in my site) and in this case I see the box correctly either with FF and IE8.

http://www.rocsca.it (my web)
http://www.rocsca.it/gallery2/guest.php (gallery)

Thanks,

rocsca

Thanks suprsidr for your feedback.

I don't pretend support from gallery expecially for this kind of issues. But I have reported an oddity with customization. I don't perceive this oddity when I integrate the same facebook code into a simple other HTML page. In the sense that I saw the same think either in FF or IE8 (I don't use other browsers). While I perceive it when I put the facebook code in a theme of Gallery.

It could be a problem of IE or facebook API or of G2, I don't know. Or maybe I wrong something but I'm not aware. Anyway, I think that there is nothing of strange if - in a such situation - I ask an help at G2 forum! Or am I wrong?

Other than this, I don't see that "Fiddler shows the facebook script getting loaded into the site in IE". Could you explain better what you mean?

Thanks,

rocsca

Thanks suprsidr.

I have used Fiddler and, just like you saw, no problem arise from debug. After an attempt matching between the HTML of a working page an another one that doesn't work, I saw that there was a different position o a pice of HTML code:

<div style="clear: both;width:100%;background: #FFFFFF;"></div>

I have adjusted it and now all works.

You are right it not was a matter of G2, but only an error in customizing the G2 template.

I'm very sorry.

Thanks as well,

rocsca