みなさんこんにちは、mayukouです。
さて今回は、wordpressのウィジェットにInstagramのフィードを乗せる方法をご紹介します。
実際に当ブログのサイドバーに設置してみました。
自分のinstagramを見せることで、より自分らしさを伝えることができるのでオススメです。
方法は、プラグインのインストールと
ちょっとコードを書かないといけないんですが、
たったの一行だけ。
今回はその方法をご紹介します。
スポンサードリンク
プラグインダウンロード＆instagram設定
まず、プラグインをダウンロードします。
プラグイン名はinstagram feedです。インストールをクリックして、有効化しましょう。
プラグイン＞インストール済みプラグイン＞Instagram Feed のSettingsをクリックして、設定画面に行きます。
Instagramのユーザーネームとパスワードを入力します。
するとAccess TokenとUser IDが発行されるので、図のようにコピー＆ペーストしましょう。
（Customize）カスタマイズをクリックして、表示する画像の数や、カラム数（何列表示にするか）などを設定できます。私の場合カラム数は２列にしています。
Display your feedをクリックし、ショートコード［instagram-feed］をコピーします。※←これはカッコが全角になっています
このショートコードを、見せたいところに貼り付ければ、表示される仕組みになっているのですが、このままだと投稿ページや固定ページにのみ使える状態です。
functions.phpにコードを一行書く
ショートコードをウィジェットに貼り付けて終わり…と行きたいところですが、
投稿ページに使えるショートコードは、そのままウィジェットには使えません。
そこで、ウィジェットにもショートコードを使えるようにカスタマイズします。
そのためには、functions.phpに一行書き加えるだけ。
適応しているテーマフォルダから、functions.phpをダウンロードしたら、
一行加えてアップロードしましょう。
1 | add_filter('widget_text', 'do_shortcode'); |
この一行でOKです。書き加えたら、ショートコードが使えるようになっているはずです。
テキストウィジェットをアップ
ウィジェット設定ページに行き、テキストウィジェットを選び、その中に例のショートコードを入れて完成です。
最後に
いかがでしたか？インスタグラムのウィジェット設置方法をご紹介しました。よかったら当ブログのサイドバーをみていただき、
ぜひ参考にされてください。
投稿者プロフィール
- Webデザイナー修行中のmayukouです。口下手ですが、webデザインのお仕事を始めてなんとか約５年が経ちました。続けられているのが不思議です。仕事で得た知識やお役立ち情報をご紹介いたします。宜しくお願いします。水彩画を勉強中です。趣味は音楽鑑賞（洋楽）、料理、読書、ブログです。
詳しくはこちら
最新の投稿
- 2017.06.18写真現像すると写真が生き生きする！Macの写真アプリが素敵
- 2017.06.17書評売り上げアップを実感♪目から鱗の本「どうすれば売れるのか」を読んで
- 2017.05.27iPad Pro購入して半年♪iPad Proで描いたイラストをご紹介。（主にProcreateアプリ使用）
- 2017.05.20カメラブロガーの味方？高級コンデジ、Panasonic LX9を買いました。
この記事へのコメントはありません。