WordPressサイトにInstagramを表示できるSmash Balloon Social Photo Feed(Instagram Feed)の使い方・設定方法

WordPressサイトにInstagramを埋め込むことができるプラグインSmash Balloon Social Photo Feed(Instagram Feed)

WordPress.org 日本語
Smash Balloon Social Photo Feed – Easy Social Feeds Plugin 以前の "Instagram Feed"。複数のアカウントから安全でカスタマイズ性のあるレスポンシブな Instagram フィードを表示します。Instagram の oEmbed に対応しています。

WordPressでのWebサイト制作では重宝するプラグインです。

Instagramアカウントとの連携をお客様に行っていただくケースも多いと思いますので、その際のマニュアルとなるように画面キャプチャーを交えて解説します。

WordPress5.8、プラグインのバージョンは2.9.2で確認しています。

※Smash Balloon Social Photo Feedはプラグインの名称変更も多いのでご注意ください。

目次

Instagram Feed 使用イメージ

設定完了すると、サイドバーエリアや記事本文エリアにInstagramの投稿をリアルタイムで反映できるようになります。

サイドバーイメージ かこがわノートより
本文下エリアイメージ かこがわノートより

Instagram Feed 設定方法

プラグインの新規追加から「Smash Balloon Social Photo Feed」で検索してインストールします。有効化したら、設定の下にInstagram Feedの表示が出ます。

管理画面左側メニューにInstagram Feedがあります。

Instagram Feedの文字をクリックするとさらにメニューが開くので、一番上の「設定」をクリックしてください。

Instagram Feed設定画面
Smash Balloon Social Photo Feed 設定画面

上の画像の「Instagram アカウントを接続する」をクリックしてください。下のような画面が開きます。

Instagramとの連携をする画面

投稿一覧を表示するだけならPersonalで大丈夫です。

「Connect」を押すとInstagramの画面に移動します。もしInstagramにログインしていない場合はここでログインしてください。

Instagramの許可画面

「許可する」を選ぶとWordPressに戻り、アカウント名(ここではkakogawanote)が表示され、接続を確認する画面が出ます。

Instagramアカウントに接続する確認画面

「このアカウントを接続する」を押すと、無事に接続完了します。下の画面のようになっていれば大丈夫です。

Successfully connected、接続成功と表示され、その下にアカウント名が出ています

これで接続完了です。

※PersonalとBusinessの違い

最初のイメージ画像2枚ではBusinessで接続していますが、Personalで接続した場合、アカウントアイコンがデフォルトのInstagramロゴとなります。

アカウントロゴがオレンジのものからInstagramロゴに

こちらでも特に利用に問題はないため、簡単な接続方法をオススメしています。

Businessで接続する場合には、Instagramと運営が同じFacebookアカウントが必要になります。FacebookとInstagramの連携は説明が複雑になるので省略します。画面表示のまま進めていけば特に問題はありません。

Instagramの表示にはショートコードを使用

投稿内やサイドバーウィジェットにショートコードを書くことで、Instagramの投稿が表示できます。

デフォルトは [instagram-feed] です。

設定画面の「2.カスタマイズ」で設定したものが表示されます。

また、ショートコードのオプションを利用すると、列の数や表示される投稿の数も自由に変更できます。

かこがわノートの記事下部分では [instagram-feed cols=4 num=8] と横4列、投稿数8個で4×2に収まるように設定しています。

再掲

プロ版にすることで、ハッシュタグで絞り込んだフィードを取得でき、さらに多彩なレイアウトも利用可能です。


Smash Balloon Social Photo Feed(Instagram Feed)は便利なプラグインで、2021年8月現在は頻繁に更新されています。

しかし、Instagramの仕様変更やプラグインの開発停止などで表示されなくなる可能性は常にあるので、定期的にチェックしてInstagramの投稿が表示されているか確認するようにしましょう。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

コメント

コメントする

目次