Instagramウィジェットをウェブサイトに埋め込むことは、企業が自社サイトに使う最も人気のあるウェブプラグインの一つです。その主な理由は、自社のInstagramフィードから新鮮で活発なコンテンツを表示したり、UGCを紹介したり、実際の顧客のインサイトを提供したりできるからです。
Instagramはネイティブのウィジェットを提供していませんが、ソーシャルメディアアグリゲーターを使えば、自社のInstagramコンテンツや、ハッシュタグ・メンションから取得した他の人のコンテンツを生成し、自社サイト向けにあらゆる種類のInstagramウィジェットを作ることができます。
これらのウィジェットは、スライダーやカルーセルといったさまざまなレイアウトから、買い物ができるフィードやInstagram上の実在の人々の声を表示するといったさまざまな機能まで、多岐にわたります。
それでは詳しく見ていきましょう！
Instagramウィジェットとは？
Instagramウィジェットの構造
Instagramウィジェットは、Instagramのコンテンツを直接表示するために、ウェブサイトのデザインに埋め込めるウェブプラグインです。このコンテンツは、最新の投稿、ストーリーズ、ギャラリー、あるいはアカウントに紐づく特定のハッシュタグフィードまで多岐にわたります。
通常、Instagramウィジェットには、スライダー、グリッド、コラージュ、あるいはポップオーバーなどのより複雑なフォーマットといった、さまざまなレイアウトがあります。Instagramウィジェットを埋め込む主な目的は、Instagramの新鮮なコンテンツを表示し、ブランドへの信頼を生み、ブランドの製品を使うさまざまな人々の本物のコンテンツでウェブサイト上の購買行動をさらに後押しすることです。
ほとんどのInstagramウィジェットに共通しているのは、以下の機能を実現するためにInstagram APIと連携している点です。
- 自動更新 ── 新しいコンテンツがあるたびに自動で同期します。
- リンク ── 参照用に元のコンテンツへリンクします。
- ユーザー情報 ── ユーザー情報やアバターを集約し、信ぴょう性を高めます。
ウェブサイトでInstagramウィジェットを使うメリットとは？
まだウェブサイトでInstagramウィジェットを使っていない方のために、主なメリットをご紹介します。
- 常に新鮮で本物のコンテンツを表示 ── 自動更新されるInstagramフィードウィジェットを常設することで、ウェブサイトが生き生きとして最新の状態に保たれます。
- サイト訪問者をInstagramフォロワーに転換 ── ほとんどのウィジェットには元のコンテンツへのリンクや「フォローする」ボタンが備わっており、興味を持ったサイト訪問者があなたのアカウントをフォローし始める手助けをします。
- エンゲージメントの向上 ── 新鮮で本物のコンテンツを表示することで、サイト訪問者はウィジェットとさらに交流し、写真や動画を見たり、ウィジェット内にタグ付けされた商品をクリックしたりできます。
- ソーシャルプルーフの提供 ── より高度なツールの中には、あなたのInstagramアカウントをメンションした投稿を生成するオプションを備えたものがあり、ウェブサイトで紹介して信頼をさらに築くのに役立ちます。
- インタラクティブなウィジェットを自作・維持するコストを節約 ── ほとんどのウィジェットは読み込み速度が最適化され、モバイルにも対応しており、その後のメンテナンスも不要です。
ウェブサイトに最適なInstagramフィードウィジェット
この記事で使用しているInstagramウィジェットは、EmbedSocialプラットフォームで集約・利用できます。これらは、自分のアクティビティだけを表示するような単純なInstagramフィードウィジェットではありません。ユニークなデザインとレイアウトを持つ最もインタラクティブなウィジェットを厳選しており、Instagramと連携してInstagram投稿以上のものを生成します。これらのウィジェットは、Instagramストーリーズ、Reels、ハッシュタグ、あるいはあなたのブランドをメンションした投稿を生成できます。
お約束どおり、Instagramコンテンツをウェブサイトに表示するのに最適なウィジェットをご紹介します。
- Instagramストーリーズスライダー
- Instagramショッパブルフィード
- クラシックなInstagramソーシャルメディアウォール
- Instagramコラージュギャラリー
- Instagram Reels動画スライダー
- Instagram masonryスライダー
- Instagramハッシュタグフィードウィジェット
- Instagramフォトアルバムウィジェット
- UGC Instagram・Googleクチコミウィジェット
- 無料Instagramフィードウィジェット
1. Instagramストーリーズスライダー
EmbedSocialのInstagramストーリーズウィジェットを使えば、わずか数クリックでInstagramストーリーズをウェブサイトに埋め込めます。公開中のストーリーズを生成し、Instagramアカウントを連携すれば、今後公開するすべてのストーリーズを生成し続けます。
Instagramストーリーズスライダーは、最新のInstagramストーリーズをスライダーで表示し、あらかじめ設定した間隔で自動再生するように設定できます。顧客からリポストしたストーリーズを紹介したり、自社の最新の舞台裏の様子を見せたりできるので、ランディングページやホームページに最適です。
2. Instagramショッパブルフィード
Instagramショップの埋め込みは、ウェブサイト上でより多くのエンゲージメントと販売を生む素晴らしい方法です。このウィジェットでは、各写真に写っている商品をタグ付けできます。これにより、ウェブサイト向けに「Shop my feed」や「Shop my looks」といったタイプのウィジェットを作成できます。スライダー、フィード、コラージュを作成でき、投稿の表示方法も完全にカスタマイズできます。
3. クラシックなInstagramソーシャルメディアウォール
これはInstagramフィードのクラシックなフォーマットで、画像やReelsとともに投稿のテキスト部分も含めた最新のInstagramアクティビティを表示するのに主に適しています。番号付きのページネーションを表示したり、無限スクロール付きの「もっと見る」ボタンを追加したりするオプションがあり、コンテンツが豊富なフィードに最適です。
関連記事：
4. Instagramコラージュギャラリー
Instagramコラージュウィジェットは、Instagramに投稿された写真を強調するウェブギャラリーを作るのに適しています。キャプションもウィジェットに含まれますが、ホバー時やライトボックスでクリックしたときに表示されます。
5. Instagram Reels動画スライダー
Instagram Reelsスライダーは、コンテンツ戦略で主に動画を使うInstagramユーザーに最適です。ダークテーマを使ってダークモードに切り替えることで、よりモダンな見た目のウィジェットを作れるほか、ホバー時にウィジェット内の動画を再生する自動再生オプションも有効にできます。
6. Instagram masonryスライダー
これは、Instagram ReelsとInstagram投稿を組み合わせて見せる、よりモダンな方法です。この多彩なコンテンツをmasonryフォーマットで表示しますが、スライダーとしても使えるため、場所を節約してランディングページに表示できます。
7. Instagramハッシュタグフィードウィジェット
これは、キャプションで特定のハッシュタグを使っている投稿を表示するInstagramハッシュタグウィジェットです。企業は自社のブランドハッシュタグを使ったコンテンツを紹介するために使えるほか、ハッシュタグキャンペーンを開催する場合は、そのコンテストをウェブサイトに表示するために使うこともできます。
8. Instagramフォトアルバムウィジェット
これは、最新のInstagram写真をグリッド形式で表示するフォトアルバムです。Instagramフォトギャラリーには「もっと見る」や番号付きのページネーションを設定できます。もちろん、無限スクロールのオプションも含まれています。
9. UGC Instagram・Googleクチコミウィジェット
Googleクチコミをウェブサイトに追加し、あなたのブランドをメンションした顧客のInstagram投稿と組み合わせれば、ウェブサイトにとって究極のUGCウィジェットが完成します。
新鮮で本物のUGCを持つことは、ソーシャルプルーフを提供し、最終的に顧客がより早く購入を決断する手助けをする最良の方法です。
関連記事：
10. 無料Instagramフィードウィジェット
これは、Instagramフィードの最新投稿を表示する、完全無料のInstagramスライダーです。
読み込みが速く、どんなウェブサイトのデザインでも動作します。
もっとウィジェットが必要ですか？ 80種類以上のInstagramウィジェットを揃えた最大級のライブラリをご覧ください。
Instagramフィードを埋め込む方法
Instagramフィードの埋め込み方法に関する詳しいチュートリアルをご用意しています。ここでは、クイックスタートの手順だけを概説します。
1. EmbedSocialでアカウントを作成する
EmbedSocialプラットフォームで無料トライアルを開始し、手順に従ってInstagramに連携します。ログインしたら、「ソース」に移動して「Instagram」を追加します。
2. Instagramアカウントに連携されたFacebookページと連携する
このプラットフォームでは、Instagramビジネスアカウントに連携されたFacebookページとの接続が必要です。つまり、「Facebookと連携」して必要な権限を付与するだけで完了します。
このステップでは、プラットフォームがあなたのInstagramページを集約・同期する権限を得るために、Instagramアクセストークンを提供する必要があります。
メモ：Instagramビジネスアカウントをお持ちでない場合は、手動オプションを使ってアカウントのユーザー名を入力してください。
3. Instagramフィードをカスタマイズしてウィジェットコードをコピーする
権限を付与すると、プラットフォームがInstagram投稿を生成し、ウィジェットエディターにリダイレクトします。ここでレイアウトを変更したり、投稿をモデレーションしたりできます。完了したら、「埋め込み」タブをクリックして「コードをコピー」をクリックするだけです。
4. ウィジェットコードを埋め込む
コードを取得したら、HTMLに埋め込むか、ご利用のCMSやウェブビルダープラットフォームの埋め込み手順に従ってください。
プラグインなしでWordPressサイトにInstagramウィジェットを埋め込む方法は？
EmbedSocialが提供するコードを使えば、追加のプラグインをインストールしたり維持したりする必要はありません。WordPressのページを開き、ブロックの中からHTMLブロックを見つけてください。ここにウィジェットコードを貼り付けてページを更新するだけです。
関連記事：
HTMLサイトに無料でInstagramフィードを埋め込む方法
無料Instagramウィジェットを使って、どんなHTMLサイトにもInstagramスライダーを埋め込めます。手順は同じです。表示したい場所のHTMLのbodyセクションにコードを貼り付けるだけです。
重要なポイント
Instagramウィジェットの追加は、新鮮でインタラクティブなウェブサイトに欠かせないものです。さらに、InstagramのUGCコンテンツを収集してウェブサイトに表示することで、見込み客のより早い購入判断に影響を与えることができます。
まずはInstagramウィジェットライブラリを見て、自分のニーズに最も合ったウィジェットを見つけましょう。
ウィジェットは、レイアウト、デザイン、生成するコンテンツがそれぞれ異なります。
カルーセルからコラージュまで、選べる選択肢が豊富にあります。
