web-dev-qa-db-ja.com

WordPressで外部のjQuery/Javascriptファイルをリンクする方法

だから私はStarkersを使って次のWPテーマの基礎にしていて、ちょっとした問題に遭遇しました。私は自分のバージョンのjQueryをheader.phpファイルに含めていました。 jqueryが2回ダウンロードされていたので、少し掘り下げて、ファイルをインクルードしただけでなく、wp_head()関数も同じであることに気付きました。

この問題を解決しようとしているときに、ヘッダーファイルの中のTwenty Tenテーマからのコメントに気づいた。

/* Always have wp_head() just before the closing </head>
 * tag of your theme, or you will break many plugins, which
 * generally use this hook to add elements to <head>, such 
 * as styles, scripts, and meta tags
 */

それで、ここに私の問題があります、それを使いたい他のどのファイルよりも前にjQueryファイルを設定しなければならないという印象の下にあります、そしてwp_head()<head>要素の最後のものであるべきですWPが含まれているjQueryファイルがすべてのプラグインに使用されるようにするには、そうしないようにしても、wp_head()を先頭に配置する必要があります。

wp_head()関数のjQuery行をコメントアウトしましたが、管理ページには必須であるため、元に戻す必要がありました。

私は(少なくとも実験的に)Google CDNバージョンのjQueryを使っても使いたいのですが、それを二度含めたくはありません!

私が説明しようとしていることをあなたが理解していることを願っています、私がこの問題を解決することができる方法に関するどんな提案でも最も感謝されるでしょう。また、JavaScriptファイルをヘッダーファイルでどのように扱うかについてのアドバイスもいただければ幸いです。

ありがとうございます。

15
Ben Everard

あなたの質問の文言から、あなたはあなたのテンプレートに<script>タグを書くことによってスクリプトを追加しなければなりません。テンプレートのfunctions.phpwp_enqueue_script() で独自のスクリプトを追加し、jQueryへの依存関係を適切に設定すると、wp_head()がそのスクリプトを追加します。

function my_scripts() {
    wp_enqueue_script( 'my-sweet-script', get_bloginfo('template_directory') . '/script.js', array('jquery') );
}
add_action('template_redirect', 'my_scripts');

詳細は codexページ を参照してください。

9

5 WordPressでjQueryを使用するためのヒント を見てみることをお勧めします。特に、GoogleのライブラリからjQueryを読み込むために必要なコードを示しています。

function my_init() {
    if (!is_admin()) {
        // comment out the next two lines to load the local copy of jQuery
        wp_deregister_script('jquery');
        wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js', false, '1.3.2');
        wp_enqueue_script('jquery');
    }
}
add_action('init', 'my_init');

Googleライブラリを使う プラグインをチェックすることもできます。

7

@tnorthcuttは、自分でロードしたい場合はWPのネイティブjqueryを正しくデキューする必要があることは正しいのですが、WP coreという別のバージョンのjqueryをロードするときには問題にぶつかることは確実です。コアとプラグインの両方がそこにあることに依存しています。したがって、WPが更新されるたびに最新のjqueryでテーマを更新しないと、サイトが壊れる可能性があります。

次のコードは、最初にどのバージョンのWPが使用されているかを調べてからGoogleからロードすることによって、テーマが常に正しいバージョンのjqueryをロードするようにします。

$wp_jquery_version = $GLOBALS['wp_scripts']->registered['jquery-core']->ver;
$jquery_version = ( $wp_jquery_version == '' ) ? '1.8.3' : $wp_jquery_version; // fallback, just in case 
wp_deregister_script('jquery');
wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/'. $jquery_version .'/jquery.min.js', $jquery_version, false );
wp_enqueue_script('jquery');
1
cjbj