我如何將這個jquery代碼包含到wordpress中？

Question

數周以來，我一直在尋找解決方案。 如何在wordpress中包含一個jquery ...所以我用過wp_enqeue_scripts（）; 但是我還是不明白。 因此，例如，我有此jQuery向下滑動代碼。

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

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

});

現在，此代碼可完美地在我的靜態html代碼上正常工作，該代碼中附帶幻燈片ID。

那么我將如何將該幻燈片包含到我的wordpress插件中？ 這是我的插件代碼

<?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
 */

謝謝。

Answer 1

要使腳本在WordPress中排隊，請使用以下命令：

/**
* 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

我也在尋找相同的解決方案，但我自己找到了。

在js導演中創建一個新文件custom-functions.js，然后越過您要排隊的代碼。 現在將其放入functions.php

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

閱讀Bootstrap WordPress代碼段上的完整教程-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

您有兩種選擇。

選項1

將代碼粘貼到footer.php（或header.php）中。

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

這將導致在頁面加載時將ID為“ slide”的每個DOM元素都向下滑動。

選項＃2

使用WordPress的API ，您可以在主題中創建一個方法，以在其中包含代碼的JavaScript文件中添加該方法。 這更加復雜，需要了解WordPress掛鈎。

Answer 5

我遇到了同樣的問題，但我得到了“某種程度”的幫助。 首先，您需要使用帶有腳本名稱的wp_register_scripts，然后執行wp_enque_script（“ scriptname”）; ...我不明白為什么會這樣，但是我們只需要處理：-/

Answer 6

您可能需要使用noConflict，例如：

<script type="text/javascript">

var slide=jQuery.noConflict();

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