自分のインスタグラムの投稿一覧を、アメブロのサイドバーに表示させて、ブログ見れてくれる人にもインスタ見てほしいですよね。
そんなあなたの欲求を満たしてくれる、アメブロにインスタグラムを表示させるために設定方法です。
自分のインスタグラムの一覧をとりにいく
まずインスタグラムの投稿一覧をゲットするためにSnapwidgetを使います。
サイトにアクセスしてトップページの「Get Your Free Widget」のボタンをクリックするか、下にスクロールするとこんな入力画面がでます。
アメブロに入れ込んだ際にどういう見た目や機能をつけるかなどを決められる画面です。ちょっとしたエフェクト機能も変更できますが、今回はとりあえずアメブロにインスタグラムの一覧が貼れればOKってことで。以下の様に設定します。
（アメブロのデフォルトの3カラムデザインの右に入れる想定です。）
1.Username
自分のインスタグラムのアカウント名を入れます。
2.Thumbnail Size
145px
インスタグラムに投稿した写真1枚のサイズをどのくらのサイズにするかの設定です。
3.Layout
2×2
表示する写真を、横・縦に何枚ずつ表示させるかです。アメブロのサイドバーが狭いので、2枚ずつにします。
4.Photo Padding
5px
写真と写真の間の余白になります。
アメブロの右サイドバーのサイズが横300pxなので、写真1枚145px+余白5px+写真1枚145px+余白5px=300pxという計算でございます。
入力できたら、「Get Widget」をクリック。
すると「おまえのウェブサイトに、これをコピペしやがれ」的なメッセージが表示されますので、表示された、HTMLタグをコピーします。
アメブロのセッティング
とにもかくにも、アメブロにログインします。
ログインできたら、「設定・管理」ページに入ります。
「設定・管理」ページの画面下の方にある、「プラグインの追加」をクリック。
タブがあるので、「フリープラグイン」を選びます。
テキストを入力できるスペースがあるので、さきほどSnapWidgetでコピーしたタグをここにペーストします。
ペーストできたら、スペース下の「保存」をクリックして保存します。
「設定を保存しました」の画面が出ます。ちょっと分かりにくいですが、「新たに〜」の文章の最後、「こちら」がリンクになっているのでクリック。
「サイドバーの配置設定」画面がでるので、「使用しない機能」欄にある「フリープラグイン」をドラッグして、インスタグラムの画像一覧を入れたい箇所に入れ込みます。できたら「保存」をお忘れなく。
ブログを確認してみましょう。
できました！！
アメブロのデザインテンプレートによって、サイドバーのサイズが違うので、Snapwidgetの設定で写真の枚数やサイズ・余白を調整して、ブログの見た目を調整してください。
これでインスタに「いいね」が増えること間違いなし！！