CODEWITHSUNDEEP
javascriptphpwordpresstwitter-bootstrapnivo-slider
user3274745
user3274745

Reputation: 361

Nivo slider not working in wordpress jquery

I have added nivo slider plugin to wordpress however it doesn't move past the git loading file.I believe the problem is in the way i am loading the jquery.

I have included the javascript jquery.nivo.slider.js file in the js folder inside my theme folder. In the header.php i am using this inside the head tags:

    <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/bootstrap/js/jquery.nivo.slider.pack.js"></script>
   <script type="text/javascript">
    $(window).load(function() {
    $('#slider').nivoSlider();
    });
    </script>
   <?php wp_enqueue_script("jquery"); ?>

   <?php wp_head(); ?>

And in the index.php i am using this:

    <div class="container">

    <div class="slider-wrapper theme-default">
    <div class="ribbon"></div>
    <div id="slider" class="nivoSlider">
    <img src="bootstrap/images/screen1.jpg"/>
    <img src="bootstrap/images/screen2.jpg" />
    <img src="bootstrap/images/screen3.jpg"  />
    <img src="bootstrap/images/screen4.jpg"/>
    </div>
    </div>

I am not using anything inside the functions.php file.And am using this inside the style.css:

@import url("bootstrap/css/nivo-slider.css");
@import url("bootstrap/css/slider.css");
@import url("bootstrap/css/bootstrap.css");
@import url("bootstrap/themes/default/default.css");

Could you please tell me where i go wrong due to which the git file is appearing and not the images slideshow. When used as index.html it worked as a charm.

Upvotes: 1

Views: 1965

Answers (1)

Vignesh Pichamani
Vignesh Pichamani

Reputation: 8070

Take a look into the two link might solve the problem if you did with enqueue standards you might solve jquery conflict. http://codex.wordpress.org/Function_Reference/wp_register_script

http://codex.wordpress.org/Function_Reference/wp_enqueue_script

Create a script.js file 

$(window).load(function() {
$('#slider').nivoSlider();
});

Open your theme file functions.php and add the below code:

create function 

    function enqueue_script_for_nivo () {
    wp_enqueue_script('jquery');
    // Load your nivo script too here.
   wp_register_script('nivoscript',get_stylesheet_directory_uri().'/bootstrap/js/jquery.nivo.slider.pack.js"');
    wp_register_script( 'my-script', get_stylesheet_directory_uri() . '/js/script.js' );
wp_enqueue_script('nivoscript');
    wp_enqueue_script('my-script');
    }

add_action('wp_enqueue_scripts','enqueue_script_for_nivo');

That's all try this one hopefully it should work :)

Upvotes: 2

Related Questions