Okay
  Public Ticket #250250
Question about DISQUS and AJAX + 4.5.1 update
Closed

Comments

  • Oliver started the conversation

    Hey guys! So I noticed in your 4.5.1 release notes this entry:

    • Disabled AJAX page transitions for blog posts when using DISQUS to allow the plugin to function correctly

    I so happen to use DISQUS on other pages that aren't my blog, mainly my portfolio pages (which is essentially most of my site as an Art Director). I was curious to know what issues were encountered with the AJAX page transitions and DISQUS? I would love to use them, but I'm assuming you guys made that tweak for the blog for a reason. 

    EDIT: So if I turn it on, it just stays on the AJAX circle load animation and doesn't go to the page that I clicked on, even pages that don't have DISQUS. I've disabled for now, but still curious to see if there might be an eventual solution down the road. 

    Thanks in advance! 

  •  1,088
    ThemeNectar replied

    The issue was that disqus comments wouldn't load because they use JS to initiate on page load - there was never a known issue where the page simply wouldn't load all together though, that sounds like another JS error which is breaking the script. If you can share a page URL or allow me to log in and turn the AJAX Loading on so I can see the error I'd be glad to :)

    Cheers

  •   Oliver replied privately
  •  1,088
    ThemeNectar replied

    Hey!

    1. Can you quickly disable all plugins to rule out a conflict - I noticed that when changing pages on your setup the site would load every script again including the ones that already were loaded which is not the default behavior and is probably what's causing the crash.

    2. I opted to simply disabled the transitions instead of trying to keep them and reinit DISQUS since that seemed to just bring about other issues when leaving pages that didn't have DISQUS. However, if you need to add the fix for other pages that may contain disqus I can assist with the JS :)

  • Oliver replied

    Thanks for this! 

    1. So deactivated everything and went one by one with AJAX turned on, and everything seemed to work. I also deactivated a few plugins that I would only use rarely on the admin side after I found out that they all work. I guess it's like the "turn it off, turn it on" solution lol, so for now at least AJAX seems to be working perfectly fine. 
    2. So now what happens with DISQUS is that it won't load initially, but if you reload a page, it will load. But I don't think I've been able to get it to load on an initial page load. [Your AJAX disable fix is in effect though for blog posts.]
      1. So my question is could you please let me know how to implement that fix that DISQUS put on their site? What JS file would I put that in and where? A cursory glance makes it seem like it has to be tailored to each site, and they also give a sample github page for a DISQUS reset recipe here: https://github.com/disqus/DISQUS-API-Recipes/blob/...
      2. I could be a guinea pig and see if their fix works, and maybe it can go into future Salient updates.

    Thanks again in advance for all your help!

  •  1,088
    ThemeNectar replied

    Hey again!

    Here's the fix - open the init.js file located in the js folder and change this line:

    //remove ajaxy from single posts when using disqus
    		if(nectarLove.disqusComments == 'true') $('#post-area article a, .blog_next_prev_buttons a').addClass('no-ajaxy');
    

    to this:

    //remove ajaxy from single posts when using disqus
    		if(nectarLove.disqusComments == 'true') $('#post-area article a, .blog_next_prev_buttons a, #portfolio-nav #prev-link a, #portfolio-nav #next-link a, .portfolio-items .col .work-item .work-info a').addClass('no-ajaxy');
    

    Cheers :)

  • Oliver replied

    Cool, thanks for that. So basically what that's doing is just disabling the AJAX page transitions on any of the aforementioned page types that are running DISQUS. The only thing now is that the functionality of the site now fluctuates between the AJAX page transitions between pages that don't have DISQUS (in my case, Home, About Me, and Contact), while it disables it everywhere else, which just looks odd. 

    So I went back into the DISQUS help article about using it with AJAX pages, and copied the following code snippet in the GITHUB  example and put it in my init.js file:

    /* Fix for reloading DISQUS while using AJAX page transitions */
    
    
    /* * * DON'T EDIT BELOW THIS LINE * * */
        (function() {
            var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
            dsq.src = 'http://' + disqus_shortname + '.disqus.com/embed.js';
            (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
        })();
    
    
        /* * * Disqus Reset Function * * */
        var reset = function (newIdentifier, newUrl, newTitle, newLanguage) {
            DISQUS.reset({
                reload: true,
                config: function () {
                    this.page.identifier = newIdentifier;
                    this.page.url = newUrl;
                    this.page.title = newTitle;
                    this.language = newLanguage;
                }
            });
        };

    The top part of the code example from GITHUB (which isn't pasted here) is irrelevant since the WP DISQUS plugin handles that stuff automatically (shortname, identifier, url, etc.). 

    So for now I've tried it and it's been working with the above code. I also commented out the No Ajaxy code for now as well, so at least in my quick tests, the above code is able to reload DISQUS while using AJAX page transitions. 

    I'll mark this ticket as closed for now! Thanks again for your help!