WordPress最適化

WordPressのサイドバーにFacebookを埋め込む方法

Facebookページ埋め込み画像

 

こんにちは。
必死に張り切る ひしはり です。

 

ひしはり
ひしはり
WordPressのサイドバーに
Facebookのタイムラインを埋め込むには
どうしたらいいの?

本記事では
このような疑問にお答えします。

 

本記事の内容

❶ WordPressのサイドバーにFacebookを埋め込む方法

❷ ブログ運営に欠かせない「SNS」との連携

 

ブログでの収益化を目的とした
多くの方が「WordPress」を使って
自分のブログを運営されています。

ブログで収益化する上で
欠かせないのが
「SNS」との連携です。

本記事を読めば、
そんなSNSの代表格である
「Facebook」のタイムラインを
WordPressブログのサイドバーに
埋め込む方法がわかります。

わかりやすく画像付きで
解説していますので、
ぜひ、あなたのブログにも
「Facebook」のタイムラインを
埋め込んで、より多くの読者に
あなたの発信が届くように
連携させてくださいね。

 

この記事を書いている人

この記事を書いている私はブログ歴4年目

現在は本業のサラリーマンの傍ら副業ブロガーとして活動しています。

Twitter(ひしはり人生再構築ブロガー)のフォロワーは1800人ほど。

WordPressのサイドバーにFacebookを埋め込む方法

Facebookの男性の画像

 

「WordPress」のサイドバーに
「Facebook」を埋め込む方法は
とてもかんたんです。

「Facebook」を埋め込むための
コードをコピーして
それを「WordPress」
サイドバーウィジェットに
貼り付けるだけです。

 

WordPressのサイドバーにFacebookを埋め込む方法

① Facebookを埋め込むためのコードをコピー

② WordPressのサイドバーウィジェットにそのコードを貼り付け

 

ひしはり
ひしはり
画像付きでわかりやすく
ご紹介しますので安心してくださいね。

 

それではさっそく始めて行きましょう。

① Facebookの埋め込み「コード」を取得

 

まず、「WordPress」のサイドバーに
「Facebook」を埋め込むためには
「Facebook」のアカウントが必要です。

まだアカウントをお持ちでない方は、
まずは以下の記事を参考に
アカウント作成をどうぞ!

 

Facebookページの画像
実名じゃなくても利用OK?「Facebookページ」の作成方法ビジネス向けSNS「Facebookページ」の作成方法を知りたいですか?本記事ではビジネス向けとしてブログなどと「Facebook」を連携させたい場合に「Facebook」を個人用とは別で作成できる方法をご紹介しています。ビジネス向けSNS「Facebookページ」の作成方法を知りたい方はぜひ、記事をご覧ください!...

 

すでにアカウントをお持ちの方は、
最初に「WordPress」のサイドバーに
「Facebook」を埋め込むための
「コード」を取得する必要があります。

「コード」を取得するには、
「Facebook for Developers」
アクセスして各種設定を
行なっていきます。

 

 

画面が移動したらそこに
「ページプラグイン」
大きく表示されていますが、
これはWordPressで使用している
「プラグイン」とは、
まったくの別ものになります。

 

Facebookページ埋め込みの画像

 

「Facebook」
「ページプラグイン」は、
サイトやブログに「Facebook」
埋め込むための「コード」
自動で生成してくれる
便利なサービスツールです。

サイトやブログに
訪問してくれた読者は、
「Facebook」での操作と同様に
サイトやブログに埋め込まれた
「Facebook」のタイムラインに
直接「いいね!」したり
「シェア」したりすることができます。

「いいね!」したり
「シェア」したりするために
本来のようにサイトやブログを
離れる必要がありません。

 

ひしはり
ひしはり
それによって離脱率を抑えられてアクセスアップや
滞在時間アップにつながる可能性が高くなります。

 

それではまず、
画面に表示されている各項目の
設定を行なっていきます。

 

Facebookページ埋め込みの画像

 

「FacebookページのURL」には、
あなたがサイドバーに表示させたい
「Facebook」「URL」を入力します。

「URL」とは
「http://」「https://」
などから始まる文字列のことです。

サイトやブログを開いたときに
画面の上部に「鍵マーク」とともに
表示されていることが多いです。

「http://」「https://」
省略されて表示されていますので、
その部分をクリックすれば
「http://」「https://」形式で
表示されます。

タブは
「timeline(タイムライン)」
表示させますので
そのままでOKです。

幅と高さは
表示させたいサイズを
「任意」で入力します。

すぐ下に
「プレビュー」が表示されますので
表示サイズのイメージを
確認することができます。

次に以下の「表示設定」ですが、
この部分はお好みになって来ますので、
それぞれ気に入った設定を
選んでみて下さい。

ここもチェックを入れることで
「プレビュー」が表示されますので
違いを確認しながら選びましょう。

 

Facebookページ埋め込みの画像

 

「スモールヘッダーを使用」
チェックを入れた場合

 

Facebookページ埋め込みの画像

 

「カバー写真を非表示にする」
チェックを入れた場合

 

Facebookページ埋め込みの画像

 

「plugin containerの幅に合わせる 」
チェックを入れた場合

PC/スマホでサイズを
それぞれ自動調整してくれます。

 

ひしはり
ひしはり
ここはチェックを入れておくようにしましょう。

 

「友達の顔を表示する」
チェックを入れた場合

 

Facebookページの埋め込みの画像

 

ここにチェックを入れると
画面に「いいね!」をしてくれた人の
プロフィール写真が表示されます。

 

ひしはり
ひしはり
私の場合は友達がまだ
一人もいませんので
表示はされていません(泣)

 

各種設定が終わりましたら、
「コードを取得」をクリックします。

 

Facebookページの埋め込みの画像

 

画面が移動して
「コード」が表示されますので、
「ステップ2」「ステップ3」
「コード」をコピーします。

 

コードの画像

 

以上で「コード」の取得は
完了となります。

② WordPressに埋め込みコードを貼り付け

 

続いて取得した「コード」
「WordPress」
貼り付けて行きます。

「WordPress」
「ウィジェット」を使って
「コード」を貼り付けて行きますので、
まずは「WordPress」の管理画面から
「外観」「ウィジェット」の順に
クリックします。

 

Twitter埋め込みの設定の画像

 

続いて左側の
「利用できるウィジェット」の中から
「テキスト」をクリックして選びます。

 

Twitter埋め込みの設定の画像

 

するとプルダウン式の
メニューが開きますので、
その中から「サイドバーウィジェット」
選択して「ウィジェットを追加」
クリックします。

 

Twitter埋め込みの設定の画像

 

すると右側の
サイドバーの項目の場所に
新たに設定用の「テキスト」
ウィンドウが開きますので、
各種設定を行なっていきます。

まず「テキスト」「タイトル」は、
「Facebook」「フェイスブック」
などと入力しましょう。

 

Facebookページの埋め込みの画像

 

この「タイトル」が実際に
ブログ画面に表示されることになります。

次に「テキストモード」
切り替えてから
先ほどコピーした「コード」
貼り付けます。

ここで注意しなければいけないのが、
「ビジュアルモード」のままで
気づかずに「コード」を貼り付けても
表示されませんので、
必ず「テキストモード」に切り替えてから
貼り付けるようにして下さい。

貼り付けが終わったら
「保存」をクリックします。

 

コードの画像

 

これで設定が完了となり
「Facebook」のタイムラインを
「WordPress」のサイドバーに
埋め込んで表示させることができました。

設定が完了したら必ず
実際の画面でイメージどおりに
表示されているかを
確認するようにしましょう。

また今回ご紹介した
「Facebook」同様に
「Twitter」のタイムラインを
「WordPress」
サイドバーに埋め込むことも可能です。

「Twitter」のタイムラインの
埋め込みに関しても
こちらの記事でわかりやすく
画像付きでご紹介していますので、
合わせてぜひ、参考にどうぞ!

 

Twitterのお皿の画像
WordPressのサイドバーにTwitterを埋め込む方法WordPressブログのサイドバーにTwitterを埋め込む方法を知りたいですか?本記事ではWordPressブログのサイドバーにTwitterを埋め込む方法を画像付きでわかりやすくご紹介しています。WordPressブログのサイドバーにTwitterを埋め込む方法を知りたい方はぜひ、記事をご覧ください!...

 

ブログ運営に欠かせない「SNS」との連携

ソーシャルネットワークの画像

 

サイトやブログ運営を
行なっていく上で、
「Facebook」「Twitter」
といった「SNS」との連携は
もはや欠かせない重要なものです。

「ブログ」「SNS」とを
連携させることによって
より効率よく集客ができたり、
自分のサイトやブログの存在を
より多くの方に知ってもらえる
可能性が高まります。

新しいブログ記事をアップする度に
「SNS」でブログを更新したことを
発信してフォロワーに告知することで
集客効果が期待できます。

中にはさらにその先の
フォロワーご自身のフォロワーに対して
拡散してもらえる可能性も期待できます。

そんな「SNS」の拡散力を
うまく活用して行きたいものですね。

実際の私のブログ画面では、
以下のような感じで表示させています。

 

Facebookの埋め込み画像

 

今回ご紹介した様に
「WordPress」のサイドバーに
「Facebook」のタイムラインを
埋め込む方法は
とてもかんたんですので、
ぜひとも行なっておきましょう。

 

「Facebook」のアカウントを
まだお持ちでない方は、
以下の記事に作成方法を
わかりやすく画像付きで
まとめていますのでぜひ、参考にどうぞ。

 

Facebookページの画像
実名じゃなくても利用OK?「Facebookページ」の作成方法ビジネス向けSNS「Facebookページ」の作成方法を知りたいですか?本記事ではビジネス向けとしてブログなどと「Facebook」を連携させたい場合に「Facebook」を個人用とは別で作成できる方法をご紹介しています。ビジネス向けSNS「Facebookページ」の作成方法を知りたい方はぜひ、記事をご覧ください!...

 

「Facebook」は基本的に
実名での運営になりますが、
ビジネス用の
「Facebookページ」のほうで
アカウントを作成すれば、
実名以外での運営ができますよ!

ちなみに私の場合は
「Facebookページ」
「ひしはり」として運営しています(笑)

まとめ

 

今日は「WordPress」
サイドバーに
「Facebook」のタイムラインを
埋め込む方法をご紹介しました。

初心者の方にとっては、
「WordPress」「SNS」
連携と聞くだけで
むずかしく感じるかもしれません。

しかし「Facebook・Twitter」ともに
とてもかんたんに連携させることが
できますのでぜひ、
ブログを立ち上げて早い段階で
連携させるようにしましょう。

「ブログ」「SNS」との
連携を最大限に活かして行きたいと
必死に張り切る ひしはり でした。
今日は、ここまで。

関連記事