目次
サービス終了か？2019年10月10日追記
※現在、数日前よりinstawidgetのサイトが表示されず、サイトやブログに埋め込んだものも表示されなくなっています。
現状、サービスを終了したのか、サイト側の不具合かはわかりませんが、詳細が分かり次第、追って追記します。
簡単にですが、下記に記事をまとめてみました。
サービス終了？instawidget（インスタウィジェット）が表示されなくなった件
以下、当時の記事となります。
今、一番勢いのあるSNSと言っても過言では無いInstagram（インスタグラム）
WEBサイトにInstagramの投稿を、埋め込みたいと言う依頼も、最近では少なくありません。
Instagram にも当然APIはあるのですが、InstagramのAPIは審査や制限などもあり、ちょっとした事をするのにも非常にハードルが高いです。
今回は、APIを使わずに、サクッとInstagramの投稿をサイトに埋め込む事のできる「InstaWidget」をご紹介いたします。
レスポンシブ対応する際に少しハマってしまったので、備忘録もこめて
InstaWidgeとは？
InstaWidget は、あなたのブログやウェブサイトにインスタグラムの写真アルバムを追加するブログパーツ（ウィジット）です。
ユーザー名またはハッシュタグを指定することで簡単に埋め込み用のコードを生成でき、コピー＆ペーストするだけで設置は完了です。
ログインやユーザー登録は不要で、無料で使えます。早速作ってみましょう！
出典：無料インスタグラムブログパーツ作成 | InstaWidget
ほとんど上記の説明で完結しているのですが、様はインスタグラムの埋め込みコードを発行してくれる無料サービスです。
埋め込み表示のカスタマイズも簡単で、サイトに埋め込む前にその場でプレビューも出来る優れもの！
プレビューで表示を確認したら、作成したコードを張り付けるだけで、簡単にインスタグラムをWEBサイトに埋め込む事が可能です。
InstaWidgeの使いかた
下記のリンクよりInstaWidgetにアクセスします。
https://instawidget.net
サイトに遷移したら、「無料インスタグラムブログパーツ作成」または、「早速作ってみる」のどちらかのボタンをクリックします。
パーツを作成する
ユーザー名を始め、パーツの幅や、アイコンの非表示など細かい設定を行います
プレビューボタンクリックで表示確認
各項目の入力が完了したら、プレビューボタンをクリックして、表示内容を確認します。
プレビューを確認しながら、思った通りの表示になるまで調整します。
コードをコピーしてサイトに張り付ける
プレビューされている、内容に問題が無ければ、生成されたコードをWEBサイトのソースに張り付ける。
レスポンシブに対応するには
レスポンシブ対応にするのに、少しハマってしまいましたが、「よくある質問」のところにばっちり記載されていました。
生成されたコードの「width=〇〇px」の部分を探して、その部分を「width=100%」に変更するだけで、簡単にレスポンシブにも対応する事が出来ます。
もちろんPCでの100％表示にも利用できます。
利用する際の注意
クライアントサイトで使用する場合
大変便利なサービスですが、無料サービスの為、突然サービスが終了してしまう可能性があります。
趣味のサイト等で利用する分には問題ないのですが、クライアントサイトなどで利用する際は、事前に事情を説明しておかなければ、後々の大クレームになりかねませんので注意しましょう！！
2018年9月29日追記
2020年の始めには、現在のインスタグラムのAPI機能は、全て廃止される事が公表されています。
おそらく、InstaWidgetもインスタグラムのAPIを利用したサービスだと思いますので、InstaWdgetで発行されるタグも使用できるのも、2020年までだと考えられます。
クライアントサイト等で使用する際は、特に注意が必要です。
表示できる画像は最大12枚まで
12枚までの表示であれば、大方の仕様には対応できるかと思いますが、12枚以上表示したい場合は、InstaWidgetでは対応できませんので、注意しましょう。
まとめ
使ってみれば、わかるのですが本当に簡単にインスタグラムを、サイトやブログに埋め込む事が出来ます。
項目は多いのですが、プレビューを確認しながら調整できるので、直感的に操作できる点も非常に使いやすい。
前述した様に、無料サービスの為、いつ終了するかわからないリスクはありますが、個人的には今後も重宝しそうなサービスです。
