WordPress ブログ

【WordPress】Facebookページをブログに貼り付ける方法

更新日:

Facebookページは、会社やお店の宣伝をするのに効果的です。

Facebookページのタイムラインをブログに貼り付けることで、検索からブログに訪れた人に「いいね!」を押してもらえたら、継続的にブログを見にきてもらうチャンスにもなります。

ワードプレスにFacebookページを貼り付ける方法を記載します。

貼り付け用コードを取得する

貼り付け用コードの取得はFacebookデベロッパーのページから行います。

https://developers.facebook.com

Facebookデベロッパーズ

右上にログインボタンがありますが、コードの取得はログインしなくてもOKですので、上部にあるタブの「ドキュメント」をクリックします。

ワードプレスにFaecebookページを貼り付ける方法

画面を下の方にスクロールさせると「ソーシャルプラグイン」という項目がありますので、クリックします。

ワードプレスにFaecebookページを貼り付ける方法

「ページプラグイン」をクリックします。

http://7ワードプレスにFaecebookページを貼り付ける方法

「ウェブ」というボタンをクリックしてください。

ワードプレスにFaecebookページを貼り付ける方法

このページで埋め込みコードを取得します。

ワードプレスにFaecebookページを貼り付ける方法

「FacebookページのURL」という項目にURLを記載すると、自分のページが下に表示されます。

いいね!した人の顔を表示したい場合は、「友達の顔を表示する」にチェックを入れれば表示されます。

少し下にスクロールすると「コードを取得」というボタンがあるので、クリックします。

ワードプレスにFaecebookページを貼り付ける方法

ポップアップウィンドウが開かれ、コードが表示されます。

ワードプレスにFaecebookページを貼り付ける方法

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

貼り付け用コードが表示された画面を表示したまま、別タブでワードプレスを開きます。

<Step1>と<Step2>で2つのコードが出てきたように、ワードプレス側も2箇所に貼り付けが必要です。

<Step1>のコードを貼り付ける

テーマ編集から【header.php】の<head>タグ内に貼り付けます。

わたしはプラグインを利用しました。

「Head, Footer and Post Injections」というプラグインです。

プラグインをインストールしたら、設定画面より「Header and Footer」という項目をクリックします。

ワードプレスにFaecebookページを貼り付ける方法

でてきた画面にFacebookデベロッパーズで出てきた<Step1>のコードを貼り付けます。

ワードプレスにFaecebookページを貼り付ける方法

<Step2>のコードを貼り付ける

次に<Step2>のコードの貼り付けです。

常に表示させておきたい場合は、サイドバーやFooterに貼り付けておくと良いでしょう。

その際、ウィジェットを使用します。

ワードプレスにFaecebookページを貼り付ける方法

テキストウィジェットを貼り付けたい場所に追加します。

わたしは「フッター右」に追加しました。

ワードプレスにFaecebookページを貼り付ける方法

<Step>2のコードを貼り付けます。

ワードプレスにFaecebookページを貼り付ける方法

フッターを確認すると、このように貼り付けられていました。

ワードプレスにFaecebookページを貼り付ける方法

まとめ

Facebookページをワードプレス内に貼り付ける方法を記載しました。

header.phpのファイルにコードを書き込む必要がありますが、プラグインを使えば簡単にできます。

ぜひTryしてみてください。

投稿者プロフィール

七星 奈津子
七星 奈津子

ブログ集客プロデューサー/ライター/コラムニスト


読者(消費者)との関係をつくり、集客や販売につなげる発信で5年10年後もお客様に愛される会社・お店づくりのためのメディアづくりをサポートしている。


これまで発信してきたもの、持っているコンテンツをわかりやすく見やすい形に編集してコーディネイトすることを得意とする。またコミュニケーションの中で、その人の中にある光るもの・強みを引き出すことも得意。


講座や個別サポートでは、その人ならではの魅力を引き出し、わかりやすく伝わりやすい言葉にして発信するお手伝いをしている。


▶︎詳しいプロフィールはこちらから

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

Twitter で

-WordPress, ブログ

Copyright© 7stars725.com , 2018 All Rights Reserved.