Instagram Widget doesn’t load on ajax-powered WordPress websites

Customers with ajax-powered WordPress websites have sometimes complained of a plugin loading issue. The gist of the issue is that when you visit a page without the plugin, and then go to the page with the plugin, the plugin doesn’t load until you refresh the page.

Ajax functionality can occasionally cause issues with our plugin’s work. Fortunately, we have a pretty universal solution, that should help you fix them regardless of your website’s theme. might.

First, you need to go to Preferences page and enable the option “Add plugin script to every page”. Next, add the following code to Custom JS field:

var elfsightObserver;

var elfsightInitiator = function(slug, callback) {
    var widgets = document.querySelectorAll('[data-elfsight-' + slug + '-options]')
    
    Array.prototype.slice.call(widgets).forEach(function(widget){
        var settings = JSON.parse(decodeURIComponent(widget.getAttribute('data-elfsight-' + slug + '-options')));

        callback(widget, settings);
    })
};

if (window.MutationObserver && !elfsightObserver) {
    var elfsightObserver = new MutationObserver(function(mutations) {
        mutations.forEach(function(m) {
            if (!m.addedNodes || !m.addedNodes.length) {
                return;
            }

            Array.prototype.slice.call(m.addedNodes).forEach(function(el) {
                
                // elfsightInitiator(slug, callback);
                elfsightInitiator('instagram-widget', function(widget, settings) {
                    window.eappsInstagramWidget(widget, settings);
                });

                window.dispatchEvent(new Event('resize'));
            });
        });
    });

    document.addEventListener('DOMContentLoaded', function() {
        elfsightObserver.observe(document.body, {
            childList: true,
            subtree: true
        }); 
    });
}

Press Save, and check your plugin again.