WordPress.org

Ready to get started?Download WordPress

Forums

WP Carousel
All slides show for a second-two, then they rotate ok. (9 posts)

  1. Nennad
    Member
    Posted 2 years ago #

    Hi,

    I use slider with Nivo slider default theme, works great except at the load of the page, all slides are exposed for a second-two, they all show themseves to the right or bellow.

    I use Customized content, and have images which are pointing to the urls.)

    Does the plugin cut the image into pieces every time it loads page ? Can it be cached, pre-baked if so ?

    Thanks

    http://wordpress.org/extend/plugins/wp-carousel/

  2. sumolari
    Member
    Plugin Author

    Posted 2 years ago #

    I don't know exactly how Nivo Slider works (I'm not the author of Nivo Slider), but probably the problem is that WP Carousel loads its Javascript code at the end of the page.

    I thought it was the best way, because the page itself loads faster, but problems like this have been reported before. Furthermore some themes (I don't know why) don't include wp_footer() in the footer and I get a lot of complains about this, no matter it is not a problem of WP Carousel but the WordPress theme.

    So sum up, in the next release WP Carousel will load the code in the header and these problems will be solved.

  3. Nat Hobson
    Member
    Posted 2 years ago #

    Any idea when this update might be coming? Love the plugin but waiting for the update before I push a new site live. I'm happy to swap some code around if you could post a fix for this specific issue?

  4. sumolari
    Member
    Plugin Author

    Posted 2 years ago #

    I don't want to release a new version with just that change. But you can apply this changes modifying wp-carousel.php.

    Near line 221 you'll find:

    wp_register_script('wp_carousel_jcarousel', $wp_carousel_path[6].'js/jcarousel.min.js', array('jquery'), false, true); // jCarusel (tomado de http://sorgalla.com/jcarousel/)
    		wp_register_script('wp_carousel_nivoslider', $wp_carousel_path[6].'js/jquery.nivo.slider.js', array('jquery'), false, true); // NivoSlider, el script printipal para crear los carruseles (tomado de http://nivo.dev7studios.com/)

    Replace it with:

    wp_register_script('wp_carousel_jcarousel', $wp_carousel_path[6].'js/jcarousel.min.js', array('jquery'), false, false); // jCarusel (tomado de http://sorgalla.com/jcarousel/)
    		wp_register_script('wp_carousel_nivoslider', $wp_carousel_path[6].'js/jquery.nivo.slider.js', array('jquery'), false, false); // NivoSlider, el script printipal para crear los carruseles (tomado de http://nivo.dev7studios.com/)

    Then javascript code will be loaded in the header instead of in the footer, and the carousel should load almost instantly.

  5. Nat Hobson
    Member
    Posted 2 years ago #

    Hi, thanks for the reply, missed that somehow.

    I'm using the "Premium Slider" theme and this fix doesn't seem to help - I notice the particular mention of the Nivo slider theme. Should this fix all the themes?

  6. sumolari
    Member
    Plugin Author

    Posted 2 years ago #

    When you add wp_carousel(ID) is called, WP Carousel adds the Javascript code needed to set up the carousel to the footer, because it can't be added in the header (the header is always before the carousel).

    As WP Carousel can't predict where will you add a carousel, it always adds the final code in the footer. I thought that code would love almost instantly, but if it does not, the only modification you can do it putting that Javascript code just after or before the carousel.

    To do that open wp-carousel.php, go to line 1051 and replace:

    add_action('wp_footer', 'wp_carousel_load_carousel_'.$c_id.'_js_code');

    With:

    wp_carousel_load_carousel_js($c_id);

    Do the same with line 1083 and 1117. It should work.

  7. Nat Hobson
    Member
    Posted 2 years ago #

    No luck unfortunately! Still get it collapsing down, mainly on one particular page, but the fixes above made no difference performance wise.

    Is there an element I can hide the overflow of to at least hide it? I've played around but nothing seems to work properly.

  8. sumolari
    Member
    Plugin Author

    Posted 2 years ago #

    You can hide the carousels with CSS and show them when the page is completely loaded. It won't make it to load faster, but to the user it will look like the carousels appear completely loaded, preventing the "loading stage".

    Let's assume that all the carousels have class ".carousel".

    With CSS:

    .carousel { display:none; }

    And with Javascript:

    jQuery(document).ready(function($) {
    $(".carousel").show();
    });
  9. Nat Hobson
    Member
    Posted 2 years ago #

    I hid .jcarousel-skin-premium-slider as if I hide the whole thing the whole page gets messed up. I've added this script in but it doesn't unhide it:

    <script type="text/javascript">
    jQuery(document).ready(function($) {
    $(".jcarousel-skin-premium-slider").show();
    });
    </script>

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic