NEW ARTICLE
iPhoneの初期化ちょっと待った！！【2022最新】iリンゴループ！起動不良の原因が容量不足なら復元・初期化なしで直す方法！最後の頼みの綱はDr.Foneで解決。
  • 【WordPress】ワードプレスブログで超簡単にInstagramのフィードを表示するプラグイン「Smash Balloon Social Photo Feed」の設定方法を解説

【WordPress】ワードプレスブログで超簡単にInstagramのフィードを表示するプラグイン「Smash Balloon Social Photo Feed」の設定方法を解説

【WordPress】ワードプレスブログで超簡単にInstagramのフィードを表示するプラグイン「Smash Balloon Social Photo Feed」の設定方法を解説

こんな感じでWordPressサイトの本文やサイドバーやフッターにInstagramのフィードを表示させる方法をお探しの方におススメの記事です。

この記事で解決できること
  • Instagramに投稿した写真のフィードをWordPressサイトに埋め込みたい。
  • サイトに訪問したユーザーにInstagramの写真を見てもらいたい。

WordPressサイトやブログを運営していて、Instagram（インスタグラム）に写真を投稿している方は、このように考えたことはありませんか？この記事では、Instagramのフィード（タイムライン）をWebページやウィジェット（サイドバー・フッター）に表示させる事ができるプラグイン「 Smash Balloon Social Photo Feed 」を紹介します。

Instagramのフィード表示プラグイン「Smash Balloon Social Photo Feed」

Instagramのフィード表示プラグイン「 Smash Balloon Social Photo Feed 」を使うと、ショートコードを貼るだけで、Instagramのフィードを簡単に表示させる事ができます。

■Smash Balloon Social Photo Feedの特徴

Smash Balloon Social Photo Feedの特徴は下記のとおりです。
  • ショートコードを貼るだけで表示可能
  • 表示させる写真の枚数を指定可能
  • 写真表示の「列」の指定可能
  • 写真のサイズの指定可能

シンプル操作で誰でも簡単に設定できます。

プラグイン『Smash Balloon Social Photo Feed』の設定手順

Instagramのフィード表示プラグインSmash Balloon Social Photo Feedの設定手順を解説します。

ステップ①～④で簡単に登録できます
  • ステップ①：プラグインのインストール
  • ステップ②：プラグインとInstagramアカウントを接続
  • ステップ③：フィードを表示させるショートコードを取得
  • ステップ④：表示させたい場所にショートコードを貼り付ける

ステップ①：プラグインのインストール

まずはプラグインをインストールします。

ダッシュボード＞プラグイン＞新規追加 を選択します。

プラグイン検索窓に「Smash Balloon Social Photo Feed」と入力するとプラグインが表示されますので、「今すぐインストール」をクリックします。

インストール終了後「有効化」をクリックして、プラグインを有効化します。

左側メニューに、「Instagram Feed」という項目が追加されたことが確認できればOKです。

ステップ②：プラグインとInstagramアカウントを接続

プラグインとInstagramのアカウントを接続します。
ダッシュボード＞Instagram Feed を選択します。

「Configure」の［Instagramアカウントを接続する］というボタンをクリックします。

Instagramのアカウントにログインするよう求められますので、①メールアドレスと、②パスワードを入力し、③ログインをクリックします。

接続が成功すると、Instagram Feedの設定画面にInstagramアカウントが表示されます。

ステップ③：フィードを表示させるショートコードを取得

Instagramのアカウントを接続したら、Instagramのフィードを表示させることができるショートコードを取得します。

ショートコードは設定画面の下の方にあります。

ちなみに、Instagram Feedの①～④は特に設定しなくてもそのまま使う事ができますが、いくつか設定項目がありますので一応解説しておきます。

各項目の詳細は下記のとおりです。

①どのインスタグラムアカウントのフェードを表示するか選べる。有料版は＃やタグなども選択できるらしい。
 
②チェックを入れるとプラグイン削除時の設定が保存され、再インストール時に削除前と同じ設定を引き継ぐことができます。
 
③キャッシュの時間を設定できます。初期設定では1時間です（1時間毎にキャッシュをクリアして更新情報を取得します）。
 
④変更を保存ボタン

ステップ④：表示させたい場所にショートコードを貼り付ける

Instagramフィードを表示させたい場所にショートコードを貼り付けます。

 
  • Webページにフィードを表示する方法（投稿・固定ページ共通）
 

では貼り付け方を解説します。 とても簡単だから安心するんじゃぞ

インスタグラムのフィードを、表示させたいページの編集画面で、取得したショートコードを貼り付け、公開・更新ボタンをクリックします。以上！！簡単でしょう。

◆まずはブログ編集画面でショートコードボタンを選択してください。

◆本文上にショートコードの入力欄が出てきたら プラグイン『Smash Balloon Social Photo Feed』の設定画面で出てきたショートコードをコピー＆ペーストしてください。

編集画面ではショートコードだけ表示されるけど安心してください！！

プレビューで確認すると、下図のようにWebページにInstagramのフィードが表示されていることが確認できます。

本文だけでなくウィジェット（サイドバー・フッター）にフィードを表示することもできるよ！！

さいごにまとめ

以上、WordPressサイトにInstagramのフィードを表示するプラグイン　Smash Balloon Social Photo Feed（旧称：Instagram Feed）の設定方法を解説しました。

プラグインを使うことで、Instagramに投稿した写真をWordPressサイトに公開することができるようになります。

難しい設定は必要ありませんし、表示のカスタマイズもできますので、Instagramを活用したい方は、是非お試し下さい。

 

投稿者プロフィール

グラフル
はじめましてグラフルと言います。
■会社員／２児パパ■タイプ／コツコツ■好きな言葉／人生は自分のために■料理／学ぶこと／DIY／自己投資■夢／自由なマインドで起業家になる■失敗をバネに現在不自由ない生活を驀進中。
Twitter　 https://twitter.com/home
LINE https://lin.ee/qUzKVl6