我如何将这个jquery代码包含到wordpress中？

Question

I have been looking to figure this out for weeks. How to include a jquery in wordpress... so I have used the wp_enqeue_scripts(); but then I still don't understand it. so for example I have this jquery slide down code..

$jQuery(document).ready(function() {

    $jQuery('#slide').slideDown();  

});

now this code works perfectly on my static html code which has the slide ID in it by the way..

so how would i include that slide to my wordpress plugin? here is my plugin code

<?php
/*
Plugin Name: Jquery Test.
Plugin URI: http://wsplugins.com
Description: A plugin that increases your website traffic by floating facebook, twitter and google + share button. The buttons bounce and move over your page ensuring maximum attention by your visitors.
Author: Ronny Kibet.
Author URI: http://@.com
Version: 1.0
 */

thanks.

Answer 1

to enqueue a script in wordpress in a plugin use this:

/**
* Proper way to enqueue scripts
*/
function theme_name_scripts() {
    wp_enqueue_script( 'script-name', get_template_directory_uri() . '/js/example.js',    array('dependencyScriptThatNeedsToExecuteBeforeMyScriptName','forExample','jquery), '1.0.0', true );
}

add_action( 'wp_enqueue_scripts', 'theme_name_scripts' );

Answer 2

I was also searching for the same solution but I found it myself.

create a new file custom-functions.js in the js director and past the code that you want to enqueue in that file. Now enqueue it in the functions.php

    wp_enqueue_script( 'custom-functions', get_template_directory_uri() . '/js/custom-functions.js', array(), '1.0', true );

read the full tutorial at Bootstrap WordPress Snippets - wp_enqueue_script

Answer 3

function theme_name_scripts() {
        wp_enqueue_script( 'script-name',  plugins_url( '/js/responsiveslides.min.js' , __FILE__ ),      array(),false, true );
}
add_action( 'wp_enqueue_scripts', 'theme_name_scripts' );

Answer 4

You have a couple of options.

Option #1

Paste the code into footer.php (or header.php).

<script>
$(function() {
    $jQuery('#slide').slideDown();  
});
</script>

This would result in every DOM element with an ID of "slide" to slideDown upon page load.

Option #2

Using WordPress' API , you could create a method in your theme to include a JavaScript file with the code inside . This is more complicated and requires an understanding of WordPress hooks.

Answer 5

I am having this same problem, but I got it to "somewhat" work. First you need to use wp_register_scripts, with the script name, and then do wp_enque_script("scriptname");... I don't understand why this is the way it is, but we just have to deal :-/

Answer 6

you may need to use noConflict, an example would be:

<script type="text/javascript">

var slide=jQuery.noConflict();

slide(function() {
    slide('#slide').slideDown();  
});
</script>