ワードプレスでインスタグラムウィジェットを追加する方法(ステップバイステップガイド)

インスタグラムワードプレスウィジェット

あなたのワードプレスブログにインスタグラムウィジェットを追加する方法を学ぶためにアリ?ブログにInstagramフィードを表示することは、読者とのエンゲージメントを高めたり、追加のコンテンツを提供したりするための優れた方法です。

インスタグラムアカウントをワードプレスブログに接続するのは難しいように思えるかもしれませんが、そうではありません!

この記事では、Instagramウィジェットをブログに簡単に追加する方法を紹介します:手動とInstagramフィード用のWordPressプラグインの使用。また、Instagramウィジェットを追加すると、ブログの成長に役立つすべての方法についても見ていきます。

こんにちは。

飛び込みましょう!

 

ワードプレスウィジェットとは何ですか?

まず、WordPressを初めて使用する場合は、WordPressウィジェットとは何か疑問に思われるかもしれません。

ウィジェットは基本的に、 サイドバー、フッター、およびWordPressサイトの他の領域に追加できるコンテンツの小さなブロックです

WordPressウィジェットは、人気のあるブログ投稿の表示、フォームの追加、ソーシャルメディアフィードの表示など、さまざまな機能で利用できます。

以下の例では、Studio Mommyは、ソーシャルメディアアイコン、ニュースレターのサインアップフォームなどとともに、WebサイトのフッターにInstagramウィジェットを追加しました

インスタグラム-フィード-スタジオ-ママ

インスタグラムウィジェットをWordPressに追加することは、あなたのブログにとって特に有益です。

理由を知るために読んでください。 

あなたのワードプレスブログにインスタグラムウィジェットを追加することの利点

InstagramウィジェットをWordPressに追加すると、ウェブサイトを改善し、ブログを成長させるのに役立つ方法はたくさんあります。

それでは、ブログにInstagramフィードを追加する必要がある理由を詳しく見てみましょう。 

訪問者により多くのコンテンツを提供する

Instagramフィードをブログに追加すると、ウェブサイトの訪問者にチェックアウトするより興味深いコンテンツが提供されます。あなたの最後の投稿を読んだ後にあなたのブログを離れる代わりに、彼らはあなたのウェブサイトを離れることなくあなたのInstagramフィードをスクロールすることができます。

この追加コンテンツは、訪問者があなたのウェブサイトに長くとどまることを奨励します。

SEOを改善する

インスタグラムウィジェットをワードプレスに追加すると、インスタグラムのキャプションがサイトに埋め込まれます。

これは、検索エンジンがあなたのブログが何であるかをよりよく理解するのに役立ち、SEO(検索エンジン最適化)を改善し、サイトへのトラフィックを増やすのに役立ちます。 

エンゲージメントとフォロワーを増やす

あなたのブログの読者はあなたがInstagramにいることを知らないかもしれません。次に、Instagramウィジェットをブログに追加することで、プラットフォームでアクティブであることを知らせます。

これは、Instagramでより多くのフォロワーを獲得し、ソーシャルメディアでの存在感を高めるのに役立ちます。

また、読者があなたのブログであなたの最新のInstagram投稿を見ることができるとき、それは彼らがいいねやコメントすることによってあなたの投稿にもっと関与することを奨励します。 

ブログを簡単に更新する

ブログにInstagramフィードを埋め込むと、サイトを新しいコンテンツで簡単に最新の状態に保つことができます。Instagramに新しいコンテンツを投稿するたびに、そのコンテンツは自動的にWebサイトに表示されます。これにより、時間を節約し、ブログが公開されていることを示します。 

社会的証明と信頼を築く

Instagramで読者からの推薦状などのユーザー生成コンテンツを共有する場合Instagramウィジェットをサイトに追加すると、Webサイトの訪問者との社会的証明と信頼を築くのに役立ちます。

あなたのサイトのユーザーは、他の人があなたのブログを信頼していることを見るでしょう、そしてそれは彼らも忠実なファンになることを奨励するでしょう。

InstagramアカウントをWordPressに接続することのすべての利点がわかったので、チュートリアルに直接ジャンプしましょう。 

ワードプレスでインスタグラムウィジェットを追加する方法(手動)

プラグインなしでWordPressにInstagramウィジェットを追加したい場合は、手動で追加できます。

プラグインを使用することをお勧めします プラグイン それはより簡単で、他の多くの表示およびカスタマイズオプションを提供するため、次のセクションでそれらについて説明します。

また、手動の方法ではエラーの余地が十分にあり、コードに慣れていない場合は修正が難しい場合があります。

ただし、Instagramウィジェットを手動で追加するには、Instagramアカウントに移動して、ブログに表示する写真を選択することから始めます。

Instagramの投稿の右上隅にある3つの小さなドットをクリックします。次に、[埋め込み] をクリックします

インスタグラムの埋め込み

次のステップで、青い [埋め込むコードをコピー] ボタンをクリックします。ここでは、[キャプションを含める]チェックボックスをオフにすることで、必要に応じて埋め込みからキャプションを削除するオプションもあります

付属のコードをコピーします

埋め込みコードをコピーした後、WordPressエディターを使用して任意の投稿またはページに貼り付けるだけです。

埋め込みコードをコピーした状態で、WordPressのサイドバーにInstagramウィジェットを追加する場合は、WordPressダッシュボードに移動します。次に、外観»ウィジェットに移動します。

ウィジェット-外観-ダッシュボード

[ウィジェット] ページの左側に、使用可能なウィジェットのリストが表示されます。テキスト ウィジェットを見つけて、サイトのページを表示するページの右側にドラッグします。 このチュートリアルでは、サイドバーに追加します。

テキストウィジェットをサイドバーにドラッグします

サイト上の目的の場所にウィジェットを配置したら、ウィジェットのドロップダウン矢印をクリックします。

ドロップダウンメニュー

前にコピーしたInstagram埋め込みコードを貼り付けることができるテキストボックスが開きます。埋め込みコードは、ビジュアルエディターではなくテキストエディターに貼り付けてください

貼り付け埋め込みコード

Instagramフィードのタイトルを追加することもできます。完了したら [保存] をクリックします。

それだけです。

これで、Instagramウィジェットをブログでライブで見ることができます。

インスタグラムサイドバーウィジェット

上記の例からわかるように、WordPressでInstagramウィジェットを手動で追加する場合、多くのカスタマイズオプションはありません。

それでは、インスタグラムウィジェットをWordPressに追加するより良い方法を見てみましょう。

ワードプレスでインスタグラムウィジェットを追加する方法(プラグインを使用)

インスタグラムウィジェットをWordPressに追加する最も簡単で最良の方法は、プラグインを使用することです。スマッシュバルーンのInstagramフィードプロプラグインをお勧めします

インスタグラムフィードプロバルーンスマッシュ

インスタグラムフィードプロは、 ワードプレスナンバー1のための最高評価のインスタグラムプラグインです。

このスマッシュバルーンプルギンを使用すると、数回クリックするだけで、Instagramフィードをサイドバーウィジェットとして、WordPressのブロックエディターを使用してブログの任意の投稿またはページに簡単に追加したり、サイトの任意の場所にショートコードを貼り付けたりできます。

さらに、Instagramフィードプロには、強力でパーソナライズされたInstagramウィジェットを作成するのに役立つ次のような優れた機能が付属しています。

  • 複数のレイアウトオプション: カルーセル、グリッド、組積造、ハイライトなどの組み込みレイアウトオプションから選択します。 
  • ビジュアルモデレーションシステム: 表示する投稿と非表示にする投稿を決定します。 
  • ソーシャルエンゲージメント: Instagramのストーリー、コメント、いいね、フィードの[フォロー]ボタンを表示します。 
  • レスポンシブデザイン: さまざまな画面サイズに自動的に適応して、フィードをモバイルフレンドリーにします。
  • 複数のInstagramフィード: サイト上のあらゆる種類のフィードを表示します。 

スマッシュバルーンは プラグインの無料バージョンも提供しているので、試してみることができます。

ただし、複数のレイアウト、コメントやいいね、ハッシュタグフィードなどの機能にアクセスするには、プロバージョンにアップグレードする必要があります

それでは、スマッシュバルーンを使用してWordPressにInstagramウィジェットを追加する方法を段階的に見てみましょう。 

ステップ1:インスタグラムフィードプラグインをインストールする

まず、スマッシュバルーンからInstagramフィードプロをダウンロードし、プラグインをインストールしてアクティブ化する必要があります。手始めに、詳細な手順については、WordPressプラグインのインストール方法に関するこの投稿を確認してください

 

ステップ2:インスタグラムアカウントをプラグインに接続する

次に、Instagramアカウントをスマッシュバルーンプラグインにリンクする必要があります。これを行うには、プラグインをダウンロードしてアクティブ化した後に表示されるWordPressダッシュボードのInstagramフィードボタンをクリックします。これにより、Instagramフィードプラグインの[設定]ページに移動します。

青いをクリックします Instagramアカウントをリンクする ボタン 。

リンク-インスタグラム-アカウント

画面の指示に従って、Instagramアカウントを接続します。

最初のプロンプトでは、接続するかどうかを尋ねられます 個人またはビジネスのInstagramアカウント

個人ビジネスアカウント

ハッシュタグフィードや購入可能な投稿など、スマッシュバルーンInstagramフィードの一部の機能には、Instagramビジネスアカウントが必要であることに注意することが重要です。

後でいつでも変更できるため、現在必要なInstagramアカウントの種類について心配する必要はありません。

Instagramアカウントの種類を選択し、[接続]をクリックして続行します。

それだけです!これで、インスタグラムアカウントがインスタグラムフィードプラグインに接続されました。 

ステップ3:表示するインスタグラムのコンテンツを選択する

同じページで、Instagramウィジェットに表示するInstagramコンテンツの種類を選択することもできます。

次の表示を選択できます。

  • 標準のインスタグラムフィード
  • 特定の公開ハッシュタグの写真を含むフィード
  • 自分がタグ付けされた写真を含むフィード
  • 複数のフィードタイプを持つ混合フィード
インスタグラムフィードタイプ

最新のInstagram投稿の簡単なフィードを表示するには、[ユーザーアカウント]オプションを選択し、[変更を保存]をクリックします 。 

ステップ4:インスタグラムウィジェットのレイアウトを選択する

Instagramフィードプラグインの[設定]ページに移動し、[カスタマイズ]タブをクリックします。

スマッシュボールカスタマイズカード

このページでは、次のようなカスタマイズオプションを使用して、Instagramウィジェットがブログでどのように表示されるかを決定できます。

  • 幅と高さ
  • 背景色
  • 表示する写真の数
  • インスタグラムの略歴を表示/非表示にする
  • [フォロー] ボタンを追加する

Instagramウィジェットに含めるレイアウトのタイプを選択することもできます。スマッシュバルーンのInstagramフィードには、4つの異なるレイアウトオプションから選択できます。

  • グリッド:静止正方形の画像を含む標準グリッド
  • カルーセル: ユーザーがスクロールできる水平カルーセル
  • 石積み – Instagramの写真を元の風景またはポートレート形式で表示するギャラリー
  • ハイライト: 特定の写真がグリッド内で大きく表示され、強調表示されるギャラリー

このチュートリアルでは、次のようなグリッドレイアウトを選択します。

スマッシュバルーンインスタグラムグリッドレイアウト

目的のレイアウトのタイプを選択し、[ 変更を保存] をクリックします。

ステップ5:ワードプレスにあなたのインスタグラムウィジェットを追加する

さあ、Instagramウィジェットをブログに追加します。

スマッシュバルーンのInstagramフィードプラグインを使用すると、フィードを埋め込む3つの異なる方法があります。

それぞれを調べてみましょう。 

1. インスタグラムフィードワードプレスブロック

WordPressのブロックエディターを使用してウェブサイトの新しいページにInstagramウィジェットを追加するには、まずページ»新規追加に移動します

ワードプレスブロックエディターで、プラス(+)アイコンをクリックしてワードプレスブロックを検索します。検索バーに「インスタグラム」と入力して、ワードプレスフィードインスタグラムブロックを見つけます

ワードプレスブロックウィジェット

ブロックをクリックしてページに追加します。

次に、InstagramフィードがWebサイトでどのように表示されるかをプレビューし、必要に応じて設定を微調整できます。

ページを公開して、Instagramフィードウィジェットをブログで公開しましょう!

完成品の例を次に示します。

インスタグラムフィードスマッシュバルーン

同じ方法を使用して、サイトの既存のページまたは投稿にInstagramフィードを追加できます。 

2. インスタグラムフィードのショートコード

従来のWordPressエディターを使用している場合は、Instagramフィードのショートコードを使用して、サイトの投稿またはページにフィードを表示できます。

インスタグラムのフィード設定ページに移動します。[フィードの表示] タブで、表示されたショートコードをコピーします。

フィードショートコード

次に、ショートコードを投稿またはページエディターに直接貼り付けるだけです。

貼り付けショートコード

[投稿]をクリックして変更を保存し、Instagramフィードをサイトで公開します。 

3. インスタグラムのフィードのためのワードプレスウィジェット

Instagramウィジェットをフッターやメインサイドバーなどのサイドバーに表示する場合は、スマッシュバルーンの組み込みのInstagramフィードウィジェットを使用できます。 

WordPress ダッシュボードから [外観] » [ウィジェット] に移動します。 

左側にあるInstagramフィードウィジェットを見つけて、選択したサイドバーにドラッグします。このチュートリアルでは、メインサイドバーにInstagramウィジェットを追加します。 

スマッシュバルーンウィジェット

設定では、タイトルを追加できます。完了したら、[保存] をクリックします。 

これで、サイトをプレビューすると、サイドバーにInstagramフィードが表示されます。 

サイドバー-インスタグラム-フィード

それは結論です!

これで、WordPressでインスタグラムウィジェットを簡単に追加する方法を学びました。Instagramフィードをブログに美しく表示することで、読者により興味深いコンテンツを提供し、エンゲージメントを高め、ソーシャルメディアでの存在感を高めることができます。

あなたのブログでもFacebookフィードを見たいですか?ワードプレスのための最高のFacebookプラグインのリストをチェックしてください。また、WordPressにFacebookグループを埋め込む方法に関するチュートリアルを読むこともできます

そして、 より役立つブログのヒントのために私たちの電子メールニュースレターにサインアップすることを忘れないでください!

Open

info.ibdi.it@gmail.com

Close