I live freely

【旧ライクボックス】フェイスブック「Page Plugin(ページプラグイン)」の詳しい設置方法

私は日々ブログを書いていますが、他の方の書いているブログもよく読んだりしています。

そうすると、ブログのいたるところに「フェイスブックページ」を設置している方が非常に多いのが分かります。

 

フェイスブックやツイッターといったソーシャルメディアは、自分の書いている記事を多くの方に見てもらうツールとしても有効です。

それに、なんといっても自分のブログにフェイスブックページを設置していると、なんだか人気ブロガーさんのページっぽく見えたりする(?)ので、とりあえず設置だけでもしておきたいと思う方も多いのではないでしょうか?

 

以前は、フェイスブックページを設置するにあたって「Like Box(ライクボックス)」を使うのが一般的でしたが、2015年の6月23日にサービスが終了してからは、フェイスブック「Page Plugin(ページプラグイン)」を使って設置します。

以下では、「Page Plugin(ページプラグイン)」の使い方について詳しく説明していきます。

「Page Plugin(ページプラグイン)」ってどんなの?

フェイスブックページをブログパーツとして設置できるのが「Page Plugin(ページプラグイン)」。

ブログを見ていると、多くのブロガーさんがコレを設置しているのが分かるはずです。

 

実際に、私のフェイスブックページを使ってご紹介していきますね。

例えば下記のような感じのものが、ブログのサイド部分やフッター(記事の下方)などに貼り付けてあるのを見たことがあるという方も多いはずです。

上の画像はタイムラインといって、フェイスブックページ上で投稿したものが見られるタイプの「Page Plugin(ページプラグイン)」を設置した例です。

 

そして、こちらの画像がタイムラインを表示していないタイプです。

縦長にならずスッキリしているので、ブログのどんな場所にも設置しやすいので良く利用される形です。

 

「Page Plugin(ページプラグイン)」設定方法

まずはフェイスブックの「Page Plugin(ページプラグイン)」を開きます。

⇒「ページプラグイン」をクリックすると切り替わります。

 

自分のフェイスブックページのURLを入力

ページプラグインを開くと、項目を入力する所があります。

最初に、自分のフェイスブックページのURLを入力しましょう。

 

入力すると、自分のフェイスブックページ(貼り付けるもの)が自動的に出てきます。

ここから必要に応じて、各項目を入力したり変えたりしていきます。

 

タイムラインを「表示」「非表示」にするには?

タイムラインを表示させたものを設置したいのであれば、「タブ」の部分に「timeline」という文字を入れます。

ただし、timelineの文字は最初から入っている状態なので、表示させたい方は特に何もしなくて大丈夫です。

 

タイムラインを消したいという場合は、タブの「timeline」を削除してください。

そうすると、タイムライン無しのフェイスブックページが出てきます。

 

表示させたいフェイスブックページの「幅」「高さ」を変える

フェイスブックページの表示は、幅(最低:180 最大:500)と調節ができます。

画像では最大の500に設定してみました。

 

かなり横幅が広がって、見ごたえあるフェイスブックページになっています。

人の目に付きやすく、設置しやすい記事下などに設置しやすいサイズではないでしょうか。

 

ちなみに、ブログのサイド部分などに設置する場合は、幅と高さは入力せずオレンジ下線の「plugin containerの幅に合わせる」にチェックを入れた状態にすれば設置時に、自動的に幅を合わせてくれます。

また、高さに付いては「ピクセルの高さ最低70」となっていますが、表示されているのが最大で、このサイズより大きくすることはできませんが、小さくすることは可能です。

 

ヘッダー画像を小さく(スマート)にする

赤下線の「スモールヘッダーを使用」にチェックを入れると、通常のヘッダーの半分ほどの高さ表示になります。

スマートに見せたいときは、ここにチェックを入れるといいでしょう。

 

友達の「顔」表示をOFFにする

上記でタイムラインの非表示の仕方を説明しましたね。

では、友達の顔表示を非表示にしたい場合はどうすればいいのでしょうか。

 

もし、友達の顔を非表示にしたい場合は「友達の顔を表示する」のチェックを外してください。

でもフェイスブックページって、この顔表示がズラーっと並んでいるのがいいんですよね。

 

外してしまうのはちょっともったいない気も・・・。

まだ、友達表示が少ないときは外しておくのもいいかもしれませんね。

 

「Page Plugin(ページプラグイン)」を設置しよう!

上記の設定が終わり、「これだ!」と思うフェイスブックページが出来上がったら、左下にある「コードを取得」をクリックしましょう。

 

この「コードを取得」をクリックするだけで、上記のように設置用のコードが瞬時に自動生成されます。

画像を見るとコードが2段ありますよね。

これを、そのままコピーして2段とも貼り付けます。

 

ワードプレスに貼り付ける

私はワードプレスを利用しているので、ワードプレスを例に貼り付けていきます。

まずは、「外観」⇒「ウィジェット」を選択して、テキストを開きます。

 

開いたテキストの「内容」部分に、コピーしたフェイスブックページのコードを貼り付けるだけです。

貼り付けるときは1段目と2段目の両方を貼り付けて保存してください。

 

これで設置は完了です。

「Page Plugin(ページプラグイン)」は、大きさやスタイルをすぐ設定して、コード取得が可能です。

なので、ブログの場所に応じて見せ方を変えて設置するのも面白いかもしれませんね。