【Web担当者向け】WebサイトにFacebookの投稿を埋め込める!?

フォーザウィン社員発のIT業界にまつわる豆知識。
「フォーザウィンアカデミー」

HOMEフォーザウィンアカデミー 〉【Web担当者向け】WebサイトにFacebookの投稿を埋め込める!?

【Web担当者向け】WebサイトにFacebookの投稿を埋め込める!?

shutterstock_173594528

ブログ記事などを書いているときに自身のFacebookの投稿をそのままブログに貼り付けたいと思ったことはないでしょうか。
Facebookの投稿を埋め込むのは何か専門的な知識が必要で難しいのでは?と感じでいる方も多くいらっしゃいますが実は簡単にFacebookの投稿を埋め込むことができます。
今回はWebサイトにFacebookの投稿を埋め込む方法をご紹介いたします。

もくじ

  1. Facebookの投稿をWebサイトに埋め込む方法
  2. FacebookページをWebサイトに埋め込む方法
  3. 埋め込む際の注意点
  4. まとめ

 

◆Facebookの投稿をWebサイトに埋め込む方法

まずはFacebookにログインします。
次にWebサイトに埋め込みたい投稿を開きます。画面右上に「…」のマークがあるのでクリックします。
その中に「埋め込み」という項目があるので選択します。
「このコードをコピーして貼り付けてください」と表示されたらすぐ下にあるHTMLコードをコピーします。
投稿を埋め込むWebサイトを開き、埋め込みたい場所に先ほどコピーしたHTMLコードを貼り付ければ完成です。

◆FacebookページをWebサイトに埋め込む方法

まずはFacebookの「ページプラグイン」を開きます。
「FacebookページのURL」や「タブ」と記載された入力フォームが表示されるので「FacebookページのURL」にFacebookのマイページURLを貼り付けます。埋め込みたいページがプレビュー画面で表示されるので確認します。
プレビュー画面のすぐ下に「コードを取得」がでるので「IFrame」を選択します。
<iframe>から始まるコードがあるのでコピーします。コピーしたコードを埋め込みたいサイトのHTMLに貼り付ければ完成です。

◆埋め込む際の注意点

・横幅サイズ制限
Facebookの埋め込みサイズには横幅制限があります。
・横幅が180px~500px
横幅が500px以上だとうまく表示されないので注意しましょう。

・個人情報
Facebookのページには「いいね!」がついている場合があります。そのまま埋め込むと「いいね!」したユーザーの情報もそのまま掲載されてしまいますので注意が必要です。
「いいね!」したユーザーを表示させない方法は、Facebookのアカウント画面から「アプリ」をクリック。「編集」のボタンリンクをクリックし、「Tum Platform Off」と表示される部分を「Disable Platform」に設定すれば非表示されます。

 

◆まとめ

難しそうに思えるFacebookの埋め込みですがやり方を覚えてしまえば簡単にWebサイトに埋め込むことができます。
今回はFacebookの投稿とページの埋め込み方法についてご紹介しましたが、この2つは埋め込み方法が異なるので間違えないよう注意してください。
ブログなどにFacebookの投稿を埋め込むことで自身のFacebookの宣伝にもつながります。
ぜひこの方法を活用してコンテンツを充実させましょう。

フォーザウィンはIT業界で働く仲間を募集しています!
経験、未経験は問いません。是非当社の採用情報をご覧ください。
採用情報を見る >

最新記事

2020.07.10
2020.07.03
2020.06.26
2020.06.19
2020.06.17

カテゴリー

TOP