Forums

WordPress › Support » Plugins and Hacks

[resolved] Infinite scroll vs. FB Like and G+ (23 posts)

  1. gwinnie
    Member
    Posted 10 months ago #

    Greetings everybody! I have a bit of a Javascript newbie question.

    My site is a photo blog using Infinite Scroll version 2.0b2.110709 for seamless post loading. Additionally, I am using WP Facebook Like 1.5.1 and Google +1 1.0.4 for buttons after posts.

    Problem is, when Infinite Scroll loads more posts after user scrolls down, FB Like and G+1 buttons are no longer loaded after the posts. I presume that this could be addressed in an Infinite Scroll post-load Javascript. I've been trying to look at the buttons coding, but I still have no idea what JS functions to call to load the Like and +1 buttons for the additional posts.

    Thanks a bunch for any hints!

  2. beaver6813
    Member
    Posted 10 months ago #

    Right so in the infinite-scroll options -> callback box you'll need to call fblike and g+ again in order to re-run and pickup the new posts. So you'll need to paste in something (exactly) like:

    window.fbAsyncInit = function()
						{
							FB.init({appId: 115079708540175, status: true, cookie: true, xfbml: true});
						};
						(function()
						{
							var e = document.createElement('script'); e.async = true;
							e.src = document.location.protocol + '//connect.facebook.net/en_PI/all.js';
							document.getElementById('fb-root').appendChild(e);
						}());
gapi.load('googleapis.client:plusone', window['__bsld'], null);

    Let me know if you have any questions :)

  3. gwinnie
    Member
    Posted 10 months ago #

    Amazing, sir! This does the trick. Wow, it would take me ages to find out on my own.

    Thank you very much indeed. :-)

  4. ant0nio
    Member
    Posted 6 months ago #

    Resolved, thank you bear!
    Arrr!

    ;)

  5. samroud
    Member
    Posted 5 months ago #

    Thanks for Facebook!

    And for Twitter??

  6. beaver6813
    Member
    Posted 5 months ago #

    samroud, have you got an example of the twitter plugin working? (so then I can find what code to put in the callback)

  7. ant0nio
    Member
    Posted 4 months ago #

    Hi beaver,

    g+ button in mysite is not working anymore and I cant figure why.

    p.s.
    debug mode is activated

    Thank u.

  8. beaver6813
    Member
    Posted 4 months ago #

    @ant0nio, can you try replacing the following:
    gapi.load('googleapis.client:plusone', window['__bsld'], null);
    with:
    gapi.plusone.go();

    Let me know how it goes :)

  9. ant0nio
    Member
    Posted 4 months ago #

    works! Thank you again!

  10. alexdemchak
    Member
    Posted 4 months ago #

    Somewhere built in my theme is a call a Fancybox script, which I need for my posts (4x4 grid of clickable pics)

    My Site

    When you scroll down, the images just load with the zoom thing over it, unclickable :/

    other than that, works great! I just wish my posts worked :(

    I'm not sure what to put in the ;load javascript; box :/

  11. alexdemchak
    Member
    Posted 4 months ago #

    Basically, I need to refresh my scripts etc. that execute in the footer, which calls to the page-templates.php and ultimately the fancybox javascript.

    How do I go about that?

  12. beaver6813
    Member
    Posted 4 months ago #

    First you need to upgrade to the latest RC version for this to work:
    http://downloads.wordpress.org/plugin/infinite-scroll.2.0b.111218RC2.zip

    Just unzip, upload (and overwrite the existing plugin)

    After you'll be wanting to put the following in the "javascript to be called after load" box:

    jQuery(newElements).fancybox({
		'overlayOpacity'	:	0.7,
		'overlayColor'		:	'#000000',
		'transitionIn'		: 'elastic',
		'transitionOut'		: 'elastic',
		'easingIn'      	: 'easeOutBack',
		'easingOut'     	: 'easeInBack',
		'speedIn' 			: '700',
		'centerOnScroll'	: true
	});

  13. alexdemchak
    Member
    Posted 4 months ago #

    I.Love.You. No homo. :)
    It works like a charm! I've got a couple bugs to work out, but they are purely graphical and shouldn't be hard to remedy.

    Thanks!!

  14. qsdnxu
    Member
    Posted 3 months ago #

    Hi beaver6813!

    As i can see you are realy good at what you are doing :) First of all thanks for helping others, secondly it works for me as weel, but i don't understand how i could change the like button text to the default. because this apperars to me:

    " Arr! Be th' first of all ye matey's to find this pleasin' to yer eye. "

    I have alerady changed the appi code but nothing changed.
    Thanks a lot!

  15. qsdnxu
    Member
    Posted 3 months ago #

    LOL It was a pirat languages LOL Ok now i find i just had to change the en_PI to en_US

    here:

    '//connect.facebook.net/en_US/all.js';

    Thanks again! :)

  16. beaver6813
    Member
    Posted 3 months ago #

    Haha crazy, I think everyone should speak in Pirate language ;)

  17. wtfgray
    Member
    Posted 3 months ago #

    Hi, im having similar problem like the 1st one in this topic. But im using a bit diferent infinite scroll script and only facebook share button. Mine infinite scroll script is here: https://github.com/paulirish/infinite-scroll/blob/master/jquery.infinitescroll.js

    Can I get some help?

  18. wtfgray
    Member
    Posted 3 months ago #

    well I just realized that this infinite scroll is the same that WP plugin is build at, but im using it alone, without plugin. So I still need this help, plz :)

  19. ant0nio
    Member
    Posted 2 months ago #

    Hi bear,
    suddenly, after the the first page, my FB share botton doesn't appear again! :(

    what's happen! :)

    antoniocaparrelli.com
    debug is ON

  20. beaver6813
    Member
    Posted 2 months ago #

    @ant0nio

    Add the following to your javascript to be called after page load:

    FB.XFBML.parse();

    You might be able to remove the existing:

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

    See what works :)

  21. ant0nio
    Member
    Posted 2 months ago #

    It works! You are really kind!
    Thank you so much! ;)

  22. empeus4
    Member
    Posted 1 month ago #

    It doesn't work for me ... what did i do wrong?

    I use the the last Infinite Scroll version ...

  23. nlsubtitles
    Member
    Posted 1 week ago #

    Having the same problem here!
    The Like box problem is fixed thanks to the FB.XFBML.parse(); code posted by beaver, thanks!!

    But I also use the facebook comment count function, after pageload it does display a number (0), but that number is not correct..
    <fb:comments-count href=http://example.com/></fb:comments-count>

    Also, I use a Tweet box, with this JS code:
    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
    It does not display Tweet box image anymore after page load.

    Beaver, any thoughts??

Reply

You must log in to post.

About this Topic

Tags