kouta.com

sumahoと一緒に…

yoppiの雑記ブログ

はてなブログにInstagramフォローボタンを設置しました

今更なのですがInstagramを始めました。ブログからの流入もできればと思いフォローボタンをサイドバーに設置した次第です。

SNSなかなか私には使いこなせません。かなり手探り状態ですが・・・

www.travelhacks.tokyo

はてなブログ インスタグラム」でググるとこちらのブロガー様が解説をされていましたので参考にさせて頂きました。誠に勝手ながら言及させていただきました。

 

Instagram Developer Documentation

こちらをクリックするとInstagramの開発者ページに飛びます。

f:id:ayayuito_japan2012401:20170525113735j:plain

右上の自分のアカウントボタンをクリックし「バナー」を選択

 f:id:ayayuito_japan2012401:20170525114052j:plain

こちらの画面へ移行しました。アレ?赤丸で囲ったところに何も出てきません。なにか設定が必要なのでしょうか…一向に出てこないのでこの方法は諦めて・・・

 Snap Widgetを使用しました

サイトは英語での表記なので日本語翻訳してくださいね。

snapwidget.com

無料版と有料版

無料、5$/月、7$/月とがあります。大きな違いでは広告の有無です。無料版ではクリックするとSnap Widgetの広告を経由する形になります。個人のブログですし、私は無料版としました。

f:id:ayayuito_japan2012401:20170525120707p:plain

ウィジェットを選択

グリッド、スクロール、スライドショーなどから選択します。

基本設定でInstagramのユーザー名を入れて諸々の設定を行い「ウィジェットを取得する」をクリックします。

f:id:ayayuito_japan2012401:20170525122251j:plain

ウィジェットのコードが出ますのでコピーします

f:id:ayayuito_japan2012401:20170525122519p:plain

 さきほどのコードをブログのサイドバーに貼り付けます。

「モジュールの追加」をしてください。 

f:id:ayayuito_japan2012401:20170525122943j:plain

 

ちなみにこちらはスライドショーの作例。 

ブログに載せきれなかった画像が中心かな…

 

最後に

Instagramのフォローボタンが作成できなかったことは残念でした。私のやり方が不十分なのだろうと思います、どなた様か教えていただけたら光栄です。

画像タイプのフォローボタンもなかなか気に入っています。無料版ということで広告が入るのはちょっと…と思いますが、まぁ個人のブログですし良しとします。それとPC版のブログのデザインも変更しました。今後スマホ版でもフォローボタン設置してみたいと思います。

 

気軽にフォローしてくださいね。

 

 

 

ご視聴ありがとうございます。