WordPress サイトに Instagram フッター ウィジェットを追加して、ウェブサイトのビジュアルを強化したいですか?
フッター セクションに Instagram フィードを掲載すると、最新の投稿が表示され、エンゲージメントが高まり、フォロワーの増加につながります。
しかし、Instagram フッター ウィジェットを WordPress で完璧に表示するのは難しい場合があります。特に、コーディングや技術的な手順に慣れていない場合はなおさらです。
初めて Instagram ウィジェットをサイトのフッターに追加しようとしたとき、見栄えがよく完璧に機能する解決策を見つけるまで、いくつかのハードルに遭遇しました。
Smash Balloon で長年にわたり、WordPress ユーザーが Instagram コンテンツを美しく表示できるようサポートしてきた経験から、あらゆるスキル レベルに最適な方法を学んできました。
この記事では、Instagram フッター ウィジェットを WordPress に追加する方法について詳しく説明します。このプロセスにまったく慣れていない場合でも、スクリーンショットを使用して手順を追って説明します。
Instagramのフッターウィジェットを埋め込む2つの方法
あなたのウェブサイトのフッターにInstagramのウィジェットを表示したいですか?2つの方法があります:
- マニュアル:公式アプリ開発者として承認され、サイトに追加する前にコードスニペットを生成します。
- 自動で:信頼できるWordPressプラグインを使って、Instagramのコンテンツを自動的にフッターに埋め込む。
手作業がいかに時間がかかり、複雑であるかは想像がつくと思う。さらに、アプリ開発者としてインスタグラムに承認される必要がある。
代わりに、Instagramのフィードプラグインを使用し、5つのステップで簡単にInstagramのフッターウィジェットを埋め込むことができます:
インスタグラムのフッターをサイトに埋め込む方法のビデオチュートリアル
ウェブサイトにインスタグラムのフッターを追加する最も簡単な方法
素晴らしいオプションはたくさんあるが、このチュートリアルではInstagram Feed Proを使うことにしよう。
使い方はとても簡単で、埋め込みコードも必要なく、セットアップも超高速だ。ウィジェットを埋め込むのに便利なWordPressウィジェットもあります。
プロからのアドバイス プラグインを選ぶ前に、ユーザーレビューをチェックすることを忘れずに。例えば、Instagram Feed Proは100万人以上のユーザーから4.9/5つ星の評価を得ています。
これらを踏まえて、Instagramのコンテンツをフッターに表示する手順を説明しよう。
ステップ1:Instagram Feed Proプラグインをインストールする
最初のステップは、Instagram Feed Proプラグインを入手することだ。
次に、WordPressプラグインをインストールするためのステップバイステップの手順に従って、先に進み、WordPressウェブサイトにプラグインをインストールします。
ステップ2:Instagramフッターウィジェットフィードを作成する
すでにウェブサイトにプラグインをインストール済みですか?はい!
次のステップは、プラグインを使用して新しいInstagramフィードを作成することです。これを行うには、WordPressのダッシュボードからInstagram Feed " All Feedsに 移動します。そして、新規追加を クリックして接続する。

この後、ウェブサイトに掲載するインスタグラムのフィードの種類を選ぶことができる。選択肢は以下の通り:
- ユーザーのタイムライン: 自分のアカウントに基づいてInstagramのフッターウィジェットを表示します。
- 公開ハッシュタグ: 指定したハッシュタグに基づいてInstagramのフッターウィジェットを表示します。
- タグ付き投稿: あなたのInstagramアカウントが他のユーザーによって言及されたり、タグ付けされた投稿を含むInstagramのフッターウィジェットを表示します。
複数のフィードを組み合わせて1つのInstagramフッターウィジェットに表示するために、ここで複数のオプションを選択することもできます。
インスタグラムのフィードタイプを選んだら、「次へ」 ボタンをクリックします。

これで新しいInstagramフィードが作成できたので、ステップ3に進み、このフィードのソースを追加することができる。
ステップ3:インスタグラムのアカウントに接続する
新しいフィードにインスタグラムからの投稿を表示するには、インスタグラムのアカウントに接続します。
そのためにはまず、 ソースの追加 ボタンをクリックする。

そうすると、2種類の接続を選択できるポップアップが開きます:
- ビジネス・ベーシック:自社のインスタグラムの投稿を表示する
- ビジネス上級者向け: 投稿に加えてInstagramのハッシュタグやメンションを埋め込む
気に入ったオプションを選択したら、「接続」をクリックする。

このガイドでは1つのアカウントからの投稿を埋め込むので、基本オプションを選んだ。
次のページで、Instagramと接続するボタンをクリックします。

これで、プラグインにInstagramアカウントへの読み取り専用 アクセス権を与えることができる。
読み取り専用アクセスとは、プラグインがあなたのデータを見ることができるだけで、変更は一切できないということです。ですから、Instagram Feed Proを使うのは安全です。
読み取り専用アクセスを確認するには、ポップアップで「許可 」をクリックするだけです。

これでWordPressサイトに戻ります。ここで、Next ボタンをクリックして次に進みます。

ステップ4:Instagramフッターウィジェットをカスタマイズする
そうすると、Instagram Feed Proがあなたの投稿を取得し、Instagramウィジェットを作成します。
続行する前に、このウィジェットのテーマを選択できます。それぞれのテーマはアイコン、ヘッダー、ボーダーなどにユニークな外観を持っています:
- デフォルト
- モダン
- ソーシャルウォール
- 概要
- オーバーラップ
テーマを選び、「次へ」をクリックする。

その後、テンプレートを選ぶことで、さらにデザインを変えることができる:
- デフォルト
- シンプルなグリッド
- シンプル・グリッドXL
- シンプルな列
- シンプルなカルーセル
- 石工カード
- カードグリッド
- ハイライト
Simple Rowの ように、フッター専用にデザインされたテンプレートもある。
私は基本的なものを求めているので、デフォルトの オプションを選ぶよ。
テンプレートを選択したら、「Next」をクリックします。

Instagramのフッターウィジェットの見た目をカスタマイズしたいですか?このプラグインがあなたをカバーします!
ビジュアル フィード エディターを使用すると、数回クリックするだけで Instagram コンテンツの外観と雰囲気を簡単に制御できます。
左側のパネルでは、Instagramフッターウィジェットのサイズ、フィードレイアウト、フィードテーマ、カラースキーム、ヘッダーデザインなどを簡単に変更できます。また、個々のInstagram投稿をカスタマイズするオプションも用意されています。

右側には、インスタグラムのフッターウィジェットのライブプレビューがあり、リアルタイムで変更を確認することができます。
フッターのデザインをより自由にコントロールするために、レイアウトをカスタマイズすることもできます。フィードレイアウトオプションを クリックしてください。

ここから、あなたのインスタグラムフィード用に4つの既製レイアウトタイプから選ぶことができる:
- グリッド
- カルーセル
- 石工
- ハイライト

グリッドレイアウトを 選択すると、Instagramフッターウィジェットを固定正方形画像サイズの標準グリッドに表示できます。
このタイプのレイアウトは、Instagramウィジェットをサイドバーエリアに追加したい場合に適している。

フッターエリアにより 適したものをお望みですか?それなら、カルーセルレイアウトを 選択することができます。このように、訪問者がスクロールできる美しいスライドショーでインスタグラムのフィードを表示できます。

インスタグラムの写真をオリジナルの横長または縦長のフォーマットで表示したいですか?
それなら、メイソン・レイアウトが おすすめだ。このように、フッターウィジェットとしてコンテンツを紹介することを目的としたインスタグラムのギャラリーに最適です:

最後に、WordPressのInstagramフッターウィジェットでハイライトしたい特定の投稿がある場合は、ハイライトレイアウトを 選択します。
ハイライトされた投稿は他の画像よりも2倍大きく表示されるため、このウィジェットをフッターエリアに表示することで、ブランドに関するポジティブな社会的証明を示すことができます。

Instagramフッターウィジェットのレイアウトを選択したら、「保存 」をクリックして選択を確定する。
次に、小さな カスタマイズ ボタンをクリックし、メインのカスタマイズオプションをもう一度開きます。

インスタグラムのフッターウィジェットの色を変更したいですか?ここの配色 オプションをクリックしてください。

ソーシャルメディア・ウィジェットには4つの異なるカラースキームから選ぶことができるので、インスタグラム・フィードのカラーオプションを設定するのは簡単です:
- テーマからの継承:ワンクリックでサイトのカラーをコピーし、ブランディングにマッチさせる。
- 明るい: 明るい背景と暗いフォントのインスタグラムフィード
- ダーク: 明るいフォントの代わりに暗い背景を表示する。
- カスタム: インスタグラムのフィードカラーをすべて手動で選択

色に満足したら保存 ボタンをクリックするだけです。
そうすれば、ライブフィードエディターを使って、ヘッダースタイル、フォローボタン、フィードサイズなど、残りのカスタマイズオプションを変更することができます。
フィードの見た目に満足したら、「保存 」をクリックし、以下の最後のステップに進みます。
ステップ5:Instagramフッターウィジェットをサイトに追加する
さて、いよいよInstagramのフッターウィジェットをWordPressウェブサイトに表示する時が来た。
このプラグインはWordPressとスムーズに連動するので、ライブフィードエディターで簡単にこれを行うことができる。
まず、ライブフィードエディタの右上にある埋め込み ボタンをクリックします。

すると、インスタグラムのフィードを埋め込む場所を尋ねるポップアップが表示されます。WordPressのフッターに追加するので、ここでAdd to a Widget オプションをクリックします。

WordPressサイトのウィジェットページが 開きます。
フッターパネルを クリックしてください。

プラス(+)アイコンをクリックして、新しいウィジェットを追加します。そして、Instagram Feed ウィジェットを探してクリックする。

最後に、InstagramのフッターウィジェットがWordPressウェブサイトに自動的に追加されるように、「更新」をクリックします。
これで、あなたのウェブサイトの訪問者は、フッターエリアをチェックしたときに、このようにInstagramのフッターウィジェットを見ることができます:

そして、それだけだ!
この初心者にやさしいチュートリアルの助けを借りて、InstagramのフッターウィジェットをWordPressウェブサイトに埋め込む方法を知ることができる。
Instagramウィジェットを使えば、ソーシャルメディアでの存在感を高め、あっという間に大量の新規顧客を獲得することができる。
Instagramマーケティングを次のレベルに引き上げ、WordPressでInstagramのフッターウィジェットを表示する準備はできていますか?
インスタグラムをもっと活用したいですか?あなたのビジネスに最適なInstagramマーケティングのヒントをご覧ください。
その他のソーシャルメディア・マーケティング・ガイドとヒント
- InstagramのフィードをElementorに追加する方法(5分で)
- ウェブサイトに最適なFacebook WordPressプラグイン
- アフィリエイト・マーケティングにおけるソーシャルメディアの活用法
- YouTube Shorts vs TikTok:あなたに最適なのはどちら?