【2023最新】ワードプレスにインスタをプラグインを使って簡単埋め込み！

みなさんはInstagramやってますか？

私もいくつかアカウントを持っていますが、ブログにインスタを埋め込むと見栄えがかなり良くなりますよ！

インスタ・プログの相互の集客も見込めるので、ブログにインスタを埋め込んで、SNS活用をしていきましょう。

※　2023年3月にversion6.0向けにリライトしましたが、若干設定画面が変わっているだけで、設定の流れは（ほぼ）変わりません。

インスタ埋め込みプラグイン「Smash Balloon Social Photo Feed」

インスタを埋め込むプラグインはこの「Smash Balloon Social Photo Feed」がオススメです。

プラグインのインストールと有効化

いつものようにプラグインの「新規追加」から「Smash Balloon Social Photo Feed」と検索して、インストールして有効化しておきます。

インスタと連携

インスタとの連携も簡単です。以下の手順で進めていけばすぐに連携できます。

フィードの作成

インスタとの連携が完了したらフィードの作成をします

これで新しくフィードが作成されました！

フィードの設定

フィードの作成ができたら、フィードの設定を行います。

すべてのフィードから、先ほど作成したフィードを選びます。

次のような画面になります。

「カスタマイズ」タブを選んで設定していきます。

基本的に「フィードレイアウト」を設定すれば大丈夫だと思います。

• 「配色」：テーマから継承、ライトカラー、ダークカラー、カスタムから選べます。
• 「ヘッダー」：アイコンと名前が表示されている部分の設定になります。
• 「投稿」：ほとんどの設定はPro版でないといじれない項目になっています。
• 「もっと見るボタン」：フィードの下部にある「もっと見るボタン」の設定です。
• 「フォローボタン」：フィードの下部にある「フォローボタン」の設定です。
• 「ライトボックス」：Pro版のみの設定項目になります。

フィードレイアウトの設定

とはいえ、フィードレイアウトの設定も難しくありません。

Lite版は、レイアウトは「グリッド」しか選べません。

ですので、基本的に「投稿数」と「列」をデスクトップ、タブレット、モバイルごとに設定すれば完了です。

「投稿数」はフィードに表示する投稿数になります。

「列」はその投稿を何列（横方向に）表示にするか？です。この投稿数と列で行（縦方向）のサイズが決まります。

ショートコードの確認

設定が終わったら、右上の「埋め込み」からショートコードを取得します。

表示されたら「コピー」します。

あとは好きな場所に貼り付ければインスタグラムのフィードが埋め込まれます！超簡単！

今回はフッターに「カスタムHTML」でショートコードを貼り付けてみました。

もし、「インスタのフィードが表示されないんだけど…」という現象が起きたら、こちらの記事も参考にしてみてください。

おまけ．複数のアカウントのフィードを埋め込む

あまりないケースかな、と思いますが、複数のアカウントのフィードを埋め込む方法も載せておきます。

「新規追加」すると、先ほどの『インスタと連携のSTEP２』に進むので、同様に設定してくれればOKです。

ただ、そこでも説明していますが、ブラウザでインスタのページを開いてログアウトをしておかないと、他のアカウントに入れない可能性もある（自動的にログインしているアカウントとの連携を作ってしまう）ので、あらかじめログアウトしておきましょう。

まとめ

今や、ブログでもSNSとの連携は必須です。

相互に連携をとって、ブログとSNSの流入数を増やしていきましょう！