るしるし

元バンドマンが音楽活動再開して余生を生きてます

SNS

Facebookページプラグインの作成と設置方法について。

更新日:

 

るしる(@646blog)です。

今日はサイトにfacebookのページプラグインというものを設置したので、作り方から設置方法までメモしておきます。

 

Facebookページプラグインって何?ってことやねん。

「Facebookページプラグイン」とは、

  • サイトで自分のfacebookをアピールできる。
  • Facebookを開かなくても、プラグインで「いいね」や「シェア」をしてもらえるようにする。

 

「Facebookページプラグイン」作成方法

 

まず、プラグインを生成するサイトを開きます→page plugin

1

 

必要事項を入力していきます。プレビュー表示もされますので、見ながら作って行きましょう。

 

FacebookページのURL (Facebook Page URL)

FacebookページのURLを入力

タブ(Tabs) 

3つの用途を選べるようになりました。

  • [タイムライン]タブ: Facebookページのタイムラインにある、最新の投稿が表示されます。
  • [Events]タブ: プラグインからページのイベントをフォローしたり、イベントのフィードを購読したりできます。
  • [メッセージ]タブ: ウェブサイトからFacebookページにメッセージを直接送信できます。この機能を使用する場合、利用者はログインが必要になります。

facebook developersより引用

必要なければ、未入力でOKです。

幅(Width

180~500pxの間で設定

高さ(Height

70px以内で設定

(Use Small Header)

ヘッダーを小さくする、しない

Adapt to plugin container width)

チェックを入れると幅を自動で調整する、しない

Hide Cover Photo)

ヘッダーでカバー写真非表示、表示

Show Friend’s Faces)

「いいね」した友達のプロフィール写真の表示、非表示

 

 

入力、チェックが終わったら、最後に「コードを取得 (Get cord)」をクリックします。

 

「Facebookページプラグイン」コードについて。

 

コードを取得すると、このような画面が。

2

 

上段のコードは、サイト内のbodyタグ内で1度だけ呼び出せばOKです。

下段のコードはページプラグインパーツを表示させたい部分に貼り付けます。

このコードはコピーして保存しておくと良いでしょう。

 

「Facebookページプラグイン」の設置

 

私はWordpressを使っているので、今回サイトのサイドバーに設置してみました。

WordPressダッシュボードから、「外観」→「ウィジェット」を開き、テキストを新規でサイドバーにドラッグで追加します。

3

 

先程コピーしたコード、両方を貼りつけ、保存をクリックするだけです。

サイドバーへの設置はとっても簡単。

 

まとめ

 

このプラグインはサイドバー以外にも投稿記事の下など、いろんなところに設置できます。

またプラグインを作成したFacebookのページで、「いいねボタン」「シェアボタン」などいろんなツールが作成できるので、サイト作りの必要に応じて作成してみてください。

おつかれさまでした。

 

この記事が気に入ったら
いいね ! しよう

Twitter で

    関連記事    

-SNS
-, ,

Copyright© るしるし , 2017 AllRights Reserved Powered by AFFINGER4.