WordPress.org

Support

Support » Plugins and Hacks » [Resolved] [Plugin: AJAX Read More] Refresh Facebook Comments after Ajax is Loaded

[Resolved] [Plugin: AJAX Read More] Refresh Facebook Comments after Ajax is Loaded

  • First off, this is a great plugin.

    One issue I’m having is that items like the Facebook Like button and especially Facebook Comments are not loaded when they show up in the content that is called via Ajax.

    There are several blog and forum posts out there with similar issues, and it seems as though you need to recall FB.XFBML.parse(); after the Ajax is completely loaded in order to populate the Facebook Comments DIV with actual comments.

    My question would be where can I place this in the plugin file so that it will be called after the Ajax request is complete?

    http://wordpress.org/extend/plugins/ajax-read-more/

Viewing 5 replies - 1 through 5 (of 5 total)
  • Well, I spent three days trying to figure this out, and thirty minutes after posting this I got it to work. Go figure 🙂

    What I had to do was get FB.XFBML.parse(); to run inside of the plugin, but it was being stripped from the template file that reloads the content.

    What I did was create a separate file called fbreload.php. Then, in this file I added the following code:

    <script type="text/javascript">
    jQuery('#content').ajaxComplete(function(){
       //re-render the facebook icons (in a div with id of 'content')
       FB.XFBML.parse();
     });
    </script>

    Please note that the DIV I am using (#content) may not be the same DIV for you, but it’s a pretty universal part of WP’s theming structure so it should be.

    Go ahead and upload this file into ajax-read-more/inc/ajax-response-templates/. There should be only one other file in their, the single.php which is the template the plugin uses to format the content pulled after the more tag.

    Then you’ll need to open ajax-read-more/ajax-read-more-core.php. Scroll down near the bottom and you’ll see this code:

    function ajax_read_more_template_redirect() {
    	if (have_posts()) {
    		include('inc/ajax-response-templates/single.php');
    	};
    	exit();
    };

    What you going to want to do is include that new file you created, so replace that with this:

    function ajax_read_more_template_redirect() {
    	if (have_posts()) {
    		include('inc/ajax-response-templates/single.php');
    		include('inc/ajax-response-templates/fbreload.php');
    	};
    	exit();
    };

    Now go back and refresh your page and you’ll see that the contents of the FB Comments are now loading!

    Plugin Author Sergey.S.Betke

    @sergeysbetkenovgaroru

    Please, read http://sergey-s-betke.blogs.novgaro.ru/web/wordpress/ajax/yandex-metrika/ajax-wordpress-i-schyotchiki-pishem-svoj-plagin-ajax-yandeks-metrika-otrazhaem-ajax-perexody-v-schyotchike. You can use ‘hit.counter’ event without plugin code modifications. Then i will add special event for your purpose.

    Plugin Author Sergey.S.Betke

    @sergeysbetkenovgaroru

    My plugin fires after AJAX query ‘onupdate’ event. You can do this:

    jQuery('#content').delegate('', 'onupdate.ajaxReadMore', function(e) {
    	FB.XFBML.parse();
    });

    or just ‘onupdate’.

    It is not necessary to change plugin’s files, You can catch ‘onupdate’ event.

    Thanks. So I would just place that in the head of the document and it would automatically run when the Ajax is called?

    Plugin Author Sergey.S.Betke

    @sergeysbetkenovgaroru

    Not so simple 🙂

    <script>
    jQuery(function() {
    	jQuery('#content').delegate('', 'onupdate', function(e) {
    		FB.XFBML.parse();
    	});
    });
    </script>

    – this code – just wrapper for document.ready event.
    Example – ajax-read-more.js file of my plugin.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘[Resolved] [Plugin: AJAX Read More] Refresh Facebook Comments after Ajax is Loaded’ is closed to new replies.