ウェブサイトに Instagram リールを埋め込む方法 [簡単ガイド]
公開: 2022-09-19ウェブサイトに Instagram リールを埋め込みたいですか?
ウェブサイトに Instagram のリールを表示することで、訪問者を惹きつけ、コンテンツを視聴し続けることができます。
しかし、特にコーディングに慣れていない場合は、Instagram のコンテンツを Web サイトに埋め込むのは難しい場合があります。
ソリューション？ このチュートリアルでは、WordPress ウェブサイトに Instagram リールを埋め込む方法を紹介します。
その前に、Instagram リールがビジネスにどのように役立つかを見てみましょう。
または、ここをクリックしてチュートリアルに直接スキップすることもできます。
ウェブサイトに Instagram リールを埋め込む理由
Instagram リールを埋め込むことで、ビジネスに役立つ方法はたくさんあります。
人々があなたのウェブサイトにアクセスしたときに、Instagram のリールを表示して、コンテンツへの関心を維持できます。
結局のところ、リールは通常の Instagram ビデオよりも 67% 多くのエンゲージメントを獲得します。
その結果、ユーザーをサイトに長く滞在させ、同時により多くのビュー、いいね、フォロワーを獲得できます.
さらに、Instagram リールを使用して、サイトのレビューやデモンストレーションなどのユーザー生成コンテンツ (UGC)を表示することもできます。
そうすれば、Instagram ユーザーからの社会的証明を使用して、売り上げを伸ばし始めることができます。
そして、それはほんの始まりです！ リールを Instagram マーケティングに使用してビジネスを簡単に成長させる方法はたくさんあります。
それでは、Instagram コンテンツの埋め込みを開始する最も簡単な方法を見てみましょう。
WordPress に Instagram リールを埋め込む方法
ウェブサイトに Instagram コンテンツを埋め込む場合は、次の 2 つのオプションから選択できます。
- 手動: すべての Instagram 投稿の HTML 埋め込みコードを収集し、手動でコードを Web サイトに挿入します。
- 自動: Instagram コンテンツを Web サイトに自動的に埋め込むことができる WordPress プラグインを使用するだけです。
最初の方法を選択すると、Instagram の投稿をサイトに埋め込むのに多くの時間と労力がかかる可能性があります。 Instagram のリールをたくさん表示したい場合は、大量のカスタム HTML コードを処理する必要があります。
さらに、Instagram コンテンツの外観をカスタマイズする場合は、このコードを手動でカスタマイズする必要があります。
あなたが技術に精通していない場合、これは、開発者を雇ってカスタマイズするためにお金を費やすことを意味します.
また、このコードを Web サイトに埋め込む際に問題が発生した場合、サポート チームが対応してくれません。
幸いなことに、自動方法を使用して Instagram リールを Web サイトに簡単に埋め込むことができます。
WordPress に Instagram リールを埋め込む最も簡単な方法
必要なのは Instagram Feed Pro のような WordPress プラグインだけで、数回クリックするだけで Instagram コンテンツを埋め込むことができます。
このプラグインを使用すると、WordPress サイトで Instagram コンテンツを含むフィードを簡単に作成、カスタマイズ、および埋め込むことができます。
Instagram リールに加えて、埋め込みたい Instagram コンテンツの種類に関しては、たくさんのオプションがあります。 Instagram の動画、写真、ハッシュタグ フィード、Instagram のストーリーなどを表示できます。
3 ステップのガイド付きフローに従うだけで、Instagram フィードを埋め込むプロセス全体を実行できます。
美しいフィードを簡単に作成するために、リアルタイム プレビューを備えたプラグインのライブ フィード エディターを使用できます。
Instagram Feed Proは、多くの機能を備えているだけでなく、軽量で高速になるようにゼロから構築されています.
そのため、Instagram のコンテンツを好きなだけ表示でき、ウェブサイトの読み込みも非常に高速です。 また、高速な Web サイトを使用すると、SEO が大幅に向上し、より多くの人に簡単にリーチできます。
これらすべての素晴らしい機能により、 100 万人以上のユーザーから4.9/5 の星の評価を得て、市場で最高の Instagram フィード プラグインです。
簡単に Instagram リールの埋め込みを開始したいですか? 今すぐ Instagram Feed Pro を入手してください。
それでは、このプラグインを使用して Instagram のリールを Web サイトに表示する方法を見てみましょう。
ウェブサイトに Instagram リールを埋め込む方法
始めて、このプラグインを使用して Instagram リールを WordPress に簡単に埋め込む方法を見てみましょう.
以下の手順に従うだけです。
ステップ 1: Instagram Feed Pro プラグインをインストールする
まず、ここで Instagram Feed Pro のコピーを入手してから、WordPress Web サイトにインストールします。
方法がわからない？ WordPressプラグインをインストールする方法については、このステップバイステップガイドをご覧ください.
プラグインをインストールしてアクティブ化したら、以下のステップ 2 に進むことができます。
ステップ 2: Instagram フィードを作成する
プラグインの準備ができたら、リールを表示するために使用できる Instagram フィードを作成できます。
まず、WordPress ダッシュボードからInstagram フィード » すべてのフィードメニューに移動します。
このページで、上部にある [新規追加] ボタンをクリックします。
これを行うと、プラグインは Instagram フィードの 3 つのオプションから選択するように求めます。
- ユーザー タイムライン: Instagram プロフィールのコンテンツを表示する
- 公開ハッシュタグ:選択したハッシュタグを持つすべての Instagram 投稿を埋め込みます
- タグ付けされた投稿:アカウントにタグ付けされた Instagram の写真とビデオを表示します
複数のオプションを選択して、さまざまな Instagram フィード タイプを 1 つに結合することもできます。
続行するには、フィード タイプを選択し、[次へ] をクリックします。
フィードを作成したので、ステップ 3 に進み、それを Instagram アカウントに接続できます。
ステップ 3: フィードを Instagram に接続する
Instagram アカウントを接続すると、フィードに Instagram の写真、ビデオ、リールを Web サイトに表示できます。
始める準備はできましたか？ まず、[ソースの追加] ボタンをクリックします。
これを行うと、ポップアップが開き、個人アカウントまたはビジネスInstagramアカウントのどちらを接続するかを選択できます.
個人アカウントでは、自分のアカウントからのみ Instagram コンテンツを埋め込むことができます。
一方、ビジネス アカウントでは、Instagram ハッシュタグ フィード、タグ付きフィード、ショッピング可能なフィードなど、さまざまな Instagram コンテンツを表示できます。
ポップアップでアカウントの種類を選択し、[ Instagram でログイン] をクリックして続行します。
これにより、Web ブラウザーで Instagram が開き、フィードを Instagram アカウントに接続することができます。
ここで、Instagram Feed Pro は、アカウントへの読み取り専用アクセスを要求します。 このアクセスを使用すると、プラグインは Instagram コンテンツのみを表示でき、変更を加えることができなくなります。
[許可]をクリックするだけで、Instagram アカウントの接続が完了します。
これで、プラグインによって Web サイトに戻ります。
ここで、[次へ] をクリックして、このアカウントを Instagram フィードのソースとして確認できます。
将来、新しい Instagram フィードを作成するときに、ワンクリックでこのソースを選択できます。
Instagram アカウントを接続したので、ステップ 4 でフィードをカスタマイズできます。
ステップ 4: Instagram リールをカスタマイズする
Instagram アカウントの接続が完了すると、プラグインによってライブ フィード エディターが表示されます。
ここでは、左側を見て、フィード レイアウト、配色、ヘッダー スタイル、ギャラリー サイズなどをカスタマイズするオプションを見つけることができます。
右側には、Instagram フィードのライブ プレビューが表示されます。
開始するには、Instagram フィードをフィルタリングして、ビデオ リールの表示を開始できます。
まず、上部の[設定]オプションを選択してから、下の [フィルターとモデレーション] オプションをクリックします。
ここから、フィードに表示する Instagram 投稿の種類を選択できます。
リールを表示するには、[特定のタイプの投稿を表示する] オプションを探し、[写真] オプションのチェックを外します。
その後、[保存] ボタンをクリックして変更を確認します。
次に、上部の[設定]ボタンをクリックして、Instagram フィードのカスタマイズを続けることができます。
その後、[カスタマイズ] をクリックして、ここからメインのカスタマイズ オプションに戻ります。
Instagram Feed Pro プラグインを使用すると、リールのレイアウトを変更できます。
これを行うには、左側の [フィード レイアウト] オプションを探します。
グリッド、カルーセル、メーソンリー、ハイライトの 4 つの異なるフィード レイアウト オプションから選択できるようになりました。
以下のオプションを見てみましょう。
グリッドレイアウトを使用すると、Instagram のリールをきれいな行と列で表示できます。 そうすれば、Web サイトに一度に大量の動画コンテンツを表示できます。
次に、Instagram カルーセル スライダーで Instagram リールを表示するために使用できるカルーセルレイアウトがあります。
これは、Web サイトをよりインタラクティブにするための優れた方法です。
Instagram のリール動画の元の比率を維持したいですか?
その場合は、石積みオプションを選択するだけです。
キャプションなどの余分な情報を削除することで、Instagram リールに焦点を当てることができるハイライトオプションを使用することもできます。
このレイアウトは、Web サイトで Instagram のリールを明確に表示するのに役立ちます。
Instagram フィードのレイアウトを選択したら、[保存] ボタンをもう一度クリックします。
[カスタマイズ] ボタンをクリックして、メインのカスタマイズ オプションに戻ります。
次に、Instagram Feed Pro プラグインを使用して、Instagram フィードの色を変更できます。
開始するには、左側の配色オプションを選択するだけです。
Instagram リールの色を簡単に変更できるように、次の 4 つの異なる配色から選択できます。
- テーマから継承: WordPress テーマの色をコピーします
- ライト:明るい背景と暗いフォントの色を表示します
- ダーク:フィードの背景を暗くし、フォントを明るい色で表示します
- カスタム:自分ですべての色を手動で選択します
フィードの色を選択したら、もう一度 [保存] をクリックします。
ご覧のとおり、Instagram Feed Pro を使用すると、ウェブサイトでの Instagram コンテンツの表示方法を非常に簡単にカスタマイズできます。
残りのオプションを使用して、ヘッダー、投稿スタイル、ボタン デザインなどを変更できます。
最後に、Instagram フィードのデザインに満足したら、[保存] をクリックします。
その後、最終ステップに進み、Instagram フィードを埋め込みます。
ステップ 4: Instagram リールを埋め込む
このプラグインを使用すると、Web サイトに Instagram リールを表示する方法が 2 つあります。
- ページに Instagram リールを埋め込む
- サイドバーまたはフッターに Instagram リールを埋め込む
以下のこれらの方法の両方を使用する方法を見てみましょう。
ページに Instagram リールを埋め込む
ライブ フィード エディターを使用すると、数回クリックするだけで Instagram リールを Web ページに埋め込むことができます。
そのためには、まず、上部にある [埋め込み] ボタンをクリックします。
その後、Instagram Feed Pro は Instagram フィードの場所を選択するように求めます。 ページに表示したり、ウィジェットとして埋め込んだり、ショートコードをここにコピーしたりできます。
ここでは、ポップアップの [ページに追加] ボタンをクリックします。
次に、ポップアップに、Web サイトの WordPress ページのリストが表示されます。
続行するには、リストからページを選択し、[追加] ボタンをクリックします。
それを行った後、プラグインはWordPressエディターでページを開き、Instagramリールを埋め込むことができます.
まず、プラス アイコン (+)をクリックして、新しいコンテンツ ブロックを追加します。
次に、上部の検索バーを使用して「Instagram」ブロックを探します。
検索結果から、 Instagram フィードブロックをクリックしてリールを埋め込みます。
[更新] をクリックすると、Instagram リールが Web サイトでライブになります。
Web サイトを開くと、Instagram のコンテンツが Web ページに表示されます。
それでは、Instagram リールをサイトに埋め込む次の方法を見てみましょう。
サイドバーまたはフッターに Instagram リールを埋め込む
このプラグインを使用すると、ウェブサイトのサイドバーまたはフッターにリールを表示する Instagram ウィジェットを作成できます。
まず、ダッシュボードからInstagram フィード » すべてのフィードメニューを開き、先ほどの Instagram フィードを選択します。
これにより、ライブ フィード エディターでフィードをもう一度開くことができます。
ここから、右上隅にある [埋め込み] ボタンをクリックして、Instagram リールの埋め込みを開始します。
それをクリックすると、Instagram リールをどこに埋め込むかを尋ねるポップアップが開きます。
今回は、ポップアップの [ウィジェットに追加] ボタンをクリックします。
これで、新しい Instagram ウィジェットの場所を選択できます。
サイドバーに Instagram リールを埋め込むには、サイドバーパネルをクリックします。
または、フッターパネルをクリックして、ウェブサイトのフッターにリールを表示することもできます。
この例では、サイドバーを使用します。
下部にあるプラス アイコン (+)をクリックして、新しいウィジェットを追加できるようになりました。 最後に、オプションからInstagram フィードウィジェットを選択します。
その後、[更新] をクリックすると、Instagram のリールが公開され、誰もが見ることができます。
実際、今すぐ Web サイトを開いて、訪問者にどのように表示されるかを確認できます。
以上です！
このガイドに従うだけで、数回クリックするだけでウェブサイトに Instagram リールを埋め込むことができます。コーディングは必要ありません。
その後、Instagramのフォロワーを増やし、コンバージョンを増やし、ビジネスを簡単に成長させることができます.
Instagram フィードを埋め込む準備はできましたか? Instagram Feed Pro のコピーを今すぐ入手してください。
Instagramでフォロワーを増やす方法をお探しですか? Instagramのフォロワーを増やす方法に関する便利なガイドをご覧ください.
この記事を気に入っていただけた場合は、Twitter や Facebook でフォローして、ソーシャル メディア マーケティングのチュートリアルをご覧ください。