東京都練馬区。Wordpressはおまかせ。印刷・ホームページなど販売促進のためのデザインを提案します。

デザイン事務所ダウンアンダー

営業
10:00-
19:00

WordPressにおけるjQueryのコンフリクトについて。

     技術ノート   ,  野村貞次

WordPressは内部にjQueryライブラリを持っています。

ところがこのライブラリでは動かないスクリプトが多数あります。

当サイトでは

  • rollfader.js
  • ga.js
  • html5

を読み込んでいますが、

<script src=”<?php bloginfo(‘template_url’) ?>/js/jquery-1.8.2.js” type=”text/javascript” charset=”utf-8″></script>

 を指定しないと動作しません(googleのライブラリから読み込んでもかまいません)。

ところがこれが曲者。Wordpressプラグインの中にはバッティング(コンフリクト)を起こして動かないものが多数あります。

たとえば当サイトで右上に使っている「光画部ぶらり光画部」。
本体である光画部は問題ないのですが、それをスライドショー表示するぶらり光画部がアウトです。

「これは根本的にjQuery問題を解決せねば!」と探したのが以下のサイトです。

WordPressでjQueryを使うときに、問題なく動作させる為の基礎知識やTipsと、動かない場合の対処例

たいへん長いので要点をつまむと、header.phpに書かれている<?php wp_head() // For plugins ?>の前に以下の行を挿入します。

  • <?php
  • wp_deregister_script(‘jquery’);
  • wp_enqueue_script(‘jquery’, ‘http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js’, array(), ‘1.8.2’);
  • ?>

jQueryのバージョンは適宜読み替えてください。

wp_enqueue_scriptは日本語codexにはまだ記載がありませんが、スクリプトを安全に読み込む仕組みのようです。

試しに「常に最新版のjQueryをgoogleからロードする」スクリプトを置いてみてもちゃんと動きました。

  • <?php
  • wp_deregister_script(‘jquery’);
  • //wp_enqueue_script(‘jquery’, ‘http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js’, array(), ‘1.8.2’);
  • ?>
  • <script type=”text/javascript”>
  • google.load(“jquery”, “1”);
  • </script>
  • <?php wp_head() // For plugins ?>

 

     技術ノート   ,  野村貞次

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

 こちらの記事も読んで見ましょう

WordPressにおけるjQueryのコンフリクトについて。 東京都練馬区。Wordpressはおまかせ。印刷・ホームページなど販売促進のためのデザインを提案します。

Copyright©デザイン事務所ダウンアンダー,2012 All Rights Reserved.

ページ先頭へ