インスタグラムの投稿をワードプレスのウェブサイトに埋め込む2つの方法
クリック・ソーシャル

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

無料トライアル開始 アングルライト
ホーム ブログ インスタグラムの投稿をワードプレスのウェブサイトに埋め込む2つの方法

インスタグラムの投稿をワードプレスのウェブサイトに埋め込む2つの方法

インスタグラムの投稿をワードプレスに埋め込む方法

ビジネスやコンテンツのためにウェブサイトを管理している多くの人にとって、魅力的なサイトを維持することは最優先事項だ。

デジタルマーケティングとソーシャルメディアマーケティングの経験から、インスタグラムのようなソーシャルメディアからのビジュアルコンテンツが、オンライン上でブランドを成長させるのに役立つことを知っている。

Instagramの投稿をWordPressのウェブサイトで共有することで、サイト訪問者に視覚的な魅力を直接伝えることができ、最新のソーシャルメディアコンテンツをアピールすることができます。

さらに、美しいインスタグラムの写真や動画をサイトに表示することは、ユーザーのエンゲージメントを高め、インスタグラムのフォロワーを増やし、SEOランキングを向上させる素晴らしい方法です。

この記事では、Instagramの投稿を埋め込む2つの簡単な方法をご紹介します。

コーディング不要でインスタグラムの投稿やフィードをサイトに埋め込む方法を、ステップ・バイ・ステップのチュートリアルで紹介しよう。

この記事で

Instagramの投稿は手動で埋め込むべきか、自動で埋め込むべきか?

私は数年前からインスタグラムのコンテンツをウェブサイトに表示しているが、いつもスマッシュ・バルーンのインスタグラム・フィード・プロを使って自動的に表示している:

特徴手動で埋め込む(一つずつ)スマッシュ・バルーン インスタグラム・フィード・プロを自動的に使う
プロセス時間がかかる:表示させたい投稿ごとに、複数のステップを踏む必要がある。👍簡単:アカウントを一度接続するだけで、数分でInstagramフィード全体を作成し、埋め込むことができます!
コンテンツの更新❌ 静的:投稿は固定されています。新しいコンテンツを表示するには、手動での埋め込みプロセスを繰り返す必要があります。自動: 最新のInstagram投稿でフィードが自動的に更新されます。設定したら、すぐに忘れてください。
カスタマイズ👎 限定的:インスタグラムのデフォルトのシングルポストレイアウトに縛られる。👍パワフル:グリッド、カルーセル、メイソンリー、ハイライトレイアウトから選べます。色やフォントなどをカスタマイズして、あなたのブランドに完璧にマッチさせましょう。
利用可能な飼料の種類ユーザーの投稿のみ:自分のタイムラインからの投稿のみ埋め込むことができます。✅ 複数のフィードタイプ:ハッシュタグ、メンション、ショッパブルフィードからフィードを表示し、複数のフィードタイプを1つにまとめることもできます。
最終的な収穫単一の記事を追加するための時間のかかる方法は、すぐに時代遅れになり、デザインコントロールもできない。複数のInstagram投稿をフィードに埋め込む最速&最良の方法。今すぐInstagram Feed Proをチェック

ワードプレスにインスタグラムのコンテンツを埋め込む方法(2つの方法)

ウェブサイトにインスタグラムを埋め込むには、表示したいインスタグラムコンテンツの種類によって2つの異なる方法があります:

  1. oEmbedsを使ってインスタグラムの投稿を埋め込む
  2. Instagram Feed Proを使ってインスタグラムのフィードを埋め込む

1.oEmbedsを使ってInstagramの投稿を埋め込む

WordPressのデフォルトエディタには、以前からoEmbeds 機能があった。

この機能を使えば、WordPressのInstagramプラグインを使っていなくても、Instagramの投稿にリンクを貼り付けるだけで、WordPressが自動的に埋め込んでくれる。

残念なことに、WordPressは2020年10月24日にインスタグラムとフェイスブック用のoEmbedsを廃止した

その結果、インスタグラムの投稿をワードプレスに埋め込むには、リンクを貼り付けるだけではこのエラーが表示される。そうですよね、私もこれには落胆しました。

ビフォー・アフター

この変更により、インスタグラムの投稿をWordPressに手動で追加したい場合は、手動で行う必要がある:

  • Facebookにアプリ開発者として登録する。
  • インスタグラムAPIを直接扱う

特にWordPressの技術的な側面に精通していない場合、これらは多くの時間を要し、複雑です。

でも心配しないで。私は良い知らせを携えて来た!

良いニュースは、インスタグラムの投稿をワードプレスに表示する別の方法があるということだ。

WordPressのための最高のInstagramフィードプラグイン、Instagram Feed Proを使用すると、わずか数クリックでWordPressにInstagramの投稿を追加することができます。

スマッシュ・バルーンのインスタグラム・フィード・プロ

このInstagramフィードプラグインは、InstagramとFacebookのためのoEmbeds機能を復活させるので、あなたがする必要があるすべては、あなたのウェブサイトにそれらを表示するには、Instagramの投稿へのリンクを貼り付けることができるように、このプラグインを有効にしている。

インスタグラムの投稿をワードプレスに埋め込む方法(3ステップ)

WordPressにInstagramの投稿を追加するための簡単なガイドを作成しました:

ステップ1:Instagram Feed Proのインストールと有効化

まず、Instagram Feed Proをこちらから入手できる。入手したら、WordPressサイトにインストールし、有効化してください。

やり方がわからない場合は、WordPressプラグインのインストールに関する便利な記事があります。

ステップ2:インスタグラム用のWordPress oEmbedsを有効にする

Instagram Feed Proをインストールして有効化した状態で、WordPressのダッシュボードからInstagram Feed " oEmbedsにアクセスします。

そのページで、InstagramセクションのEnable ボタンをクリックする。

Facebookセクションの有効化 ボタンをクリックして、ここからFacebook用のoEmbedsを有効にすることもできます。

個人的に、このセットアップを高く評価しているのは、WordPressでoEmbedsを有効にするのがとても簡単なことだ!

エンベッド・インスタグラムを有効にする

それが済んだら、Facebookを開いてoEmbedsを有効にすることができる。

接続 ボタンをクリックしてください。

ここから、FacebookアカウントやInstagramアカウントに読み取り専用アクセス権を与えることができる。

このアクセス権により、プラグインはあなたの投稿を見ることはできますが、変更を加えることはできないので、Smash Balloonは完全に安全です。

フェイスブックでは、Continue ボタンをクリックして次に進みます。

フェイスブックで続けるボタンをクリック

これで、InstagramアカウントをWordPressに正式に接続し、FacebookとInstagramのoEmbedsを有効にしました!

フェイスブックとインスタグラムのエンベッドが可能に

次のステップでは、プラグインを使ってInstagramの投稿をウェブサイトに埋め込むことができる。

ステップ3:Instagramの投稿を埋め込む

最後に、Instagramの投稿をWordPressに埋め込む方法を紹介しよう。

WordPressのページや投稿にInstagramの投稿を埋め込む

まず、ダッシュボードからページ " 新規追加に進み、WordPressエディターを開きます。

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

WordPressの投稿を使うこともできます。新しい投稿を作成するには、投稿 " 新規追加に進みます。

インスタグラムの投稿をワードプレスの投稿に埋め込む方法

そうしたら、インスタグラムの投稿にリンクを貼り付けるだけ

ワードプレスのインスタグラム投稿例を修正する

インスタグラム・フィード・プロはすでにWordPressのoEmbeds機能を有効化しているので、インスタグラムの投稿のリンクをWordPressに貼り付けるだけで、インスタグラムの動画や写真をWordPressに埋め込むことができる。

わずか数クリックで、Instagram Feed Proの助けを借りて、WordPressにInstagramの投稿を埋め込むことに成功しました。

でも、私がいつも言っていることは...。

インスタグラムのフィード経由で複数のインスタグラム投稿を自動的に追加できるのに、なぜ1つか2つのインスタグラム投稿だけを追加するのか?

2.インスタグラムフィードプロを使ってインスタグラムフィードを埋め込む

WordPressにInstagramフィードウィジェットを埋め込む最も簡単な方法は、Instagram Feed Proを使用することです。

Instagram Feed Proを使えば、コーディング不要で、数分で複数のInstagram投稿を作成、カスタマイズし、ウェブサイトに埋め込むことができます。

このInstagramプラグインのクールなところは、あなたのウェブサイトのテーマとブランディングにマッチしたInstagramフィードを、箱から出してすぐに自動的に追加してくれるところだ。

このプラグインを使っているうちに、設定とインストールがいかに簡単であるかに気づいた。数回のクリックで複数のインスタグラム投稿をウェブサイトに表示させるのに、5分もかからなかった。

また、このプラグインが自動的にレスポンシブなインスタグラムフィードを作成する点も気に入っている。

つまり、あなたのインスタグラムのフィードは、あらゆる画面サイズやデバイスで機能し、見栄えよく表示される。

さらに、Instagramのフィードをウェブサイトに追加すると、Instagram Feed Proは新しいInstagramの投稿ごとに自動的に更新されます。

こうすることで、手動更新の手間をかけることなく、ダイナミックで魅力的なサイトを簡単に維持することができる。

これだけでは物足りないなら、Instagram Feed Proには他にもたくさんの機能がついている。そのハイライトをいくつか紹介しよう:

  • 超簡単&クイックセットアップ: プラグインのシンプルなガイドフローに従うことで、数分でインスタグラム投稿の埋め込みを開始できます。
  • さまざまなInstagramフィードの種類: インスタグラムの動画、インスタグラムのハッシュタグフィード、インスタグラムのリール、ショッパブルフィードなどをワードプレスに 埋め込むことができます
  • ビジュアルフィードエディタ: ビジュアルフィードカスタマイザーが付属しており、数回のクリックでリアルタイムに変更を追跡できます。
  • 光速:写真や動画でサイトが遅くなるのが心配ですか?Instagram Feed Proを使えば、Instagramの投稿が常に超高速で読み込まれます。さらに、より高速なサイトはSEO対策にもなります。
  • カスタマーサポート:Instagramの投稿をサイトに埋め込む際に何か問題が発生した場合は、専任のサポートチームにお任せください。

これだけでなく、Instagram Feed Proは、WordPress用のInstagramフィードプラグインとして最も高い評価を得ているNo.1になりました。1,000,000人以上のアクティブユーザーと 4.9/5つ星の評価がそれを物語っています。

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

実際、世界中の大手ブランドの中には、Instagram Feed Proやその他のSmash Balloonプラグインを使用して、ソーシャルメディアフィードをウェブサイトに表示しているところもある。

複数のInstagram投稿を自動的に表示する準備はできましたか?今すぐInstagram Feed Proを始めましょう。

ワードプレスにインスタグラムのフィードを埋め込む方法

個人的には、インスタグラムのフィードをウェブサイトに追加するのが好きだ!

Instagramのフィードをウェブサイトに表示する最も簡単な方法は、Instagram Feed Proを使用することです。

これにより、複数のインスタグラムの写真フィード、動画フィード、またはその両方を組み合わせたフィードを、わずか数クリックでWordPressに埋め込むことができます。

Instagramのフィードウィジェットを埋め込むには、まず、ダッシュボードからInstagramのフィード " すべてのフィード メニューに移動します。

新規追加 ボタンをクリックして、新しいフィードを作成します。

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

プラグインは、あなたのウェブサイトに掲載したいインスタグラムフィードのタイプを選択するよう求める。

このインスタグラム・フィード・プラグインには、機能が制限された無料版があるが、インスタグラム・フィード・プロ版を使えば、3種類のフィードにアクセスできる:

複数のフィードタイプを選択することもできます。複数のオプションを選択するだけで、異なるフィードタイプを1つのフィードにまとめることができます。

ボーナス:Instagram Feed Proを使って、Instagramのストーリーをポップアップライトボックスでウェブサイトに表示することもできます。こうすることで、サイト訪問者にWordPressに長く滞在してもらうことができます。

インスタグラムのフィードタイプを選んだら、「次へ」をクリックする。このチュートリアルでは、ユーザータイムラインを選びました。

フィードタイプを選択 instagramフィードプロ

次のページでは、あなたのサイトに投稿を表示できるように、インスタグラムのフィードのソースを選択できます。ここでインスタグラムのビジネスアカウントを選択し、「次へ」をクリックします。

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

これでインスタグラムのフィードが作成され、ライブプレビュー付きのプラグインのビジュアルフィードカスタマイザーで開くことができます。

ここでは、フィードレイアウト、カラースキーム、ヘッダー、ロードモアボタン、フォローボタンなど、すべてのカスタマイズオプションが左側にあります。

ビジュアルカスタマイザーの右側には、インスタグラムのフィードのライブプレビューも表示されます。

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

インスタグラムのフィードのカスタマイズを開始するには、左側のフィードレイアウトオプションを クリックします。

インスタグラムのフィードレイアウトを変更する

インスタグラムのフィードの全体的なレイアウトを選べるようになり、グリッド、カルーセル、メイソンリー ハイライトの4つのオプションから選べるようになった。

フィード・レイアウト・オプションを選択する

レイアウトを選んだら、下にスクロールして 「保存」をクリックします。

インスタグラムのフィードをパーソナライズし、自分だけのものにするのに役立つオプションがたくさんある。例えば、配色、フィードテーマ、ヘッダースタイル、背景色、ボタンデザイン、投稿スタイルなどなど。

ビジュアルフィードカスタマイザーで一番気に入っているのは、フィルターとモデレーションのセクションだ。これを使えば、数回クリックするだけで、表示または非表示にしたいインスタグラムの投稿をコントロールできる!

ビジュアルフィードカスタマイザーから、設定タブ >フィルターとモデレーション>フィードのモデレーションをクリックします。

フィルタとモデレーション」 メニューが表示されるので、「有効」 ボタンをクリックしてフィードモデレーションを有効にします。

インスタグラムのフィードを2つの方法で調節できることをご存知ですか?

  • Allow Listはインスタグラムの投稿をすべて非表示にするので、表示したい投稿を手動で選択できる
  • ブロックリストにはインスタグラムの投稿がすべて表示されるので、非表示にしたい投稿を手動で選ぶことができます。

このチュートリアルでは、Allow Listを使う。

リストを許可」をクリックし、投稿の横にある緑色のチェックマークをクリックして表示したいインスタグラムの投稿を手動で選択し、このように変更を保存するだけです:

ほとんど瞬時に、あなたのInstagramフィードには、選択したInstagramの投稿のみが表示されます。簡単でしょう?複雑なコードを扱う必要もなかった!

最後に、右上の埋め込み ボタンを使って、Instagram WordPressのフィードをウェブサイトに埋め込むことができます。

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

これをクリックすると、インスタグラムのフィードの場所を選択できるポップアップが表示される。

インスタグラムのフィードをワードプレスのページに埋め込みたい場合は、ここで「ページに 追加」をクリックする。

インスタグラムのフィードをページに追加する instagram feed proインスタグラムのフィードをページに追加する instagram feed pro

プラグインがWordPressページのリストを表示します。ページを選択し、追加をクリックしてください

ページにInstagramフィードを追加する

そうすると、Instagram Feed ProがWordPressのエディターでそのページを開き、フィードを埋め込むことができます。

プラスアイコン(+)を クリックするだけで、ここに新しいコンテンツブロックが追加されます。

新しいワードプレスブロックを追加する

次に、検索バーに「Instagram」と入力し、その結果からInstagram Feed ウィジェットを選択する。

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

インスタグラム・ブロックをワードプレスのページに追加したら、「公開」をクリックする。その後、サイトを開いてどのように見えるかを確認できます。

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

このWordPressプラグインを使えば、埋め込みコードやInstagramのショートコードをいじる必要はない。さらに、簡単なステップでInstagramウィジェットをサイトに埋め込むこともできる。

インスタグラムのフィードをワードプレスのウェブサイトに埋め込む理由

ソーシャルメディア・マーケティングに関する統計調査によると、インスタグラムの月間ユーザー数は24億人を超えている。

そして、インスタグラムの膨大なユーザーベースは、製品やサービスを宣伝するための優れたソーシャルメディアプラットフォームである一方、実のところ、インスタグラムスペースには多くの 競合が存在する。

結局のところ、世界中で2億人以上のビジネスプロフィールがインスタグラムを使用しているため、群衆から目立ち、ターゲットオーディエンスに気づいてもらうのは難しいかもしれない。

しかし、インスタグラムのコンテンツをウェブサイトに埋め込んだらどうだろう?

インスタグラムの投稿をワードプレスに統合することで、すでにあなたのブランドに興味を持っている人たち、つまりサイト訪問者にインスタグラムのアカウントを宣伝する手軽で簡単な方法です!

あなたのブランドのオーディエンスを広げることに加えて、WordPressにInstagramフィードを埋め込むことの利点は他にもあります:

  • インスタグラムのフォロワーを増やす- サイト訪問者はすでにあなたのブランドに興味を持っているので、WordPressでインスタグラムのコンテンツを見ることで、あなたのアカウントをフォローする可能性が高くなります。
  • ユーザーのエンゲージメントを高める - インスタグラムのフィードをサイトに追加すると、投稿、動画、インスタグラムのリールをより多くの人に見せることができるため、コンテンツの「いいね!」、コメント、閲覧数が増える可能性が高くなります。
  • ブランドの信頼を高める - ウェブサイトの訪問者は、インスタグラムのユーザーでなくても、インスタグラムの動画レビューや証言を見ることができます。
  • より多くの売上を生み出す - Instagramの投稿、Instagramの画像、実際の顧客のリールなど、ユーザーが作成したコンテンツを表示することは、社会的証明として機能し、Eコマースブランドのコンバージョンを高めます。また、ショッピング可能なインスタグラムフィードを使えば、インスタグラムの投稿を販売ページに直接リンクさせることもできます。
  • ウェブサイトSEOの改善 - Googleは定期的に更新される新しく新鮮なコンテンツを好むため、Instagramのフィードをサイトに埋め込むことで、関連性が高くキーワードが豊富なコンテンツでWordPressを自動的に更新できるようになります。

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

WordPressにInstagramの動画を追加したいですか?

WordPressのウェブサイトにInstagramの動画を表示する方法については、こちらのステップバイステップガイドをご覧ください。

というわけで、皆さん、お待たせしました!この記事で、WordPressにInstagramの投稿を埋め込む方法をご理解いただけたでしょうか?

インスタグラムの投稿をウェブサイトに埋め込むことを始めたいですか?

今すぐInstagram Feed Proを始めよう

なぜInstagramの埋め込みが動作していない、自問?Instagramの埋め込みが動作しない修正するために何をすべきか、この詳細なチュートリアルを参照してください

他のソーシャル・メディア・プラットフォームにアカウントをお持ちの方は、ソーシャル・フィードをWordPressに追加する方法について、次の記事をご覧ください。

Elementorのウェブサイトをお持ちですか?WordPress ElementorでInstagramのフィードを追加する方法については、こちらの記事もご覧ください。

著者アバター
リアン・ラロヤ コンテンツマーケティングマネージャー
リアンヌはスマッシュバルーンでコンテンツマーケティングマネージャーを務め、WordPressコンテンツ、ソーシャルメディアマーケティング、ユーザー生成コンテンツ(UGC)、検索エンジン最適化(SEO)において12年以上の経験を持つ。

コメントを追加する

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