img from: ICOOON MONO

画像ではなく、背景をスライドショーにすることができるjQueryプラグイン「BgSwitcher」。
ヘッダ画像やページ全面画像のときなど使い勝手がよさそうです。
表示位置とかトリミングとか、画像より背景の方が指定しやすいこともあるし、あとスライドショーって大抵画像をリストにすると思いますが、背景なら画像増やすのにページのソースを書き換えなくていい。

いや、本当なら背景background-imageをcssでアニメーションさせたいのですよ。
ですがbackground-imageはアニメーションしないんですって！

というわけで。
jQueryプラグイン「BgSwitcher」を使用しました。
設定方法やらなんやかやはこちら。

WordPressでの設定方法も書いてくださってありがたい限りです。

上記サイトはWordPressテーマファイル内に記述する場合なのですが、テーマファイルが煩雑になるのでJavaScript部分は外部ファイルにまとめて書きたいのが人情。
しかしそうすると、画像ファイルへのパスをどうしたらいいのか…！という問題が発生します。
（jsファイル内では通常PHPget_template_directory_uri()が書けません）

上記を参考に、jsファイルにテーマディレクトリを読ませます。
まずテーマファイル内、外部jsファイルの読み込みより先に、以下コードを入れます。

<?php echo '<script type="text/javascript">var templatePath = "' . get_template_directory_uri() . '";</script>';?>

以下は外部jsに記載する内容です。
テーマフォルダ内の｢img｣フォルダに画像が入っている場合は、

$("適応先").bgswitcher({
images: [
templatePath + "/img/画像.jpg",
templatePath + "/img/画像.jpg",
templatePath + "/img/画像.png",
],
effect: "fade",
easing: "swing",
interval: 5000,
loop: true
});

となります。