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

だから、次のWPテーマのベースにStarkersを使用していて、小さな問題に遭遇しました。header.phpファイルに自分のバージョンのjQueryを含めていましたが、Firebugを使用してサイトを検査すると、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_head()WPに含まれるjQueryファイルがすべてのプラグインで使用されるように、先頭に配置します。

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

また、jQueryのGoogle CDNバージョンを使用して（少なくとも実験的に）使用したいのですが、2回は含めたくありません！

私が説明しようとしていることを理解していただければ幸いです。この問題をどのように解決できるかについての提案をいただければ幸いです。また、JavaScriptファイルをヘッダーファイルでどのように処理するかについてのアドバイスも歓迎します。

ありがとう！

— ベン・エヴァラード
ソース

これは、「外部jQuery / JavascriptファイルをWordPressにリンクする方法」のようなタイトルに変更する必要があります。

— -MikeSchinkel

私は同意します、私が抱えていた問題にあまり詳しくなかったので、何と呼ぶべきか分かりませんでした：

— ベンエバーラード

回答:

質問の文言から、<script>テンプレートにタグを記述してスクリプトを追加する必要があります。wp_enqueue_script()テンプレートのを介して独自のスクリプトを追加し、functions.phpjQueryへの依存関係を適切に設定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');

詳細については、コーデックスのページをご覧ください。

— アニカ・バックストローム
ソース

あなたは私が<script>タグを使用してスクリプトを追加していると考えているのは正しいです、これは私が探していた選択肢です、ありがとう！:-)

— ベン・エヴァールド

スクリプトをフロントエンドのみに追加する場合は、の'template_redirect'代わりにフックします'init'。

— ジョンPブロッホ

良いもの、答えを更新します。エンキューをにラップすることをほぼ提案しましたis_admin()。

— アニカバックストローム

私は一般的に上記のテンプレートファイル内のスクリプトをエンキューget_header()それをやって、functions.php必要とされないことがすべてのページにそれをエンキューします。グローバルなものがある場合、呼び出されるheader.php前にそれをキューに入れwp_head()ます。そのように、エンキューは、あなたが彼らがいると予想される場所です<head>

— ジョーホイル

ページの下部にスクリプトを追加した方が良い場合があります。これはcodex.wordpress.org/Function_Reference/wp_enqueue_script（5番目、$ in_footer）の最後のパラメーターであり、trueに設定します。より多くの制御が必要な人のための小さな情報。

— -hakre

WordPressでjQueryを使用するための5つのヒントをご覧になることをお勧めします。特に、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');

Use Google Librariesプラグインもご覧ください。

— トラビスノースカット
ソース

これは、jQueryのGoogle CDNバージョンをキューに入れる方法を示しているため、実際にはより良い答えです。ただし、ジョンが他の場所で提案したように、フロントエンドでこれだけにしたい場合は、のtemplate_redirect代わりにフックしinitます。

— EAMann

ロードする場所についての良い点。実際には、管理領域でもjQueryを使用していますよね？いずれにせよ、それを制御する方法を示してくれてありがとう。

— トラビスノースカット

はい、私はちょうどあなたの答えに感謝:-)、jqueryの/ WPポストのための5つのヒントを発見した

— ベンEverard

WordPressでjQueryを使用するための5つのヒント-リンクはもう機能していません。

— -hakre

注：この例にはjQueryの「古い」バージョンが含まれており、現在のWPバージョン（3.0.1）はjQuery 1.4.2を実行しています...

— t31os

@tnorthcuttは正しいのですが、自分でロードしたい場合はWPのネイティブjqueryを適切にデキューする必要がありますが、WPコアの別の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');

— cjbj
ソース