0

I am trying to convert html to wordpress. The code in the html was:

<script src="js/jquery.nicescroll.min.js"></script>
<script src="js/jquery.js"></script> ( jQuery v1.7.2 )

and The inline script 

$(document).ready(

  function() { 

    $("html").niceScroll();

  }

); and much more.

In wordpress functions.php , I added this

if ( ! function_exists( 'your_enqueue' ) ) :
    function your_enqueue(){
wp_enqueue_script(' name ', get_template_directory_uri(). '/script.js' , array('jquery')), '1.0', false);
}
endif;
add_action('wp_enqueue_scripts', 'your_enqueue');

I created a new .js file named script.js and added the following code in it:

<script src="js/jquery.nicescroll.min.js"></script>
$(document).ready(

  function() { 

    $("html").niceScroll();
  }

);

Is it right way to do this? Will it work? and Wordpress by default uses jQuery v1.7.2 or have to do some coding again in functions.php

Improve this question

2 Answers 2

Reset to default
2

Several pointers.

  • The latest WordPress version uses jQuery v1.10.2 , always use the bundled version for admin areas , for the front end you can use the bundled version or a CDN.

If you use a CDN make sure to still use jquery as a $handle so it is not loaded multiple times from other plugins/themes that also enqueue jQuery.

  • Use no conflict wrappers for your scripts, there are several methods you can read here: http://codex.wordpress.org/Function_Reference/wp_enqueue_script#jQuery_noConflict_Wrappers this is essential.
  • Use better naming for your code, using name and your_enqueue is bad, try and be consistent and unique.
  • There is no reason to check if a function exists unless you plan to support child themes. Try and use conditional wrappers to only load your script where it is needed.
  • Not sure if it was a typo, but you do not need to include script src= in your .js file, this is what enqueue is doing.
Improve this answer
1

In addition to @Wyck's answer...

In principle, what you are doing is correct for the most part. Your code as written strikes me as a bit weird though. This code...

if ( ! function_exists( 'your_enqueue' ) ) :
    function your_enqueue(){
      wp_enqueue_script(' name ', get_template_directory_uri(). '/script.js' , array('jquery')), '1.0', false);
    }
endif;
add_action('wp_enqueue_scripts', 'your_enqueue');

... defines your function only if no function of the same name exists, but hooks that function's name anyway, which means that a child theme could enqueue some other script instead. In fact, some child theme or plugin could define your_enqueue to enqueue something beside a script, like a stylesheet, and things would not work right. I would wrap the whole thing in the conditional...

if ( ! function_exists( 'your_enqueue' ) ) :
    function your_enqueue(){
      wp_enqueue_script(' name ', get_template_directory_uri(). '/script.js' , array('jquery')), '1.0', false);
    }
    add_action('wp_enqueue_scripts', 'your_enqueue');
endif;

Or leave off the conditional entirely...

function your_enqueue(){
  wp_enqueue_script(' name ', get_template_directory_uri(). '/script.js' , array('jquery')), '1.0', false);
}
add_action('wp_enqueue_scripts', 'your_enqueue');

Or what should be even more difficult to break, if your PHP sis recent enough...

add_action(
  'wp_enqueue_scripts', 
  function() {
    wp_enqueue_script(' name ', get_template_directory_uri(). '/script.js' , array('jquery')), '1.0', false);
  }
);

Also, you don't need the <script part in an external Javascript file. I imagine that you are getting Javascript errors from that.

Improve this answer
8
  • I edited my answer just before this, I forgot about the child theme thing:) Commented Jan 1, 2014 at 20:44
  • @Wyck : didn't see your edit until you pointed it out, but I'd upvoted your answer before even starting this one :) Commented Jan 1, 2014 at 22:24
  • Could you please tell where the <script inline should be used. Commented Jan 2, 2014 at 5:10
  • That script tag should not be used at all. jquery.nicescroll.min.js should be enqueued just like script.js Commented Jan 2, 2014 at 5:26
  • NO. i am asking about Javascript calling function. which will load jquery.nicescroll.min.js These are inline script in html. where should it will be in wordpress Commented Jan 2, 2014 at 6:16

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.