企業担当者様向けWordPressの相談室

HOME ご相談

WordPressサイトにTwitter、Facebook、Instagram投稿の埋め込み(タイムライン表示)をしたい

運用しているWordPressサイトにSNSの投稿やタイムラインを埋め込みたく思っています。どうすればよいでしょうか?

最終更新日:2022.11.22

Director
拡散性を高めるために、WordPressサイトにSNSの投稿やタイムラインを埋め込みたいというご要望はよくお聞きします。方法は複数ありますが、その代表的なものをご紹介します。Twitter、Facebook、instagramの場合でご紹介します。
回答者:エンジニア

Twiiterのツイートやタイムラインを埋め込む方法

WordPressにTwitterを埋め込みする方法はいくつかあります。

まずは、WordPressの「ブロック」機能を使用する方法です。

投稿編集画面の左上にあるツールバーの「+」マークを押下してブロックを表示させます。

ブロックを下にスクロールすると「Twitter」の項目がありますので選択してください。

追加されたTwitterブロックの入力欄に、埋め込みたいツイートのURLを貼り付けて「埋め込み」を押下すると完了です。

また外部ツール「Twitter Publish」を使用してWordPressにTwitterを埋め込む方法があります。

Twitter Publish」を開き、入力欄にプロフィールのURLを貼り付けてください。

表示形式の選択画面で「Embedded Timeline」を選択します。

すると埋め込みコードが表示されますので、そのまま埋め込む場合には「Copy Code」を、表示を変更する場合には「set customization options」をクリックしてください。

「set customization options」をクリックすると、Twitterのライトモードとダークモードの選択、言語の選択のほか、表示幅、高さのピクセル値が設定できます。

設定が済んだら「Update」をクリックし、「Copy Code」をクリックすると埋め込みコードを取得できます。

取得したコードをHTML編集画面に貼り付ければ、タイムラインを埋め込むことができます。

Facebookの投稿を埋め込む方法

FacebookもTwiiter同様に外部ツールを使用することで、簡単にWordPress上に投稿を表示させることができます。

Facebookでは「ページプラグイン – ソーシャルプラグイン」を使用します。

表示されたページにて、以下の入力項目を入力して「コードを取得」ボタンを押します。

  • FacebookページのURL:表示するFacebookのURL
  • タブ:timeline
  • 幅:任意の幅(px)※180~500の範囲内
  • 高さ:任意の高さ(px)※70以上を設定

入力が完了しましたら「コードを取得」をクリックします。

すると埋め込み用のコードが表示されるので「IFrame」を選択し、コードをコピーして埋め込みコードの取得が完了です。

取得したコードをHTML編集画面に貼り付ければ、タイムラインを埋め込むことができます。

Instagramの投稿を埋め込む方法

Instagramに関しては一覧の埋め込みコードを取得することが出来ないので、WordPressサイトに表示させるにはAPIでデータを取得して実装する方法、プラグインを使用する方法があります。

APIに関しては専門的な知識が必要なため、開発者でなければ実装は難しいため、ここではプラグインを紹介します。

Director

InstagramのAPI連結による埋め込みも弊社では実装実績がありますので、ご興味のある方はぜひ「相談してみる」よりご相談ください。

Instagramの投稿を表示できるプラグインを2つ紹介します(詳細な使用方法は省略いたします)。

Smash Balloon Social Photo Feed

  • 簡単にセットアップが可能
  • レスポンシブ対応
  • 写真の幅、高さ、写真の枚数、列数、画像サイズ、背景色、画像の間隔などをカスタマイズ可能
  • 「もっと読み込む」ボタンで、Instagram の写真を無限に表示可能
  • 無料で使える

Combine Social Photos

  • 高いカスタマイズ性
  • スライダー対応可能
  • 無料で使える

以上が、WordpressにTwitter、Facebook、Instagram投稿を表示する方法でした。

複数のSNSをひとまとめに表示することができたり、ウェブサイトからフォロワーを獲得できるメリットなどがあります。

SNSの埋め込みをご検討の方で、依頼先を探しているという方は、お気軽に弊社にご相談ください。

こちらの記事を閲覧した方は
以下も閲覧しています
WordPressで「お知らせ(NEWS)」の任意の記事を常時掲載したい
既存のWordPressサイトが、ブロックエディタにならない
記事が役に立った!という方は
「Good Job」ボタンを!
無料
企業担当者様 必読!
WordPressサイト改修のための事前チェックシート

安全に効率よくWordPressサイトを「改修」するためのポイントをまとめました。

ダウンロードはこちらから
  • 事前チェックシート1
  • 事前チェックシート2
  • 事前チェックシート3
  • 事前チェックシート4
  • 事前チェックシート5

CONTENTS

企業の方の相談

企業の方の相談

企業関連のWordPressサイトのお悩みは、大別すると6つのジャンルに分けられます。

リニューアル

サーバのスペック不足やPHPのバージョンアップ等、WordPressのサイト移設(引っ越し/リニューアル)に関するよくあるお悩みをまとめました。

コンテンツ更新(操作)

「新たな更新機能を実装したいけど、どうしたらいいかわからない……」。プラグイン関連も含めてコンテンツ更新に関するお悩みをまとめました。

バージョンアップ

WordPress本体やプラグインのバージョンアップなど、WordPressの場合、「バージョンアップ」のお悩みは尽きません。こちらにまとめました。

SEO(集客)

ホームページ開始時にはあまり意識していなかった「SEO」。でも今になってその重要性に気づいてきた…。WordPressサイトと「SEO」についてまとめました。

セキュリティ

動的CMSであるWordPressの宿命ともいえる「セキュリテイ」問題(脆弱性)。ただし、問題のポイントを理解すれば回避する方法はいくらでもあります。

その他

どこのカテゴリーに収めたらよいか迷った「お悩み」をこちらにまとめました。

個人事業の方の相談

個人事業の方の相談

個人事業主様のWordPressサイトのお悩みは、大別すると4つのジャンルに分けられます。

SEO(集客)

「集客」に強いWordPressテーマです……とすすめられて導入したけど、その仕組や強化方法についてもっと詳しく知りたい。そんなお悩みをまとめました。

カスタマイズ・機能追加

サービス形態の変更にともなってカレンダータイプの「予約機能」を取り入れたくなったり…。カスタマイズや機能追加に関するお悩みをまとめました。

保守

月額払いとなることが多いWordPressの「保守契約」。コストを下げたいから契約はしていないという方も多いと思います。「保守」に関するお悩みをまとめました。

その他

どこのカテゴリーに収めたらよいか迷った「お悩み」をこちらにまとめました。

Page Top