Cocoonでモバイル用サイドバーにAmazonウィジェットや楽天ウィジェットが表示されない

WordPress で Cocoon テーマを使っていて(バージョンはこちら)、サイドバーにamazonアソシエイトの「サーチウィジェット」やRakutenアフィリエイトの「楽天モーションウィジェット」を入れました。

PCでは何の問題もなく見えていたのですが、iPhoneで見たら表示されていません。

ばぁちゃん(心)
ばぁちゃん(心)

ん~

結論から言うと、「モバイルスライドインメニューでは広告を表示させない」というのが仕様だそうです。

 

確かに、「[C]広告」「[C]広告(モバイル用)」ウィジェットを使った他の広告も表示されません。

が、「カスタムHTML」ウィジェットを使っていたので、バナーなどを貼り付ける他の広告は表示されていたんです。

ばぁちゃん(心)
ばぁちゃん(心)
これが、頭グルグルの諸悪の根源でした!

 

そして、「カスタムHTML」ウィジェットでも、Adsense広告が使っているJavaScriptは広告とみなして、スライドインメニューからは消されるようになっていたようです。

Amazon の「サーチウィジェット」や「楽天モーションウィジェット」は JavaScript だったので、「カスタムHTML」ウィジェットでも、スライドインメニューから削除されていたようです。

 

仕様じゃぁしょうがない。

でも、広告は出したい。

サイドインメニューをやめてコンテンツ下にサイドバーを表示する

Cocoon の場合、管理画面の「Cocoon設定」の「モバイル」のところで、「モバイルメニュー 」を「ボタンを表示しない(ミドルメニューのみ)」とか「トップメニュー」にすると、サイドバーのメニューは横から出てくるスライドインメニューではなく、コンテンツ下に表示されるようになり、その時にはamazonアソシエイトの「サーチウィジェット」やRakutenアフィリエイトの「楽天モーションウィジェット」も含めて「[C]広告」「[C]広告(モバイル用)」などの広告が表示されます。

また、その下にある「モバイルボタン」の「モバイルボタン時コンテンツ下のサイドバーを表示」では、スライドインメニューの時でも、コンテンツ下にもサイドバーの内容が表示され、コンテンツ下のメニューには、広告も表示されます。

 

サイドインメニューと「フッター(モバイル用)」ウィジェットを利用する

仕様じゃぁしょうがない。

でも、広告は出したい。

でも、スライドインメニューもコンテンツ下にも広告以外の同じ内容が表示されるのは、ちょっとうざい。

ということで悩んでいたら、「ウィジェット」に「フッター(モバイル用)」というのがあることに気づきました。

「フッター(モバイル用)」に広告だけ表示するようにすれば、私的には問題解決です。

 

PCではサイドバーに広告も含めたものを表示し、コンテンツ下には広告は表示しない。

モバイルでは、広告なしのスライドインメニューと、コンテンツ下に広告。

ばぁちゃん(心)
ばぁちゃん(心)

ふぅ

その方法

管理画面の「Cocoon設定」→「モバイル」の「モバイルメニュー」は「フッターモバイルボタン」のまま。「モバイルボタン」も「モバイルボタン時コンテンツ下のサイドバーを表示」にチェックが入っていないままです。

 

管理画面の「外観」→「ウィジェット」の「サイドバー」と「フッター(モバイル用)」に同じ広告を入れます。

「サイドバー」に入れた広告はPCのみにしか表示されません。広告以外はスライドインメニューにも表示されます。

「フッター(モバイル用)」に入れた広告は、スライドインメニューが表示されているときだけ、コンテンツ下に表示されます。右側に再度がーが表示されているPCの場合には表示されません。

ばぁちゃん(心)
ばぁちゃん(心)

めでたしめでたし

おまけ

PCとモバイル、という言葉を使っていますが、ブラウザの幅によってPCになったりモバイルになったりします。つまりパソコンで見ている場合には、ブラウザの幅を小さくすればスライドインメニューが表示され、コンテンツ下に広告が表示されます。

「フッター(モバイル用)」は、ブラウザの幅が834px以下の時に表示されるようになっているようです。

そして、スライドインメニューに切り替わるのが「@media screen and (max-width: 1023px) {」ということで1023px以下のようなので

幅が834px~1023px の間でページを見ている人には広告がどこにも出ない???

などという、びみょ~な、そしてほぼどうでもいいようなことに気づいてしまいました!

 

 

ばぁちゃん(心)
ばぁちゃん(心)

やたらと広告を入れてしまいました。

儲けようなどと、、、思ってます!

WordPress のバージョンは 5.4
Cocoon Child のバージョンは 1.1.0
(Cocoonバージョン: 2.1.1.4)
タイトルとURLをコピーしました