<p class="thumb"><img src="http://d3qt5c962pj1kq.cloudfront.net/images/2012/09/snapwidget.png" alt="Instagramのフォトギャラリー" title="snapwidget" width="510" height="248" class="none" /></p>
<p>Instagramユーザーの中には、「旅行した時に投稿した写真をブログのサイドバーに表示させたい」「自分の好きなジャンルの写真を一覧して表示させたい」などといったニーズを持っている人もいるはず。</p>
<p>今回は、そのようなユーザーのニーズに応えてくれるブログパーツ生成サービスをご紹介します。</p>

<!--more-->

<h3 class='header-label'>Instagramの写真をブログパーツにできる「SnapWidget」</h3>
<p>「<a href="http://snapwidget.com/" target="_blank">SnapWidget</a>」は、<strong>Instagramに投稿された写真を、ユーザー名かハッシュタグで絞り込んでフォトギャラリーのブログパーツにする</strong>サービス。</p>
<p>フォトギャラリーのタイプは３つあり、目的に沿ったものを作成できます。</p>

<h4 class='tips'>3種類のフォトギャラリーのサンプル</h4>
<p>生成できるタイプは、グリッド、スライドショー、マップの3種類。グリッドとスライドショーは、オプション設定でサムネイルのサイズやマウスオーバー時の効果などを好みに合わせて変更することができます。</p>

<h5 class='tips'>グリッドギャラリー</h5>
<iframe src="http://snapwidget.com/in/?h=d2Fpa2lraWJlYWNofGlufDExMHw0fDR8fHllc3w1fGZhZGVJbg==" allowTransparency="true" frameborder="0" scrolling="no" style="border:none; overflow:hidden; width:500px; height: 500px" ></iframe>
<p>#waikikibeachで絞り込んだフォトギャラリー。マウスオーバーでフェードインするように設定していますが、ノーマル、フェードアウトにすることも可能です。</p>

<h5 class='tips'>スライドショー</h5>
<iframe src="http://snapwidget.com/sl/?h=d2Fpa2lraXxpbnw1MDB8NHw0fHx5ZXN8NXxub25l" allowTransparency="true" frameborder="0" scrolling="no" style="border:none; overflow:hidden; width:515px; height: 515px" ></iframe>
<p>自動的に写真が切り替わるスライドショーです。</p>

<h5 class='tips'>マップ</h5>
<iframe src="http://snapwidget.com/mp/?u=c2lnZW9zMTV8aW58NTEyfDR8NHx8eWVzfDV8ZmFkZUlu" allowTransparency="true" frameborder="0" scrolling="no" style="border:none; overflow:hidden; width:512px; height: 512px" ></iframe>
<p>旅行中の写真をInstagramに投稿している人にオススメのマップタイプ。</p>


<h4 class='tips'>作成手順</h4>
<p>まず<a href="http://snapwidget.com/" target="_blank">SnapWidget</a>のページを開きます。</p>

<p><img src="http://d3qt5c962pj1kq.cloudfront.net/images/2012/09/snapwidget1.png" alt="" title="snapwidget1" width="500" height="453" class="aligncenter size-full wp-image-20991" /></p>
<ol><li>そしてユーザー名かハッシュタグを指定</li><li>ブログパーツのタイプやサムネイルのサイズなどを設定</li><li>「Preview」ボタンを押して見た目を確認</li><li>見た目がOKなら「Get Code」ボタンを押してコードを表示</li></ol>

<p>表示されたコードをコピーし、表示させたい場所に貼り付ければ完了です。<br /><img src="http://d3qt5c962pj1kq.cloudfront.net/images/2012/09/snapwidget2.png" alt="" title="snapwidget2" width="500" height="308" class="aligncenter size-full wp-image-20990" /></p>

<h4 class='tips'>チュートリアル動画</h4>
<iframe width="522" height="294" src="http://www.youtube.com/embed/bV_1MDpR0xQ" frameborder="0" allowfullscreen></iframe>

<p>試してみたいかたは<a href="http://snapwidget.com/" target="_blank">SnapWidget</a>へどうぞ。</p>