HAGANEYA(@imech_jp)です。

ブログを長期休止している間に、facebookプラグインの『Like Box』がリニューアルされていたようです。

巷の話だと「Like Box が使えなくなった」とのことですが、レイアウトが崩れるような不具合なども特に無かったため、全く気付かずに使い続けていました。

 

問題が表面化するキッカケとなったのは「facebook の投稿をブログに埋め込めない」というトラブル。

先日、Twitter や Google+ などと同じ感覚で、記事内に投稿を埋め込もうと試みたのですが・・・何度挑戦しても “blockquote(引用)” 扱いになってしまいます。

その時点では原因が全くわからなかったのですが「Page Plugin を導入することによって直る」との情報を目にし、実際に試してみたところ、埋め込みが正常に表示されるようになりました。

『Page Plugin』を導入すると、facebookページの投稿をブログに埋め込むことが可能になります。

Posted by ハガネヤドットネット on 2016年2月7日

 

参考記事

Facebookの投稿を埋め込んでも表示されない時の対処法 | ブログ用WordPressテーマ マテリアル

スポンサードリンク

 

『Page Plugin』を導入してみよう

「既に “facebookページ” を開設している」と想定して話を進めます。もし開設がまだなのであれば、先に “Facebookページを作成” から facebookページを開設しちゃってください。

 

まず『Page Plugin』のページへアクセスしましょう。

2(7)

 

画面をスクロールすると、Page Plugin の設定項目が現れます。

4(6)

各項目の内容は以下のとおり。

  • Facebook Page URL:facebookページのURL
  • Tabs:timeline・messages・events などを設定(空欄にすると、タイムライン部分を省略可能)
  • Width:Page Plugin の “横幅” を変更(最小180~最大500の間で設定)
  • Height:Page Plugin の “縦幅” を変更(最小は70)
  • Use Small Header:ヘッダーの “縦幅” をスリムに
  • Adapt to plugin container width:Page Plugin の幅を自動で調整
  • Hide Cover Photo:facebookページのカバー写真を “ヘッダー部分” に表示しない
  • Show Friend’s Faces:いいね!してくれた方々のアイコンを表示/非表示

 

Tabs:timeline・messages・events などを設定(空欄にすると、タイムライン部分を省略可能)

5(3)

 

Width:Page Plugin の “横幅” を変更(最小180~最大500の間で設定)

9(2)

 

Height:Page Plugin の “縦幅” を変更(最小は70)※『Tabs』に “Timeline” が入っていないと変化無し

10(2)

 

Use Small Header:ヘッダーの “縦幅” をスリムに

7(4)

 

Hide Cover Photo:facebookページのカバー写真を “ヘッダー部分” に表示しない

6(4)

 

Show Friend’s Faces:いいね!してくれた方々のアイコンを表示/非表示

8(3)

 

設定を終えたら [Get Code] ボタンをクリックしましょう。コードが表示されます。

3(5)

 

1と2のコードをまとめて、ウィジェットにコピペしてください。※どちらか一方だけだと正常に表示されません

11(2)

 

特に問題がなければ、このように表示されます。

13(2)

私の場合、”facebookページのカバー写真” と “タイムライン投稿” が邪魔だったので、このようなデザインにしてみました。見た目は『Like Box』時代とあまり変わっていませんが、なんとなく無駄が削ぎ落とされたような印象を受けます。

スポンサードリンク