たった5分でInstagram画像ギャラリーを作成! WordPressプラグイン「Instagramフィード」

スポンサーリンク

Instagram画像ギャラリー Instagramフィード

WordPressプラグイン「Instagramフィード」を使って、Instagram画像ギャラリーをホームページやブログに設置する方法をご紹介します。

ホームページやブログに Instagram 画像ギャラリーを設置する方法はいくつかありますが、WordPressをお使いの方はプラグイン「Instagramフィード」で簡単にギャラリーが作成できます。

ややこしい設定はすべてプラグインにおまかせ、コード等はコピペでOK、ホントに5分程度で設置可能ですよ。

「Instagramフィード」のインストールと設定

では、さっそく「Instagramフィード」をインストールしてみましょう。まずはダッシュボードの左メニューから「プラグイン」→「新規追加」へ進み、検索窓から「instagram feed」と入力すると「Instagramフィード」が見つかります。

WordPressプラグイン instagramフィード

プラグインの検索結果には「Instagram フィード」の他に「Instagram Feed 」がいくつか出てきますが、インストールするのはコイツなのでお間違いなく。Instagram フィードを「今すぐインストール」→「有効化」します。

Instagramフィード 有効化

インストール後に左メニューの「Instagram Feed」をクリックすると、設定が表示されます。ログインボタンをクリックして、アクセストークンとユーザーIDを取得します。

Instagramフィード 設定画面

ユーザーネームとパスワードを入力して Instagram にログインしてください。

Instagram ログイン

プラグイン動作の確認画面が表示されるので、「Authorize」をクリックします。

Instagram プラグイン動作確認

自動的にアクセストークンとユーザーIDが取得されるので、それぞれ図の通りに入力欄へコピペしてください。

Instagram feed アクセストークンとユーザーID入力

アクセストークンとユーザーIDをコピペしたら、下の「変更を保存」をクリックしてください。

InstagramフィードをWordPressに設置

続いて Instagramフィード を WordPress に設置してみます。やり方はとても簡単、固定ページ又は投稿ページのギャラリーを設置したい場所にショートコードをコピペするだけです。

Instagramフィード ショートコード

「3. Display Your Feed」タグにある一番シンプルなショートコード[instagram-feed]を貼り付けてみて下さい。これだけで画像ギャラリーが表示されるようになります。

Instagram 画像ギャラリー

ギャラリー下の「Lead More..」をクリックすると、さらに画像が表示され、「Follow on Instagram」からは、そのユーザーの Instagram ページに移動することができます。

Instagramフィード 画像ギャラリー

以上、プラグインのインストールから Instagramフィードの設置まで、5分程度で完了しました。前回の記事「Instagram画像ギャラリーをホームページやブログに設置する」で紹介した Instagram API と instafeed.jsを使う方法よりもはるかに簡単です。いや、すばらしい・・・

Instagramフィード カスタマイズ

Instagramフィードは、一列あたりの表示枚数や画像の表示順序などのカスタマイズも可能です。「2. Customize」タグに各種設定項目があるので、いろいろいじくってみてください。

Instagramフィード カスタマイズ

一例として、総表示枚数15枚、一列5枚表示、左右の余白なし、背景色を変更、表示順序をランダムに変更してみました。こんな感じになります。

Instagramフィード カスタマイズ例

変更したのは以下の場所です。最後に「変更を保存」をお忘れなく。

Background Color : お好きな色を選択
Sort Photos By : Random
Number of Photos : 15
Number of Columns : 5
Padding around Images : 0px

カスタマイズはショートコード内にコードを記述してもOKです。「3. Display Your Feed」内にオプション一覧が掲載されています。

また、Instagramフィードには39ドルから使える有料版「Instagram Feed Pro」もあります。

Instagram Feed Pro

こちらを購入すると、ハッシュタグを使った写真の絞込や、フィード内の情報追加、カルーセル表示機能などが使えるようになります。さらなるカスタマイズをお望みの方は検討してみてください。

スポンサーリンク
PC用
PC用

フォローする