WordPressカスタマイズ事例

WordPressでJqueryプラグインを使う、あるいはWordPress標準のJqueryではなく別バージョンのを使う

サイトにちょっとした気の利いた動きを出そうと思ったら Jquery ですね。
WordPressでも標準機能として wp_head() 内で Jquery を勝手に読み込んでくれます。
さらに Jqueryプラグインを読み込んでみましょう。
テーマの function.php に以下を記述します。

//たとえばlazyloadを読み込みたい場合
function lazyload_scripts_method() {
	wp_enqueue_script(
		'lazyload',
		get_template_directory_uri() . '/assets/js/jquery.lazyload.min.js',
		array( 'jquery' )
	);
}
add_action( 'wp_enqueue_scripts', 'lazyload_scripts_method' );

これにより、jquery本体読み込み後にプラグインを読み込んでくれます。
 
 
また、WordPress標準の Jquery ではなく、こちらが使いたいバージョンの Jquery を指定したいときは、テーマの function.php に以下を記述します。

add_action('init', 'my_init');
function my_init() {
        wp_deregister_script('jquery');
        wp_enqueue_script('jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js', array(), '1.11.3');
}

これでjquery ver1.11.3を読み込んでくれます。
 
 
さらに、WordPress標準で読み込まれてしまうJqueryプラグインを外して別バージョンのプラグインを入れたいときなども同様の記述でできます。
imagesloadedの場合なら以下。

function imagesloaded_scripts_method() {
    wp_deregister_script('imagesloaded');
	wp_enqueue_script(
		'imagesloaded',
		get_template_directory_uri() . '/assets/js/imagesloaded.pkgd.min.js',
		array( 'jquery' )
	);
}
add_action( 'wp_enqueue_scripts', 'imagesloaded_scripts_method' );

WordPress本体のバージョンアップなどで Jquery や Jqueryプラグインがアップグレードされると動かなくなる可能性のあるスクリプトを書いてたりする場合は、この方法で対応できますね。


関連するWordPressカスタマイズ事例