Like button ajax iframe layout reverting to standard from button count

Question

Looking and searching i almost don't expect a reply ;) as i don't think it seems many people have tried this. The problem is relatively small and i'm more hoping somebody has had the same problem. So we shall see.

//when share is clicked remove all content in share and add in facebook's like button
$('#flb').live('click',function(){

    var ID = $('#question-shell').attr('data-id');

    $( '#flbCont' ).empty().append( $('<iframe />')
        .attr( 'src', 'http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.wouldyourather.eu%2F%3Fid%3D'+ ID +'&amp;layout=button_count&amp;show_faces=false&amp;width=100&amp;action=like&amp;colorscheme=light&amp;height=21' )
        .attr( 'scrolling', 'no' )
        .attr( 'frameborder', 'no' )
        .attr( 'style', 'border:none; overflow:hidden; width:450px; height:80px;' )
        .attr( 'allowTransparency', 'true' )
    );

    return false;
});

this is my code. Simple just remove whatever is in the facebook share place-holder already and add the new dynamic content. But the style when it gets jqueryed in has the standard display even though in the html it says its should have loaded the standard instead of the button_count version.

Any thoughts at all would be brill :)

Cheers guys

Answer 1

In the end i used .load() and put the code in a separate page and loaded that in.

Answer 2

Just move the "href" param in the querystring to be the last param. In your code you would change it to

.attr( 'src', 'http://www.facebook.com/plugins/like.php?layout=button_count&show_faces=false&width=100&action=like&colorscheme=light&height=21&href=http%3A%2F%2Fwww.wouldyourather.eu%2F%3Fid%3D'+ ID)

Hope this helps.

Answer 3

Make sure the '&amp' isn't getting stripped off the end of the url you are Liking. This will cause the layout to not be set correctly and default to 'standard'.

Answer 4

I had the same problem and removed the amp; and left the ampersand character and that seemed to fix it. Hope this helps - I looked for a while too.

Answer 5

I don't know if this late reply still help any more, but hope others who are also struggling with this can see it.

I found that if I change all the & to & then it worked!