Support » Plugin: Jetpack by WordPress.com » Infinite scroll break the loading of some buttons

  • Hello, the problem happens in the multi post pages. For example on tags and categories pages.

    For example this one.

    As you can see after the content of every post there are social buttons in a light blue background.

    However if we load other/older posts via infinite scroll, we can see that these buttons do not show anymore.

    Could you please help?
    Thanks

    http://wordpress.org/extend/plugins/jetpack/

Viewing 15 replies - 1 through 15 (of 36 total)
  • Plugin Author Jeremy Herve

    (@jeherve)

    Jetpack Mechanic

    Did you use a plugin to add these social buttons to your posts? If so, you will want to contact the plugin author to let them know about the problem. They can follow the recommendations here to update their plugin to support Infinite Scroll.

    In the meantime, you could switch to the Jetpack Sharing buttons, as they should be properly loaded in Infinite Scroll.

    No, this is normal html code. I had a plugin that used to put this data, but I put my own code manually.

    Plugin Author Jeremy Herve

    (@jeherve)

    Jetpack Mechanic

    Could you try to add the buttons once the posts are loaded, by catching the post-load event as explained here:
    http://jetpack.me/support/infinite-scroll/#javascript-events

    Thanks for your quick reply. In the link you gave it’s said what needs to be done:

    To make use of this event, simply catch the post-load event when it fires on document.body

    , but it’s not explained. There’s no example at all.

    Plugin Author Jeremy Herve

    (@jeherve)

    Jetpack Mechanic

    You can have a look at how we do it in the jetpack sharing module if you need an example:
    http://plugins.trac.wordpress.org/browser/jetpack/trunk/modules/sharedaddy

    Does it mean that I have to change:

    <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);
      })();

    to something like

    <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);
      })();
    
    890	                                jQuery( document.body ).on( 'post-load', function() {
    891	                                        gapi.plusone.go();
    892	                                });
    </script>

    [Please post code & markup between backticks or use the code button. Your posted code may now have been permanently damaged by the forum’s parser.]

    not sure, I didn’t get it…

    Plugin Author Jeremy Herve

    (@jeherve)

    Jetpack Mechanic

    The library will always be available if you add it to wp_footer. The buttons themselves should be added after IS posts are appended, like in the Jetpack sharing buttons:

    http://plugins.trac.wordpress.org/browser/jetpack/trunk/modules/sharedaddy/sharing.js#L51

    Hello, then it looks like that everything is alright. But it’s not working.

    Please take a look at the tags.php here: http://pastebin.com/d10YeNBc
    especially the <!– start social stuff –><!– end social stuff –>

    Plugin Author Jeremy Herve

    (@jeherve)

    Jetpack Mechanic

    You do not seem to be using the post-load event in that example.

    Since you want to insert a Facebook Like button, a Tweet button, and a Google+ button to the bottom of your post, I would suggest that you enable the Jetpack sharing buttons on your site. You can use all three buttons, and you won’t have to make any changes to your theme.

    If I enable the jetpack buttons, will they appear in the same way? The same view, css, etc? Is it customizable?

    Plugin Author Jeremy Herve

    (@jeherve)

    Jetpack Mechanic

    Yes, you will be able to customize them through CSS. You can also choose to use the official buttons, like on your site today.

    Thank you for your help.
    I am testing the share buttons as you can see from the site.

    I am a little concerned about having those buttons on the homepage – I don’t see any options to disable it only from the homepage.

    I am wondering whether the big files from FB, G, pinterest, etc are (eg. big .js) are downloaded once or they are downloaded for every like button?

    Eg. if in 1 page there are 10 posts and 10 like buttons. Will the facebook js files be downloaded only once to make all the like buttons work, or a different file needs to be downloaded for every button?

    Pleasee understand, I’d like to have the site load as fast as possible so I am wondering if having those buttons on the homepage just slows down the site, or slows down it a lot.

    Thanks

    Plugin Author Jeremy Herve

    (@jeherve)

    Jetpack Mechanic

    I am a little concerned about having those buttons on the homepage – I don’t see any options to disable it only from the homepage.

    You can control where the buttons appear by going to Settings > Sharing in your dashboard.

    I am wondering whether the big files from FB, G, pinterest, etc are (eg. big .js) are downloaded once or they are downloaded for every like button?

    The sharing libraries are only loaded once.

    I noticed that the Pinterest button was not displayed properly though. It seems that your theme or one of your plugins loads an old version of jQuery instead of using the version that comes bundled with WordPress.

    It can create multiple conflicts with WordPress and with other plugins like Jetpack. You can read more about it here:
    http://wordpress.org/support/topic/troubleshooting-wordpress-35-master-list?replies=4#post-3547424

    Try switching to a different theme for a few minutes, and check if that solves the issue; if it does, you’ll want to look for the function loading jQuery in your theme’s header.php file, or in the functions.php file. Once you find that function, you can remove it and enqueue the proper version of jQuery as explained here:
    http://codex.wordpress.org/Function_Reference/wp_enqueue_script

    If the issue is not related to your theme, please try to disable all your plugins, one at a time, until you find the one that causes the conflict. You can then enqueue jQuery using the method I linked to above.

    You can also contact the theme or plugin author and ask them to solve the issue.

    Hello, I can see my theme is loading this:

    <a href="http://glamourina.pl/wp-content/themes/celebritypress5/js/jquery.min.js">jquery.min.js</a>
    <a href="http://glamourina.pl/wp-content/themes/celebritypress5/js/jquery.aw-showcase.js">jquery.aw-showcase.js</a>

    [Please post code & markup between backticks or use the code button. Your posted code may now have been permanently damaged by the forum’s parser.]

    Is one of these the wrong one you talk about?

    Plugin Author Jeremy Herve

    (@jeherve)

    Jetpack Mechanic

    jquery.min.js is indeed the one I am talking about.
    http://glamourina.pl/wp-content/themes/celebritypress5/js/jquery.min.js

    As you can see, this file is jQuery 1.4.2, while WordPress uses 1.8.3 at the moment.

Viewing 15 replies - 1 through 15 (of 36 total)
  • The topic ‘Infinite scroll break the loading of some buttons’ is closed to new replies.