しっかりと設置すれば、もちろん使えるかと思います。

ただ確率は低いですが、jQueryプラグインに不具合があったり、相性が悪かったりすると、その限りではありません。

結局のところ、実際に設置してみないと確かなことはわからないです。

なんとかちょっと、頑張って設定してみます。

上記の設定は出来ませんでした。

また、別の方法で以下を参考にjQuery「Vegas2」を利用しようと思ったのですが思い通りに行かない感じですね。

https://www.webtoolnavi.com/vegas-background-slideshow/

どちらかというと、bgswitcherの方が設定しやすいのかもと思ってやってみましたが、出来ない感じでした。

http://techmemo.biz/javascript/bgswitcher/

jQuery プラグインは興味があるので、 bgswitcher を試してみました。 Cocoon で使えましたよ。一応やり方を記載しておきます。

●ステップ 1 ：プラグインの読み込み●

子テーマフォルダの直下に bgswitcher.js ファイルを新規作成。 bgswitcher.js ファイルに、 bgswitcher.js のコードを追加。

作成した bgswitcher.js ファイルを読み込むために、子テーマの tmp-user/footer-insert.php に下記のコードを追加。

https://gist.github.com/FirstLayout/c9099fb13b68f394b768ae11ed76d515#file-bgswitcher-js

●ステップ 2 ：任意の場所に画像エリアを設置●

main-before.php や body-top.php などの任意のファイルの任意の場所に、 HTML を追加。 HTML は、ご参考にされたサイトに書かれているもので OK 。

●ステップ 3 ： jQuery を追加●

bgswitcher を動かします。子テーマの javascript.js に以下のコードを追加。

https://gist.github.com/FirstLayout/fc8b323e9c34a19ba64ba7740dae0a75

●ステップ 4 ： CSS を追加●

CSS を追加します。これもご参考にされたサイトに書かれているもので OK 。

完成。

あれ？ Gist は URL を貼り付けるだけではだめなのか。 script での埋め込みテスト。

https://gist.github.com/FirstLayout/fc8b323e9c34a19ba64ba7740dae0a75.js

僕も、一度試したことがあるのですが、このフォーラムは、GistとかのURL enbedには対応していないようです。
スクリプトで貼り付けると、今度はおそらく攻撃対策のためスクリプトが除外されてしまうようです。

Akiraさん、ありがとうございます。

試してみます！！

設定してみたのですが、表示されないんですよね。。。

あらためて、実施したことを記載します。

●ステップ１

・bgswitcher.js ファイルを作成

・子テーマフォルダの直下に bgswitcher.js ファイルをアップ

・子テーマの tmp-user/footer-insert.php に下記のコードを追加。

https://gist.github.com/FirstLayout/c9099fb13b68f394b768ae11ed76d515#file-bgswitcher-js

●ステップ１

●ステップ１

●ステップ１

●ステップ１

●ステップ２

HTML をmain-before.phpに記載。

と記載。

●ステップ 3 ： jQuery を追加●

bgswitcher を動かします。子テーマの javascript.js に以下のコードを追加。

https://gist.github.com/FirstLayout/fc8b323e9c34a19ba64ba7740dae0a75

●ステップ 4 ： CSS を追加●

CSS をCocoon Child: スタイルシート (style.css)に追加。

/*******************************
*bgswitcher
********************************/

.box{
width: 960px;
height: 450px;
position:relative;
}

表示としては、白い背景しか出てこないんですよね。

どこかに設定している背景色がスライドショー画像より上に来ているんでしょうか。。

div の class 名の box って何だろうと思ったら、ご参考にされていたサイトが 2 つあったんですね。申し訳ないです、見逃していました。

私が参考にしたのは、背景画像をスライドショーやフェードで切り替える【jQuery.BgSwitcher】の方です。

なので、私がやったのとステップ 2 と 4 が違います。これが画像が表示されない原因です。

というのも、ステップ 3 で追加するコードの中に、.bg-slider があります。この .bg-slider は、ステップ 2 で追加する HTML の class 名または id を指定します。

なるほど、やり直してみます！！

出来ました！！！（涙）

とても思い通りのものが出来ました！！

あと、ひとつわがままな質問を聞いて頂けたらでいいのですが

このスライドショーですが、固定ページごと（ページIDごと？）に表示するスライドを変えることは出来ないでしょうか？

できますよ。ただ、その前にいくつかヒアリングをします。

●投稿ページやカテゴリー・タグアーカイブページでは、 bgswitcher を設置されるでしょうか？

●フロントページは、固定ページでしょうか？インディックスリストでしょうか？インデックスリストの場合には、 bgswitcher を設置されるでしょうか？

●画像を変えたい固定ページは、いくつぐらいあるでしょうか？（ 1 つの固定ページでのみ画像を変え、その他の固定ページは一緒の画像でいいのか？）

色々と我儘を聞いて頂いてありがとうございます。

検討している内容を記載させて頂きます。

●使用するページは固定ページで設置となります。

●フロントページは固定ページです。

●ページ数は５ページとなります

   各固定ページで変更出来たらと思っています。

　・トップ（固定ページ１）（A画像、B画像、C画像）

　・固定ページ２（D画像、E画像、F画像）

　・固定ページ３（G画像、H画像、I画像）

・・・・という感じです。

構成

----------

・トップ（固定ページ１）
・固定ページ２
・固定ページ３
　・固定ページ４　※サブメニュ
　・固定ページ５　※サブメニュ

----------

情報ありがとうございます。変更箇所は 2 点です。

まず、ステップ 2 で main-before.php に追加したコードを、以下のものに変えます。 

https://notepad.pw/share/b2dnce4n

次に、ステップ 3 で javascript.js に追加したコードを、以下のものに変えます。

https://notepad.pw/share/c2ymao30w

やっていることは、各固定ページの bgswitcher のエリアに bg-slider-1 から bg-slider-5 の class 名を付けています。そして、この各 class に対して、 jQuery で画像を個別に指定します。

CSS の変更は必要ありません。

すごい！ありがとうございます。

早々に対応してみます！！！

設定した固定ページでは問題なく出来ました！

ありがとうございます。

しかし、設定していない固定ページにテキスト（「テキストを表示するなら書く」）が表示されてしまいます。

各固定ページ

構成

----------

・トップ（固定ページ１）　★
・固定ページ２　★
・固定ページ３　★
　・固定ページ４　※サブメニュ　★
　・固定ページ５　※サブメニュ　★

・固定ページ６　☆

----------

★スライド設定有　

☆スライド設定無

このスライド設定無しのページには、設定が反映されないようにするにはどのようにしたら良いでしょうか？

設定していないページに出ている画面としては、画像を設定していないのでテキストのみが表示されています。

他のページでテキストを表示しないためには、  main-before.php を下記のように変更します。

https://notepad.pw/share/87b8igqq

1 行目に画像を表示したい固定ページの id を入力する条件分岐を追加しています。

akiraさん

色々とアドバイス頂いてありがとうございます！！

とても参考になり、結果思っている通りの内容になりました。

感謝しております、ありがとうございました。