目次
ホームページにInstagramを埋め込む方法は2通りあります。
- 投稿を1件だけ表示する:Instagramの「埋め込み」機能でコードをコピーして、ホームページに貼ります。無料で、登録はいりません。
- 最新の投稿を一覧で表示する:SnapWidgetなどのウィジェットを使います。コードを一度貼れば、Instagramに投稿するたびに、ホームページの表示も自動で新しくなります。
この記事では、2つの方法の手順と、WordPress、Wix、STUDIO、Googleサイトでのコードの貼り方を説明します。
Instagramの埋め込みとは
Instagramの埋め込みとは、Instagramの投稿をほかのウェブサイトのページの中に表示することです。ホームページに貼るのは画像のファイルではなく、数行のHTMLコードです。このコードが投稿を読み込んで表示します。
2つの方法の違い
投稿の埋め込み(Instagramの機能)
- 表示する内容:選んだ投稿1件(写真、動画、リール)
- 新しい投稿:自動では増えません。表示したい投稿ごとにコードを貼ります。
- 条件:公開アカウントの投稿であること
- 料金:無料
フィードの埋め込み(SnapWidgetのウィジェット)
- 表示する内容:アカウントの最新の投稿の一覧(グリッド、スライドショーなど)
- 新しい投稿:自動で表示されます。無料ウィジェットは15分ごと、有料ウィジェットは5分ごとに更新されます。
- 条件:Instagramのプロアカウント(クリエイターまたはビジネス)
- 料金:無料で使えます。有料プランは月8ドルからです。
方法1:Instagramの投稿を1件埋め込む
Instagramのアプリでは、埋め込みコードをコピーできません。パソコンかスマートフォンのブラウザでinstagram.comを開いて操作します。
- ブラウザでinstagram.comを開き、埋め込みたい投稿を表示します。
- 投稿の「…」メニューをクリックし、「埋め込み」を選びます。
- キャプション(投稿の文章)を表示しない場合は、キャプションのチェックを外します。
- 表示されたコードをコピーします。
- ホームページの、HTMLを貼れる場所にコードを貼ります。サービスごとの場所は、下の「サイト作成サービス別の貼り方」を見てください。
投稿のリンクからコードを作ることもできます。Instagram埋め込みコード生成ツールに投稿かリールのリンクを貼ると、ブラウザの中でコードができます。無料で、登録もInstagramへのログインもいりません(ツールの画面は英語です)。
埋め込めない場合は、次の点を確かめてください。
- 埋め込めるのは、公開されている写真、動画、リールの投稿です。ストーリーズは埋め込めません。
- 非公開アカウントの投稿は埋め込めません。
- 投稿者が埋め込みをオフにしている場合も、埋め込めません。
埋め込んだ投稿は、その1件のままです。新しい投稿を表示するには、もう一度コードを貼る必要があります。
方法2:Instagramのフィードを埋め込む(自動で更新)
投稿のたびにホームページを編集したくない場合は、ウィジェットを使います。ここでは、20万以上のサイトで使われているSnapWidget(スナップウィジェット)での手順を説明します。
始める前に:プロアカウントに切り替える
SnapWidgetなどのアプリをInstagramにつなぐには、プロアカウント(クリエイターまたはビジネス)が必要です。個人アカウントの場合は、Instagramのアプリで切り替えます。切り替えは無料で、フォロワーと投稿はそのまま残ります。
- プロフィールを開き、メニュー(≡)から「設定とアクティビティ」をタップします。
- 「プロフェッショナル向け」の「アカウントの種類とツール」をタップします。
- 「プロアカウントに切り替える」をタップし、カテゴリを選びます。
- 「クリエイター」か「ビジネス」を選び、「次へ」をタップします。
SnapWidgetでウィジェットを作る
SnapWidgetの管理画面は英語です。ボタンの名前は、画面と同じ英語で書きます。
- SnapWidgetに無料で登録します。クレジットカードはいりません。
- 「Create A New Widget」をクリックし、Instagramのレイアウトを選びます。無料ウィジェットでは、グリッド、ボード、スライドショー、スクロール、ポップアップを使えます。
- 「Username」欄をクリックし、Instagramでログインします。ログインはInstagramの画面で行うので、パスワードをSnapWidgetに渡すことはありません。
- 写真のサイズと間隔を設定し、「Preview」で表示を確かめます。
- 「Get Widget」をクリックし、埋め込みコードをコピーします。
- コードをホームページに貼ります。
コードは数行のHTMLです。ウィジェットを表示するiframeと、設定に応じてスクリプトとスタイルシートが入っています。ホームページに何かをインストールする必要はありません。一度貼れば、新しい投稿は自動でウィジェットに表示されます。
サイト作成サービス別の貼り方
WordPress
ブロックエディターで「カスタム HTML」ブロックを追加し、コードを貼ってページを更新します。プラグインはいりません。くわしい手順はWordPressのガイド(英語)にあります。
Wix
Wixには、コードではなくウィジェットのURLを入力します。URLは、コードのiframeの行にある https://snapwidget.com/embed/ で始まるアドレスです。末尾に ?class="snapwidget-widget" を付けてください。エディターで「パーツを追加」から「埋め込みコード」を選んで埋め込みのパーツを追加し、URLを入力します。最後に、スクロールバーが出なくなるまで枠を広げます。くわしい手順はWixのガイド(英語)にあります。
STUDIO
「Embed(埋め込み)」ボックスを追加し、右側のパネルの「埋め込みコード」にコードを貼ります。STUDIOの「Instagram」ボックスで表示できるのは投稿1件です。最新の投稿を一覧で表示するには、EmbedボックスにSnapWidgetのコードを貼ります。
Googleサイト
コード全体の前に <div>、後に </div> を付けます。divがないと、訪問者が写真をクリックできません。右側の「挿入」から「埋め込む」を選び、「埋め込みコード」にコードを貼って「次へ」、「挿入」の順にクリックします。最後に、すべての写真が見えるまで枠を広げて、サイトを公開します。くわしい手順はGoogleサイトのガイド(英語)にあります。
Jimdo
「ウィジェット/HTML」のコンテンツを追加し、コードを貼ります。
HTMLで作ったホームページ
ページのHTMLファイルの、ウィジェットを表示したい場所にコードを貼ります。
無料プランと有料プラン
無料ウィジェット
- InstagramとFacebookに対応しています。
- レイアウトは、グリッド、ボード、スライドショー、スクロール、ポップアップです。
- 表示回数に上限はありません。
- 15分ごとに新しい投稿を読み込みます。
- 写真をクリックすると、SnapWidgetのページが開きます。
有料プラン(すべて14日間の無料トライアル付きで、いつでも解約できます)
- Lite:月8ドル(Proウィジェット1個)
- Pro:月14ドル(Proウィジェット20個)
- Developer:月99ドル(Proウィジェット250個)
- フィードのレイアウト、写真からInstagramへのリンク、ライトボックスが使えます。
- 5分ごとに新しい投稿を読み込みます。
- ProとDeveloperでは、ハッシュタグウィジェットも作れます。
- TikTok、YouTube、X(Twitter)のウィジェットも作れます。
料金と機能はSnapWidgetのトップページで確かめられます。
よくある質問
インスタの投稿一覧をホームページに埋め込むには?
Instagramの埋め込み機能で表示できるのは、投稿1件ずつです。最新の投稿を一覧で表示するには、SnapWidgetなどのウィジェットを使います。コードを一度貼れば、新しい投稿も自動で表示されます。
Instagramの埋め込みコードはどこで取得できますか?
パソコンかスマートフォンのブラウザでinstagram.comを開き、投稿の「…」メニューから「埋め込み」を選びます。Instagramのアプリではコピーできません。
Instagramの埋め込みは無料ですか?
はい。Instagramの投稿の埋め込みは無料です。SnapWidgetのウィジェットも無料で作れます。有料プランは月8ドルからで、14日間の無料トライアルがあります。
個人アカウントでも埋め込めますか?
投稿1件の埋め込みは、公開アカウントであれば個人アカウントでもできます。フィードを表示するウィジェットには、プロアカウント(クリエイターまたはビジネス)が必要です。切り替えは無料です。
リール(動画)も埋め込めますか?
はい。リールの投稿も、写真の投稿と同じ手順で埋め込めます。ストーリーズは埋め込めません。
STUDIOにInstagramを埋め込むには?
投稿1件なら、STUDIOの「Instagram」ボックスを使います。最新の投稿の一覧を表示するなら、「Embed(埋め込み)」ボックスにSnapWidgetのコードを貼ります。
埋め込んだ投稿が表示されないのはなぜですか?
アカウントが非公開になった、投稿が削除された、または投稿者が埋め込みをオフにした可能性があります。Instagramの埋め込みは、公開されている投稿でしか使えません。