LOGzeudon

名古屋で働いているWebデザイナーのブログです

SnapWidget|instagramウィジェットをサイドに設置する / はてなブログ

f:id:rokuzeudon:20141116191404p:plain

昨日のTwitterウィジェットに続き、instagramの設置の方法を知ったのでメモです。

SnapWidgetを検索

Twitterと違い、instagramが公式に提供しているウィジェットはないようですが、SnapWidgetというところがサービス提供しているようです。

Google検索すると出てきます。

f:id:rokuzeudon:20141116191747p:plain

全部英語!!とりあえず、「無料のウィジェット作ろうぜ」と青いボタンに書いてあるので、それをクリック。

f:id:rokuzeudon:20141116191912p:plain

それっぽい画面になります。左になんか「$」とか書いてあって不安ですがスルーで。

英語ですが、それぞれの項目に入力していきます。

Username

instagramのユーザーネームを記入します。じぶんなら「rokuzeudon」

Hashtag

ハッシュタグを入力します。Usernameに自分のuser nameをいれておき、ハッシュタグ  #犬 とか入れておけば、自分の投稿の中で #犬 だけをピックアップ表示できるということかと。

Widget Type

ウィジェットのタイプが指定できます。

Grid タイル状に写真を並べます。

Board 写真だけじゃなく、ユーザーアカウントやコメントなども表示。

Scrolling 横にスクロールするタイプ。マウスを左右に載せるとその方向に加速。

Slideshow 時間経過で切り替わっていくタイプ。

Map 地図表示。いろいろな場所で撮る人にはオススメ。

他の項目は、ウィジェットの種類によって変わります。

サイズ、ボーダーの線、表示数、マウスを載せた時の動きなど設定します。

下の「Preview」ボタンで表示を確認しつつ設定すると良いでしょう。

OKなら、グリーンの「Get Code」ボタンをクリック。

f:id:rokuzeudon:20141116193124p:plain

Twitterの時みたいな画面!

枠の中のコードをもれなくコピーしておきます。

このコードを、はてなブログ管理画面の「デザイン」カスタマイズ、モジュール追加でHTMLを選び貼り付けて「適用」、保存です。

この辺りは前回記事をご参照。

Twitterウィジェット(タイムライン表示)をサイドに設置する / はてなブログ - 69log