インスタグラムのフィードをウェブサイトで簡単に表示したいですか?
最新のインスタグラムの写真、リール、動画をサイトに掲載することは、サイトを新鮮に保ち、より魅力的に見せ、人々がウェブサイトからインスタグラムページに移動するのを助ける素晴らしい方法です。
しかし、通常のインスタグラムのオプションを使って、インスタグラムのフィードをウェブサイト上で思い通りに表示させるのは難しい。
これらの埋め込みオプションは、Instagramのフィードをあなたのサイトにスムーズに適合させるために必要なすべての選択肢や機能を与えてくれないことが多い。
スマッシュバルーンでは、10年以上にわたってソーシャルメディアコンテンツを簡単に埋め込むお手伝いをしてきました。今日は、Instagramのフィードを簡単に表示する方法をご紹介します。
この記事で
ウェブサイトにインスタグラムを表示する最も簡単な方法
インスタグラムのコンテンツをワードプレスのウェブサイトに表示する場合、主に2つの方法があります:
1.マニュアル個々のインスタグラム投稿を埋め込む
これは、特定のインスタグラム投稿の埋め込みコードを手動で取得し、これらのコードスニペットをカスタマイズしてサイトに直接追加することを含む。
2.自動化(推奨):WordPressプラグインを使用する
その代わりに、信頼できるプラグインを使えば、コーディング不要でインスタグラムの投稿のダイナミックフィードを簡単に表示することができる。
ウェブサイトにインスタグラムを表示する最も簡単な方法として、この方法、具体的にはInstagram Feed Proを使用することを強くお勧めします。
スマッシュバルーン社のInstagram Feed Proは、100万人以上のユーザーから賞賛され、WordPressのための 最高のInstagramフィードプラグインとして広く認知されています:
- シンプルさ:ガイド付きの3ステッププロセス(作成、カスタマイズ、埋め込み)で、コーディングのスキルは必要ありません。
- 汎用性:タイムライン、ハッシュタグ、インスタグラムのメンションなど、多くのフィードタイプをサポート。
- カスタマイズ:ライブプレビューが可能なビジュアルフィードカスタマイザーが内蔵されており、テンプレートやテーマをインポートすることができます。
- パフォーマンス:超高速ローディングのために設計されており、ウェブサイトのスピードが損なわれることはありません。
- 互換性:DiviやElementorのような人気のWordPressビルダーとシームレスに動作します。
- 質の高いサポート:WordPressの専門家チームによるサポートをご利用いただけます。
- 高評価:ユーザーからは4.9/5つ星と高い評価を得ており、ユーザーベースには有名ブランドも含まれている。
これらすべての機能により、Instagram Feed Proは、技術的な手間をかけることなく、より多くのフォロワーと売上を獲得するのに最適な選択肢となっています。
Instagramのフィードを簡単に追加する準備はできましたか?今すぐInstagram Feed Proを入手してください!
では、具体的な手順を説明しよう。
ウェブサイトにインスタグラムのフィードを表示する方法(簡単な方法)
Instagram Feed Proを使ってInstagramの投稿をウェブサイトに表示するには、以下のチュートリアルに従うだけです。
始めよう。
ステップ1:WordPressサイトにInstagram Feed Proをインストールする
まずは、Instagram Feed Proをこちらから入手してください。
プラグインをコンピュータにダウンロードし、インストールすることでWordPressウェブサイトにアップロードします。
プラグインのインストールでお困りですか?WordPressのプラグインをインストールする方法については、こちらのガイドを参照してください。
ステップ2:プラグインを使ってInstagramフィードを作成する
次のステップは簡単で、ウェブサイトに新しいインスタグラムのフィードを作成することだ。
WordPressのダッシュボードに移動し、Instagramのフィード " すべてのフィードに移動します。次に、上部にある新規追加 ボタンをクリックします。
Instagramのフィードをウェブサイトに埋め込むための次のステップは?表示したいInstagramフィードのタイプを決める。
インスタグラム・フィード・プロでは、以下の3種類のフィードタイプから選ぶことができます:
- ユーザーアカウント: 自分のアカウントの写真を含むInstagramフィードを埋め込みます。
- パブリックハッシュタグ: お好みのパブリックハッシュタグからInstagramフィードを埋め込みます。これは、ウェブサイトに顧客の声を表示するのに適しています。
- タグ付けされた あなたのInstagramアカウントがタグ付けされた投稿を含むInstagramフィードを表示します。
また、複数のフィードタイプを組み合わせて、1つのInstagramフィードに表示することもできる。
とりあえず、フィードの種類を選択し、「次へ」 ボタンをクリックします。
このチュートリアルでは、ユーザーのタイムラインフィードを使い、1つのインスタグラムプロフィールからの投稿を表示することにする。
ステップ3:Instagramアカウントをプラグインに接続する
インスタグラムの投稿をウェブサイトに表示するには、新しいフィードをインスタグラムのアカウントに接続します。
そのためには、Add Source ボタンをクリックしてください。
プラグインがInstagramのコンテンツを取得できるように、あなたのビジネスまたはクリエイターのアカウントを接続する時間です。
その前に、2種類の接続方法から選ぶことができる:
- ビジネスベーシック:ご自身のインスタグラムプロフィールの写真や動画を表示します。
- ビジネス上級者向け: ハッシュタグフィード、タグ付きフィード、ストーリーなど、より多くのコンテンツをアンロック。
接続タイプを選んだら、「接続」をクリックする。
インスタグラムのプロフィールからの投稿を表示するため、ベーシック 接続を使用します。
ここで、Instagramと接続をクリックして次に進む。
ここから、プラグインにインスタグラムのアカウントへの読み取り専用 アクセス権を与えることができる。
プラグインはこのアクセスを使ってあなたのインスタグラム情報を閲覧しますが、変更を加えることは一切できません。そのため、Smash Balloonは安全に使用できます。
プロフィールの接続を完了するには、ここで許可 ボタンをクリックします。
これでワードプレスのウェブサイトに戻るので、このアカウントをインスタグラムフィードのソースとして確認することができる。
次へ」をクリックしてください。
ステップ4:インスタグラムフィードの見た目をカスタマイズする
インスタグラムのフィードのデザインをカスタマイズするのはとても簡単だという話をしたのを覚えているだろうか?
ライブフィードエディターを使えば、数回のクリックでインスタグラムのフィードの見栄えを変えることができる。
左側には、フィードのレイアウト、ヘッダー、カラースキーム、個々のインスタグラム投稿、ボタンデザインなどを変更するオプションを含む、インスタグラムフィードのすべてのカスタマイズオプションを見つけることができます。
さらに、右側にフィードのライブプレビューが表示され、すべての変更をリアルタイムで追跡できます。
フィードレイアウトオプションを クリックして、インスタグラムのフィードのデザインを変更することができます。
ここでフィードレイアウトを設定し、インスタグラムの投稿がウェブサイトにどのように表示されるかを変更する。
このプラグインでは、4つの異なるレイアウトオプションから選択することができます:グリッド、カルーセル、メイソンリー 、ハイライト。
グリッドレイアウトを 選択すると、インスタグラムの投稿をこのように正方形にトリミングされた画像でいっぱいに整理されたフレームで表示することができる:
通常、私はInstagramのフィードのカルーセルレイアウトが 好きです。この例のように、スライド式の横長レイアウトでインスタグラムのフィードを表示することができます:
WordPressでInstagramのギャラリーを表示したいですか?それなら、メイソンレイアウトが 最適です。
画像を元のアスペクト比で表示するので、このようにインスタグラムの写真をフルに輝かせることができる:
最後に、ハイライトレイアウトを 選択して、インスタグラムフィードの特定の写真を目立たせることもできる:
Instagramフィードのレイアウトを選択したら、上部にある「保存」 ボタンをクリックします。
次に、カスタマイズをクリックして、インスタグラムフィードのデザインを変更することができます。
次に、左側のカスタマイズパネルを使って、もう一度インスタグラムフィードのデザインを編集することができる。
続行するには、配色 オプションをクリックします。
配色を選択することで、Instagramフィードのすべての色を簡単に変更することができます。4つのカラースキームから選べます:
- テーマからの継承:WordPressテーマの色を自動的にコピーします。
- ライト暗いフォントで明るい背景を表示します。
- ダーク:暗い背景で明るいフォントカラーを選択する。
- カスタム:手動でフィードのすべての色を選択します。
残りのカスタマイズオプションを使って、ヘッダーデザイン、ボタンスタイル、フィードサイズ、投稿数などを設定できます。
インスタグラムのフィードの見栄えに満足していますか?素晴らしい!保存を 忘れずにクリックして、下の最後のステップに進んでください。
ステップ5:InstagramのフィードをWordPressのウェブサイトに表示する
Instagram Feed Proの助けを借りて、あなたは2つの異なる方法でInstagramのフィードを埋め込むことができます:
- WordPressのページに: あなたのウェブサイトのページに直接フィードを統合します。
- WordPressのウィジェットエリアにサイドバー、フッター、その他のウィジェット対応ゾーンにフィードを表示します。
以下、両方のオプションについて説明しよう。
方法1:WordPressのページにInstagramのフィードを埋め込む
Instagram Feed Proを使えば、数回の簡単なクリックで、ライブフィードエディターから直接Instagramのフィードを埋め込むことができます。
まず、ライブフィードエディタの上部にある埋め込みボタンをクリックします。
次に、Instagram Feed ProはInstagramのコンテンツをどこに表示したいかを尋ねてくる。ここから、ページに追加するか、ウィジェットとして表示するか、手動でショートコードをコピーするかを選択できる。
続行するには、「ページに追加 」ボタンをクリックします。
ポップアップが表示され、サイト上のすべてのWordPressページのリストが表示され、1つを選択するよう求められます。
ページを選択し、下の追加 ボタンをクリックするだけです。
このプラグインは、インスタグラムのフィードを表示できるように、ワードプレスのページにあなたを送る。
新しいページが表示されたら、プラス(+)アイコンをクリックして新しいWordPressコンテンツブロックを追加します。
Instagramのフィード ブロックを探してクリックすると、Instagramのフィードが自動的にページに追加されます。
そして最後に、「更新 」をクリックすれば、WordPressのウェブサイト上でそれを実行することができます。実際にあなたのウェブサイトを開いて、どのように見えるか見てみましょう。
次に、インスタグラムのコンテンツをウェブサイトに表示する方法を見てみよう。
方法2:Instagramのフィードをサイドバーやフッターに埋め込む
Instagramのフィードをウェブサイトのサイドバーにウィジェットとして表示するには、まずWordPressの管理画面にアクセスします。
次に、Instagramのフィード " すべてのフィードメニューに移動し、埋め込みたいInstagramのフィードをクリックします。
ここから、上部にある埋め込み ボタンをクリックして、Instagramフィードの埋め込みを開始します。
埋め込みポップアップが開き、Instagramフィードの場所を選択できます。
インスタグラムをウェブサイトのサイドバーやフッターに表示するには、こちらの「ウィジェットに追加」ボタンをクリックしてください。
それをクリックすると、Instagram Feed Proはウィジェットの ページにあなたを送ります。ここでWordPressのウィジェットを追加、削除、管理することができる。
続行するには、サイドバーパネルを クリックします。
ウェブサイトのフッターにインスタグラムを表示したいですか?
次に、ここでフッターパネルをクリックする。
そうしたら、下部のプラス(+)アイコンをクリックして、新しいウィジェットをウェブサイトに追加することができます。
最後に、Instagramフィードウィジェットを クリックして、新しいInstagramフィードをウィジェットとして埋め込みます。
これで、あなたのウェブサイトをチェックアウトすると、サイドバーエリアに埋め込んだインスタグラムフィードが表示されます。
こうすることで、インスタグラムのフィードをサイト訪問者がサイト上のあらゆる場所で見ることができる!
以上、皆さん!
このステップバイステップのガイドが、あなたのウェブサイトにインスタグラムを表示するのに役立ったことを願っています。このチュートリアルのステップに従うことで、インスタグラムマーケティングを次のレベルに引き上げ、より多くのフォロワーとより多くの売上をすぐに得ることができます。
魅力的なInstagramフィードを作成する準備はできましたか?今すぐInstagram Feed Proを始めましょう!
結論インスタグラムフィードで簡単にエンゲージメントを高める
インスタグラムのコンテンツをワードプレスのウェブサイトに表示するのは複雑なことではありません。
Instagram Feed Proを使えば、数時間ではなく、わずか数分で美しく魅力的なフィードをサイトに表示させることができる。
他の方法でインスタグラムのコンテンツをウェブサイトに正しく表示させようとすると、フラストレーションがたまることを私は経験から知っている。
それこそが、このプラグインがとても役に立つ理由だ。頭痛の種をすべて取り除いてくれる。特別なスキルは必要なく、写真や動画がページ上に完璧に表示され、最新の投稿と一緒に自動的に更新されます。
あなたの素晴らしいインスタグラム・コンテンツをウェブサイトで簡単に紹介する準備はできましたか?次にお勧めするのはこちらです:
- Instagram Feed Proを手に入れよう。(試してみたい方は、14日間の返金保証があることをお忘れなく!)。
- 記事で紹介されている簡単なセットアップ手順に従ってください。
- 新しいインスタグラムのフィードが、パソコンと携帯電話の両方でどのように見えるかをご覧ください。
- 新鮮なビジュアルコンテンツが自動的に更新されます。
あなたのインスタグラムのフィードを表示することは、訪問者の興味を引きつけ、彼らとつながり、さらにはあなたのインスタグラムのフォロワーになってもらうための素晴らしい方法です。
Instagram Feed Proを使ってウェブサイトにインスタグラムを掲載することについて質問がありますか?下のコメント欄でお気軽にご質問ください!
ここにいる間に、インスタグラム・マーケティングのベスト・ヒントのリストもご覧ください。
よくある質問
Instagram Feed Proを使うのにコーディングスキルは必要ですか?
いいえ、Instagram Feed Proは、技術的な能力に関係なく、すべてのユーザーのために設計されています。ビジュアルカスタマイザーとガイド付きセットアップにより、コーディングは必要ありません。
Instagram Feed Proは私のInstagramアカウントで使用しても安全ですか?
はい、とても安全です。このプラグインは、あなたのInstagramアカウントへの読み取り専用アクセスを要求します。つまり、あなたのコンテンツを表示して表示することはできますが、あなたのプロフィールに変更や修正を加えることはできません。
どのようなインスタグラムのフィードを表示できますか?
手動の方法では、Instagramの単一投稿しか埋め込むことができません。しかし、Instagram Feed Proを使用している場合、タイムラインフィード、ハッシュタグフィード、メンションフィード、あるいは複合フィードタイプを表示することができます。
Instagram Feed Proは私のウェブサイトを遅くしますか?
いいえ、Instagram Feed Proは超高速パフォーマンスのために構築されており、ウェブサイトの速度に悪影響を与えることなく、フィードを素早く読み込むように最適化されています。
その他のソーシャルメディア・マーケティング・ガイド&チュートリアル(トップ・ピック)
- 中小企業のためのソーシャルメディア・マーケティングのヒント(+実例)
- ビジネスを成長させるインスタグラム・マーケティングのヒント
- Facebookでビジネスを促進する簡単なヒント(ほとんどが無料です)
- YouTubeチャンネルを0から1000まで増やす方法