FirefoxでWordPress Widgetに設置したFacebook Page Widgetが表示されないことと注意しておきたいこと

この記事を読むのに必要な時間は約 20 分です。
(専門用語などにはポップアップする説明をつけているので時間が長く表示されることがあります。
ツールチップの機能については、こちら)

 Firefox の時だけなぜか Facebookのページウィジェットが表示されないとか Twitterのウィジェットが表示されないもしくは、 Googleアドセンスもそろって表示しなくなったという方いらっしゃいませんか?
2018年10月のアップデートよりそうなった方も少なくないと思います。 Chrome で表示されていれば設置方法には問題ないので他の原因ということになります。

 

目 次

表示しない原因を探る

ページウィジェットが表示されていない
2015年以前から表示されていて放置していた方は、表示されていなくても簡単なのですがそうでない場合は、見直すべき部分があります。
タグが古いとかJavaScriptの重複・ページで制限をかけているなどの場合に表示されません。
下記のページでも解説しています。

FacebookページプラグインFBページのページプラグインが表示されない
皆さんのブログやホムペにページプラグイン表示されていますか? 2015年6月にLikeボックスからページプラグインへ変更されましたね...

 

タグが古い場合

2015年に Facebookがページプラグインの表示タグを変更しました。それ以前から表示していた場合で放置していた場合や新しく設置した場合でもJavaScriptの重複があると表示できません。

上記のページで表示確認を行ってください。表示されればOKですが、表示されない場合は、次に進んでください。

Facebookページで制限をかけている場合

Facebookページ設定
ページの公開・非公開と国別制限・年齢制限のこの3つに制限があった場合に表示されないという事例が過去にありました。すべて公開するようにしておいてください。表示されればOKですが、表示されない場合は、次に進んでください。

 

ブラウザがFirefoxの場合

Firefox
最近から表示されない場合は、この可能性大かなーって思います。
試しに Chrome で1度表示させてみてください。表示されたら可能性ありますね。
この場合は、 Twitterウィジェットも表示しません。それだけでなく Googleアドセンスの広告も表示しません。

原因は、下記の項目かもしれません。

  •  Firefox のオプションで履歴を記憶させないという設定にしている
  •  Firefox のオプションでコンテンツブロッキングのトラッカーにチェックが入っている

上記の2つがかぶってる場合に Facebookのウィジェットだけでなく Twitter Googleアドセンスの広告も表示しません。そういった場合にまず、 Chrome で表示確認してOKなら間違いなく上記が原因となります。

解決策

Firefox 履歴
オプション→セキュリティとプライバシーで開きます。
履歴を記憶させるに変更します。変更後、 Firefox を再起動する必要があります。

コンテンツブロッキング
オプション→セキュリティとプライバシーで開いた先頭のコンテンツブロッキングのところ
赤枠の部分のトラッカーとCOOKIEに入ってるチェックを外します。
これで Facebook Twitterのウィジェットと Googleアドセンスの広告が表示されるか試してください。

コンテンツブロッキングで許可サイトの登録などで回避したいのですが、まだ説明が十分でないことと Firefox のサイトでの説明で使われている画像が英語版のままでわかりにくいという部分などでまだ完全ではないようです。
2018年にできたコンテンツブロッキングについては、もう少しいろいろやって調査する必要があるかもしれません。

 

注意しておきたいこと

ページウィジェット
ホムペブログFacebookページへの導線となるページプラグインを使っている方も多いですね。
表示できるのは当然のこととしてこのページプラグイン場合によって表示できない場合もありますね
アメブロに設置する場合などたいていフリースペースにタグを入れてサイドバーに配置しますよね
Facebook for Developers HTMLタグの生成が簡単にできます。
2019年8月9日にGigazineに掲載されていた記事を読んでページプラグインの使い方を変更しようと思いました。
上記画像では、顔写真を表示しています。

ページプラグイン顔表示なし
いいねをページにしていただいた方々なのですが、表示してもいいという許可はもらってない場合がほとんどですよね
Gigazineの記事読むとすごく怖くなってこのアメブロ顔写真を非表示に変更しました。
もし、いいねした人が文句言ったらどうしますか?
というわけで2800人に確認するというよりも非表示を選んだということです。
これは Facebookの仕様上見るユーザーによって表示される人が違うので1人でも反対者がいると困るからです。
○○さんだけ非表示にというわけにはいかないのです。

Jetpackウィジェットでの顔表示なしの方法

JETPACK
はじめにJETPACKがインストールされていて設定が済んでいるという前提で読んでください。

ウィジェットを追加
まず、[外観]→[ウィジェット]で開きます。
JETPACKウィジェットを任意の場所に追加します。
表示した居場所をリストから選ぶもしくは、表示した居場所へドラッグアンドドロップすれば追加されます。

ウィジェットで設定
タイトルやアドレスを入力して幅や高さは、便宜変更してください。
2カラムの場合は、330の幅でいいと思います。
画像サンプルでは、フッターに入れていますので600としていますが、サイドバーの場合は、300もしくは450で十分だと思います。
赤枠の「顔写真の表示」のチェックを外しておきます。
これだけでいいねしていただいた方の顔写真は、非表示になります。
設定が終われば下に表示されている「保存」ボタンをクリックして完了です。
表示を確認してください。

VK All in One Expansion Unitウィジェットでの顔表示なしの方法

VK All in One Expansion Unitウィジェット
VK All in One Expansion Unitは、Lightningというテーマを使われている方は、インストールされている場合があります。
まず、[外観]→[ウィジェット]で開きます。
VK FB Page Pluginを任意の場所に追加します。

ウィジェットの設定
ウィジェットを設定します。
タイトルやアドレスを入力して高さは、便宜変更してください。
赤枠の「アイコンを表示する」のチェックを外しておきます。Facebookページアイコンという意味ではなくいいねしていただいた方のアイコン=顔写真という意味のようです。
これだけでいいねしていただいた方の顔写真は、非表示になります。
設定が終われば下に表示されている「保存」ボタンをクリックして完了です。
表示を確認してください。

 

WEBのことならくまはちLABにお任せください。

サービス 制作事例
お問い合わせ
くじらモバイル登録
LINE@友だち追加

くまはちLABのご利用ありがとうございます!くまはちLABの最新情報をフォローしてゲットしてください!