「自分のWebサイトにFacebookのページを記載したい」と思ったことはありませんか？インターネットを検索してみると、ブログのプロフィール部分に自身のFacebookページを載せているのを度々見かけることでしょう。

「埋め込みには、なにか専門的な知識がいるのでは……」と思っている方もおられるでしょうがそうではありません。

この記事では、

  • Facebookの投稿をWebサイトに埋め込む手順
  • FacebookページをWebサイトに埋め込む手順

の2つを紹介します。

Webマーケティングのeラーニングサービス「ferret Learning」でデジタルに強い組織に

【無料トライアルあり】動画でSNSマーケやWeb集客を学ぶ！Webマーケター育成サービス「ferret Learning」

約300の動画授業でWebマーケティングスキルアップ！学習進捗管理や演習機能、理解度の見える化機能などの学習支援機能を多数搭載

公式サイトはこちら

Facebookの投稿をWebサイトに埋め込む手順

まずは、Facebookの投稿をWebサイトに埋め込む手順を紹介します。難しいと思われがちな埋め込みですが、専用のコードを取得し、Webサイトに貼り付けることで対応可能です。

Facebookから埋め込みコードを取得

まずはFacebookにログインし、Webサイトに埋め込みたい投稿を表示します。右上をみると、「…」このようなアイコンがあるので、そちらをクリックします。

クリックすると、「リンクを保存」という表示の下に「埋め込み」という項目が表示されるので、そちらをクリックしてください。

そのあと、「このコードをコピーして、ウェブサイトに貼り付けてください」と表示されるので、すぐ下にあるコードをコピーしましょう。次の「埋め込みコードをHTMLに貼り付け」で使います。

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

上記でコピーした埋め込みコードをWebサイトのHTMLに貼り付けましょう。

おそらく、Facebookの投稿はWebサイトの記事コンテンツに入れることが多いはず。Facebookの投稿を挿入したい箇所にコピーしたコードを貼り付けます。

この時に注意してほしいことは、ビジュアル画面で貼り付けをしないということです。

WordPressを使っている方は特に注意して欲しいのですが、文章の装飾がリアルタイムでできるビジュアルエディターと、コードを入力するコードエディターがあります。

埋め込みコードはHTMLコードなので、ビジュアルエディターで貼り付けしてもWebサイトに反映することはありません。必ず、コードエディターに貼り付けるようにしましょう。