インスタグラムのタイムラインをウェブサイトに埋め込む方法【2025
クリック・ソーシャル

ClickSocialを使ってWordPressから直接ソーシャルメディア投稿をスケジュールする

無料トライアル開始 アングルライト
ホーム ブログ インスタグラムのタイムラインをウェブサイトに埋め込む方法【2025

インスタグラムのタイムラインをウェブサイトに埋め込む方法【2025

インスタグラムのタイムラインをウェブサイトに埋め込む方法

インスタグラムのタイムラインをサイトに埋め込む簡単な方法をお探しですか?

20億人以上のユーザーを持つインスタグラムは、最大のソーシャルメディア・プラットフォームの一つであり、あなたのブランドにとって素晴らしい潜在顧客の供給源である。

しかし、インスタグラムにはすでに多くのコンテンツがあるため、注目を集めるのは難しい。

解決策は? 

インスタグラムのタイムラインをサイトに埋め込むことで、サイトを訪れた人から大量の「いいね!」やコメント、フォローを得ることができる。

まずは、Instagramのタイムラインを埋め込むことでビジネスを成長させる様々な方法を見てみましょう。

あるいは、ここをクリックして直接チュートリアルに飛ぶこともできる。

なぜWordPressにInstagramのタイムラインを埋め込むのか?

多くの人にインスタグラムのコンテンツをチェックしてもらいたいなら、簡単な方法はウェブサイトにタイムラインを埋め込むことだ。

そうすれば、あなたのウェブサイトを訪れた人は誰でもあなたのInstagramの投稿を見て、交流することができます。ウェブサイトの訪問者はすでにあなたのコンテンツに興味を持っているので、あなたのアカウントをフォローする可能性も高い。

インスタグラムのタイムラインフィード例

それは始まりに過ぎない!インスタグラムから関連性の高い写真や動画を見せることで、訪問者を簡単に惹きつけることもできます。

結局のところ、ビジュアルコンテンツは、通常のテキストのみの投稿よりも650%多くのエンゲージメントを獲得する。インスタグラムの投稿をホームページやランディングページに表示することで、ウェブサイトへの滞在時間を長くすることができます。 

そして、人々がより多くの時間をあなたのサイトに費やすようになれば、SEOがより向上し、検索エンジンの結果で上位にランクされるようになります。

そうすれば、あなたのブランドにとってさらに多くの潜在顧客にアプローチすることができる。

インスタグラムのフィード・ランディングページの例

eコマースサイトを運営しているなら、商品を販売するためにショッパブル・インスタグラム・フィードを使うこともできる。

これはオンラインストアを成長させる素晴らしい方法であり、ShopifyやWixのような他のウェブサイトビルダーに対してWordPressが持つ大きな利点です。

全体として、Instagramのタイムラインを埋め込むことは、ビジネスを成長させたいのであれば、効果的な戦略となり得る。

では、インスタグラムのコンテンツをウェブサイトに追加する方法を見てみよう。

インスタグラムのタイムラインをウェブサイトに埋め込む方法

インスタグラムの投稿をワードプレスのウェブサイトに表示するには、まず2つのオプションから選ぶ:

  • 手動で: インスタグラムの各投稿の埋め込みコードを取得し、コードを微調整して、ウェブサイトに1つずつ追加する。
  • プラグインで:WordPressサイトにInstagramの投稿フィードを自動的に表示するプラグインを手に入れよう。

手動の方法を使えば、プラグインなしでインスタグラムのフィードを埋め込むことができるが、かなりの時間と労力がかかる。

結局、すべての投稿のインスタグラム埋め込みコードを個別に取得し、ウェブサイトにコードを挿入しなければならなかった。

多くのカスタムHTMLの埋め込みに対処しなければならないだけでなく、各投稿を埋め込むために2つのサイトを行ったり来たりしなければならない。

インスタグラム用埋め込みコード

しかも、コードを編集しなければ、インスタグラムのエンベッドの見栄えをカスタマイズすることもできない。そのため、インスタグラムのコンテンツが、慎重に選んだウェブサイトのデザインと衝突する可能性がある。

良いニュースは?

これらの問題をすべて回避し、ソーシャルメディアアグリゲータープラグインを使ってタイムラインを埋め込むことができる。プラグインはInstagramのAPIに接続し、自動的に投稿を取得し、あなたのサイトに表示することができます。

そのために使える最高のプラグインがInstagram Feed Proだ。

ベスト・インスタグラム・フィード・プロ・プラグイン

市場で最高のInstagramフィードプラグインとして、あなたは簡単にあなたのウェブサイト上でInstagramの投稿のフィードを表示するために使用することができます。

インスタグラムのタイムラインを埋め込むだけでなく、特定のハッシュタグが付いた投稿や、メンションフィードを表示することもできる。

これらのフィードを使用することで、インスタグラムの写真、ビデオ、リール、インスタグラムストーリーをサイト上で利用することができます。

実際、インスタグラムのフィードを作成し、カスタマイズし、サイトに埋め込むことは、ガイドされたフローに従うことで、わずか数クリックでできる。

Instagram Feed Proは自動的にあなたのサイトのデザインをコピーするので、あなたのフィードは箱から出してすぐにあなたのブランディングに合う。

その上、このプラグインを使ってインスタグラムのフィードをカスタマイズする方法がたくさんある。 

美しいフィードテンプレートのコレクションから選択し、自動的にフィードにデザインを使用することができます。その後、プラグインのビジュアルカスタマイザーを使って、インスタグラムのフィードを詳細に編集することができる。 

ライブフィードエディター インスタグラム

さらに、このプラグインはスピードを念頭に置いて一から設計されている。インスタグラムの動画や写真を好きなだけ埋め込むことができ、サイトはこれまでと同じように高速になります。

最高なのは?

インスタグラム・フィード・プロには、あなたを献身的にサポートするエキスパート・サポート・チームが付属しています。何か問題や質問があるときは、いつでも彼らに連絡することができます。

全体として、それは本当に市場で最高のInstagramフィードプラグインであり、4.9/5つ星の 評価と100万人以上のアクティブユーザーを持っています。

レビュー・インスタグラム・フィード・プロ・プラグイン

Instagramのフィードを作成する準備はできましたか?今すぐInstagram Feed Proを入手しましょう!

それでは、Instagramのタイムラインフィードを埋め込むためにプラグインを使用する方法を以下に見て行きましょう。

インスタグラムのタイムラインフィードをウェブサイトに埋め込む方法(簡単)

以下の簡単なステップを踏むだけで、手間なくInstagramのフィードを埋め込むことができます!

始めよう:

ステップ1:Instagram Feed Proプラグインをインストールする

準備として、まずInstagram Feed Proをこちらから入手し、コンピューターにダウンロードする。

その後、WordPressウェブサイトにインストールして有効化すれば、続行できます。

その方法については、WordPressのプラグインをインストールする方法についての簡単なガイドをご覧ください。

ステップ2:インスタグラムのタイムラインフィードを作成する

フィードを作成するには、プラグインの3ステップのガイドに従ってください。

まず、WordPressのダッシュボードエリアからInstagramのフィード " すべてのフィードメニューを開き、新規追加ボタンをクリックします。

インスタグラムフィードプロ

その後、プラグインは、あなたのサイトに表示したいInstagramフィードのタイプを選択するように尋ねます。インスタグラムのタイムラインの他に、インスタグラムのハッシュタグフィードやメンションフィードを埋め込むことができる。

続行するには、User Timelineフィードタイプを選択し、Nextをクリックします。

ユーザーのタイムラインを選択 インスタグラムのフィードをインポート

ステップ3:インスタグラムのプロフィールに接続する

あなたのビジネスやクリエイターのインスタグラム・プロフィールを接続することで、新しいフィードはあなたのウェブサイト用のソーシャルメディア・コンテンツを取得することができる。

専門家のアドバイスまだビジネスアカウントやクリエイターアカウントを持っていませんか?インスタグラムのアカウントをアップグレードする方法をご紹介します

ここでソースの追加ボタンをクリックして、始めることができます。

インスタグラム、フィードにソースを追加

次に、プラグインは使用したいInstagramの接続タイプを選択するよう求める:ベーシックまたはアドバンス

基本的な 接続を選ぶと、インスタグラムのコンテンツをウェブサイトに表示することができる。

Instagramフィードの種類を増やしたいですか?Instagramのメンション、ハッシュタグフィード、ショッピング可能なInstagramフィードなどを表示するには、ここで高度な接続を選択することができます。

このチュートリアルでは基本的な接続を使用する。

インスタグラムの接続タイプを選択した後、接続ボタンをクリックします。

インスタグラムの接続タイプを選択する

これで、ウェブブラウザでInstagramを開き、アカウントの接続を完了することができる。

下のInstagramとつながるボタンをクリックしてください。

インスタグラムの基本プロフィールに接続する

そうすると、プラグインはあなたのInstagramアカウントへの読み取り専用 アクセスを要求する。

このアクセス権を使って、Instagram Feed ProはあなたのInstagramの情報を見るだけで、変更を加えることは一切できません。このため、すべてのSmash Balloonプラグインは完全に安全に使用できます。

アカウントに接続するには、ポップアップの「許可」 ボタンをクリックします。

インスタグラムの読み取り専用アクセスを許可する

そうすると、Instagram Feed Proはあなたのウェブサイトに戻り、そこでこのアカウントをフィードのソースとして確認することができます。

Next(次へ)」 ボタンをクリックしてください。

インスタグラムのフィードのソースとしてアカウントを確認する

これで、インスタグラムのフィードが作成され、タイムラインに接続されました。新しいフィードを作成するときはいつでも、サイトを離れることなくこのソースを再利用できる。

ステップ4:インスタグラムのタイムラインフィードをカスタマイズする

Instagramのフィードは自動的にあなたのサイトのデザインをコピーするので、すぐに美しく見えます。その上、このプラグインにはたくさんのフィードテンプレートが付属しており、その中から選ぶことができる。

あとはお好みのフィード・テンプレートを選んで、「次へ」ボタンをクリックするだけです。

インスタグラムフィードテンプレート

フィードテンプレートを選択した後、Instagram Feed Proはあなたのウェブサイト上でライブフィードエディタを開きます。

エディターの左側には、フィードのレイアウト、カラースキーム、より多くのボタンデザイン、ヘッダースタイルなどを変更するオプションがあります。

フィード設定を使用すると、節度オプションとフィルタの助けを借りて、ソーシャルメディアフィードをキュレートすることもできます。

また、右側にはインスタグラムのフィードのライブプレビューが表示され、リアルタイムで変化を確認することができる。

インスタグラム・フィード・プロ用ライブ・フィード・エディター

インスタグラムのタイムラインのデザインを始める準備はできていますか?

まず、フィードレイアウトオプションを クリックして開始します。

フィードレイアウトオプションをクリック

このプラグインは、Instagramのタイムラインを4つの異なるレイアウトから選択するよう求める:

  • グリッド
  • カルーセル
  • 石工
  • ハイライト

以下、これらのレイアウトを詳しく見ていこう。

フィード・レイアウト・オプション・インスタグラム・フィード・プロ

インスタグラムの投稿を一度にたくさんウェブサイトに表示したい場合は、グリッドレイアウトを 使うことができる。

そうすることで、写真や動画がサイト上に整然と並んだ状態で表示される。

インスタグラムフィードのグリッドレイアウト

次に、あなたのタイムラインをInstagramのカルーセルスライダーに変えるカルーセルレイアウトがあります。

その結果、訪問者はあなたの投稿をチェックするためにスライドと対話することができます。

ライブ・インスタグラム・フィード用のカルーセル・レイアウト

インスタグラムのフィードに投稿を元の比率で表示したいですか?

その場合は、石積みの レイアウトをクリックしてください。

インスタグラム・フィード

最後に、キャプションや「いいね!」を削除し、ビジュアルコンテンツに焦点を当てたハイライトレイアウトがある。

さらに、このレイアウトを使えば、インスタグラムのギャラリーの特定の投稿をよりはっきりと見せることができる。

インスタグラム・フィード・ハイライト・レイアウト

ここでフィードのレイアウトを選んだら、「保存」をクリックして変更を確定します。

フィードのデザインを続けるには、カスタマイズ ボタンを選択します。

インスタグラムの主なカスタマイズオプションに戻る

ライブフィードエディタを使って、インスタグラムのタイムラインフィードの色を設定できるようになりました。

そのためにはまず、ここで配色 オプションをクリックする。

配色オプションを選択

簡単に色を設定できるように、Instagram Feed Proには4つの異なるカラースキームが用意されています:

  • テーマからの継承:WordPressテーマの色を自動的にコピーする。
  • 明るい:明るい背景と暗い文字色を表示
  • ダーク:明るい文字色と暗い背景を選ぶ。
  • カスタム:すべてのフィードカラーを手動で選択

お好みの配色を選択し、「保存」をクリックします。

インスタグラム・ライブフィードの配色オプション

ライブフィードエディタの残りのオプションを使用すると、ヘッダのスタイル、フォローボタン、より多くのボタン、ライトボックス、フィードのサイズなどをカスタマイズすることができます。

インスタグラムのタイムラインフィードの見た目に満足したら、「保存」をクリックする。

ステップ5:Instagramのタイムラインフィードをウェブサイトに埋め込む

Instagram Feed Proプラグインはとてもユーザーフレンドリーなので、簡単にフィードを埋め込むことができます - 複雑な埋め込みコードは必要ありません。

フィードを埋め込むには、2つの方法があります:

  • ワードプレスのページ
  • ワードプレスのサイドバーまたはフッター

以下、この2つの方法を見てみよう:

インスタグラムのタイムラインをワードプレスのページに埋め込む

まずは、エディター上部の埋め込み ボタンをクリックしてください。

インスタグラムの埋め込みボタンをクリック

そうすると、プラグインはインスタグラムのフィード埋め込みオプションをポップアップで表示します。このポップアップには、あなたがコピーできるフィードのショートコードもあります。

このフィードをページに追加するので、「ページに追加 」オプションをクリックします。

インスタグラムのライブフィードをページに追加

その後、プラグインはあなたのサイトのすべてのWordPressページを表示します。

続行するには、リストからページを選択し、「追加」をクリックします。

インスタグラムのライブフィードを埋め込むページを選択

そうすると、WordPressのエディターでそのページが開きます。ここから、便利なWordPressブロックを使うだけで、フィードを埋め込むことができます。

新しいコンテンツブロックを追加するには、エディタのプラス(+)アイコンをクリックします。

ワードプレスに新しいコンテンツブロックを追加する

次に、上部の検索バーを使って「instagram」ブロックを検索する。

次に、下の検索結果からInstagram Feedブロックをクリックして進む。

インスタグラムのフィードブロックをワードプレスのページに埋め込む

最後にPublishを クリックし、Instagramのタイムラインをウェブサイトに埋め込み完了です。

ご覧の通り、このプラグインを使えば、WordPressサイトにInstagramの投稿を追加するのがとても簡単になる。ウェブページを開くと、フィードがどのように表示されるかがわかります。

インスタグラムのライブフィード例

それでは、次にインスタグラムのフィードを埋め込む方法をチェックしていきましょう。

WordPressのサイドバーまたはフッターにInstagramのタイムラインを埋め込む

Instagramウィジェットを使えば、ウィジェットのサイドバーやフッターエリアにタイムラインの投稿を表示することもできる。

そのために、プラグインのライブフィードエディターを使うことができる。

ライブフィードエディタを再び開くには、まずダッシュボードからInstagramのフィード " すべてのフィード メニューに移動します。

このページで、作成したインスタグラムのタイムラインフィードをクリックします。

インスタグラムのフィードを開く

これで、ライブフィードエディターにフィードが再び表示されます。

続けるには、エディターの右上にある埋め込み ボタンをクリックしてください。

インスタグラムの埋め込みボタンをクリック

すると、Instagramフィードの埋め込みオプションのポップアップが表示されます。

ウィジェットに追加 ボタンをクリックして、続行することができます。

インスタグラムのライブフィードをウィジェットに追加

これは、WordPressのすべてのウィジェットを管理するために使用できるウェブサイトのウィジェットページを開きます。ここから、Instagramウィジェットのサイドバーまたはフッターを選択できます。

インスタグラムの投稿をサイドバーに表示するには、こちらのサイドバーパネルをクリックしてください。

サイドバーパネルを開く

この例では、ウィジェットにサイドバーを使用します。

インスタグラムのタイムラインをウェブサイトの下部に表示するには、フッターパネルを クリックします。

フッターパネルを開く

最後に、下部にあるプラス(+)アイコンをクリックして、新しいWordPressウィジェットを追加できます。

その後、フィードを埋め込むためのオプションからInstagramフィードウィジェットを クリックします。

サイドバーにインスタグラム・ウィジェットを追加する

あとは更新ボタンをクリックするだけで、あなたのウェブサイトにタイムラインフィードが掲載されます。

あなたのウェブサイトを開くと、このスクリーンショットのようにInstagramのフィードウィジェットが表示されます:

サイドバーのインスタグラム・ライブフィードの例

そうだ!

HTML、カスタムCSS、Javascript、その他のコードは必要ありません。

そうすれば、ブランドのインスタグラムの存在感を高め、大量のインタラクションを獲得し、インスタグラムからの社会的証明によってコンバージョンを伸ばすことができる。

Instagramのタイムラインを埋め込みたいですか?こちらからInstagram Feed Proを入手してください

ここにいる間に、最高のインスタグラムマーケティングのヒントのリストもご覧ください。

この記事が役に立ったなら、ツイッターや フェイスブックで私たちとつながって、もっと役に立つチュートリアルを楽しんでください。

著者アバター
サジャン・シャルマ シニアライター
WordPress、ソーシャルメディアマーケティング、オンラインビジネスについて10年以上執筆。専門分野はインフルエンサーマーケティング、コンテンツキュレーション、デジタルマーケティング戦略など多岐にわたる。

コメントを追加する

コメントをお寄せいただきありがとうございます。すべてのコメントはプライバシーポリシーに従って管理され、すべてのリンクはnofollowであることにご留意ください。名前欄にはキーワードを使用しないでください。個人的で有意義な会話をしましょう。