WordPress.org

Forums

NextGEN Scroll Gallery
[resolved] Scripts loaded on all pages (7 posts)

  1. MatthewRuddy
    Member
    Posted 3 years ago #

    Hi. This is just a topic with the intention of notifying users, and hopefully aiding the development of this plugin.

    I am the creator of a plugin, the Riva Slider Pro (http://rivaslider.com/), which allows users to easily create slideshows that utilize jQuery. Quite a few users have notified me of issues they are having when NextGEN Scroll Gallery is enabled.

    The jQuery script for my slideshow uses the jQuery 'load' function as a part of a preloader that loads the images before displaying them. I am aware that NextGEN Scroll Gallery uses MooTools and loads it on every page. This appears to be breaking the functionality and causing problems.

    The problem is that MooTools has its own 'load' function. This function also gets triggered whenever a jQuery script uses 'load', giving the browser a heart attack and making it crash in most cases (Firefox is the worst victim). It also breaks jQuery completely.

    NextGEN Scroll Gallery really creates problem because it loads its scripts on all pages, even when a Scroll Gallery is not being used. I think it would be a great idea to conditionally load the scripts in the pages footer instead. This would allow the scripts to only be loaded on pages that a Scroll Gallery is used, and not elsewhere.

    This would mean that users who have plugins that use jQuery (which a lot do) can be free from MooTools conflictions, such as the one above. It would also greatly reduce the amount of files loaded unnecessarily.

    This would also be great to prevent problems with any other plugins, and probably free up some support time (and the numbers of support requests).

    Conditionally loading scripts can be quite tricky to do, but with a plugin like this that is quite popular I think it would be a great idea. Below is a snippet of code that should the ball rolling.

    // This function registers the scripts to be loaded in the footer
    function plugin_register_scripts() {
    
        global $scripts_loaded;
    
        if ( !is_admin() && $scripts_loaded == false ) {
    
    	 wp_register_script( '.. your script ..', ' .. script URL .. ' ), false, null, true );
    
            // Tell other functions that the script has been registered
    	$scripts_loaded = true;
    
        }
    
    }
    
    // This function prints the scripts in the footer
    function plugin_footer_scripts() {
    
        global $scripts_loaded;
    
        // If scripts have been registered, print them.
        if ( $scripts_loaded == true ) {
    
    	if ( wp_script_is( '.. your script to enqueue ..' , 'queue' ) == false )
    	    wp_print_scripts( '.. your script to enqueue ..' );
    
        }
    }
    add_action( 'wp_footer', 'plugin_footer_scripts' );

    The above code would register the scripts, and then load them in the footer. For this to be put into action, you would have to call the 'plugin_register_scripts' function within the function you use to display a Scroll Gallery. Simply add the code below to the Scroll Gallery function.

    if ( function_exists( 'plugin_register_scripts' ) )
         plugin_register_scripts();

    Anyway, that is it really. I just thought I'd put it out there. This post may also help users who want to conditionally load scripts, as well as troubleshoot issues they may be having between your plugin and other jQuery based plugins.

    http://wordpress.org/extend/plugins/nextgen-scrollgallery/

  2. Benedikt Mo
    Member
    Plugin Author

    Posted 3 years ago #

    Hi MatthewRuddy, thank you for your detailed explanation. But you are the first with such a problem. I think, if both use no conflict programming it works.
    Somebody wrote me that he have problems with your plugin at http://woodworkingcreations.be/onder-constructie/.
    Have you fixed something. Because with my FF there is no problem anymore.
    Best regards BMo

  3. MatthewRuddy
    Member
    Posted 3 years ago #

    Hi. I know there are problems with my plugin the Easing Slider, but I am currently in the process of redesigning it. I'm not referring to the problems it is having but the problems between NextGEN Scroll Gallery and the Riva Slider Pro.

    I posted a topic on StackOverflow, which you can see below. Nearly all of the replies advised against using MooTools and jQuery together. As mentioned above, MooTools overwrites the jQuery 'load' function and as such any jQuery plugin that uses 'load' is going to run into problems because of MooTools. Using jQuery noConflict doesn't make a difference as it doesn't stop the 'load' function from being fired in both libraries (this is what is causing the problem).

    StackOverflow topic:
    http://stackoverflow.com/questions/9419240/mootools-breaking-jquery-functionality

    You can see the error here (mostly in FF):
    http://newsite.matthewruddy.com/

    If I disable the 'load' function, then the slideshow works perfectly. But this also disabling the image preloading functionality, which a lot of slideshow plugins would also incorporate.

    Why I suggested you conditionally load the scripts is for this reason. Currently, your plugin forces MooTools to be loaded on all pages. jQuery is very popular and also tends to be loaded on most pages (mostly because the theme requires it). Any theme with a slideshow built into it using jQuery and the 'load' function, or similar, your plugin is going to break. It could also possibly break other functionality that has similar problems (but I have yet to come across any).

    Obviously, the chances of this are probably rare, but I think it would be worth including. The conditional loading would also be an asset to your plugin, which many users may thank you for. Lots of users have requested me for it, because they are concerned about page loading times on iPhones, iPads and slow internet connections. Currently 100kb (the three scripts your plugin loads) extra is being loaded on every page that no Scroll Gallery is being displayed, which does make a difference to the loading time concerned user.

    There is no problem with the woodworkingcreations site because he changed to a slideshow that doesn't use the 'load' function. Instead, he has used the Nivo Slider which doesn't display until the entire window has loaded. This is not the path we decided to take with the Riva Slider Pro because if an element on the page takes a significant time to load or never loads at all, the slideshow will only display when that element has been loaded, which may take minutes (or never load at all).

    Anyway, I will leave it at that. I just wanted to notify you incase any users contact you in the future. I only felt the need to do so because I've had two users contact me about it. Again, I do believe that conditionally loading the scripts on pages where they are needed would be a great idea opposed to loading them on all pages. It's really up to you whether you wish to implement it or not, but it may save you some trouble in the future, especially since your plugin is really proving popular (and very good, might I add).

  4. Benedikt Mo
    Member
    Plugin Author

    Posted 3 years ago #

    Thank you very much. I agree with you. At the moment I'm very busy, but after that I will change that. Best regards BMo

  5. MickeyRoush
    Member
    Posted 3 years ago #

    @ MatthewRuddy

    Have you tried deregistering the styles and scripts where they are not needed? Try something like the following in your theme's functions.php

    // Deregister scripts and styles associated with NextGen Scroll Gallery expect on specified page(s)
    add_action( 'wp_print_scripts', 'deregister_ngsgscript', 100 );
    add_action( 'wp_print_styles', 'deregister_ngsgstyles', 100 );
    
    function deregister_ngsgscript() {
    	if ( !is_page( 'page-that-scroll-gallery-is-used' ) ) {
    		wp_deregister_script( 'scrollGallery' );
    		wp_deregister_script( 'mootools' );
    		wp_deregister_script( 'powertools' );
    	}
    }
    
    function deregister_ngsgstyles() {
    	if ( !is_page( 'page-that-scroll-gallery-is-used' ) ) {
    		wp_deregister_style( 'scrollGallery' );
    		wp_deregister_style( 'scrollGalleryDesign' );
    	}
    }

    replace:
    page-that-scroll-gallery-is-used

    with the actual page name

  6. Benedikt Mo
    Member
    Plugin Author

    Posted 3 years ago #

    Hi Mickey,
    thank you. I fixed the problem.
    I plan a very big update with many new features and a complete new HTML part. I think I will publish it on Monday.

  7. Benedikt Mo
    Member
    Plugin Author

    Posted 3 years ago #

    Solved. Download new version 2.0.0

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • NextGEN Scroll Gallery
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic