XF 2.1 jQuery is not defined when I include js file

poel

Member
Hi, I'm trying to install this Instagram feed, I would like to show it using ADS sections in settings.
The problem is that when I put this code in html section:
Code:
<script src="ggg-extra/jquery.instagramFeed/jquery.instagramFeed.min.js"></script>
<script>
    (function($){
        $(window).on('load', function(){
            $.instagramFeed({
                'username': 'instagram',
                'container': "#instagram-feed1",
                'display_profile': true,
                'display_biography': true,
                'display_gallery': true,
                'callback': null,
                'styling': true,
                'items': 8,
                'items_per_row': 4,
                'margin': 1
            });
        });
    })(jQuery);
</script>
I receive this errors in console:
Code:
jquery.instagramFeed.min.js:12 Uncaught ReferenceError: jQuery is not defined
    at jquery.instagramFeed.min.js:12
(anonymous) @ jquery.instagramFeed.min.js:12
(index):4555 Uncaught ReferenceError: jQuery is not defined
    at (index):4555
do you know why?
 
You are trying to run a jQuery plug-in (jquery.instagramFeed.min.js) prior to jQuery loading. jQuery loading in Xenforo is defered.

One solution:
Code:
<script defer src="ggg-extra/jquery.instagramFeed/jquery.instagramFeed.min.js"></script>
<script defer src="ggg-extra/jquery.instagramFeed/jquery.instagramFeed-custom.js"></script>

...and save your inline <script> code as jquery.instagramFeed-custom.js

Since your inline code is not executing till window-on-load anyway this solution should work fine for you.
 
Top Bottom