2017/6/26現在
ｉｎｓｔａｇｒａｍ（インスタグラム）でのフォローボタン作成方法が変更になった模様です。

新しい作り方については以下に記載しましたのでこちらの方法で作成いただければと思います。

新・ｉｎｓｔａｇｒａｍ（インスタグラム）フォローボタン＆公式バナーを作成方法

種類は2種類ありますので、お好きなバナーの方をご利用ください。

①View on Instagramのバナーの作成方法

この画像を使ったフォローボタンを設置したい場合は、以下のhtmlソースをコピーして、フォローボタンを設置したい場所へ貼り付けて下さい。

htmlソースを貼り付けたら赤字の部分を自分のｉｎｓｔａｇｒａｍ（インスタグラム）アカウントのURLへ変更して完成です。

②Instagramのアイコンバナー作成方法

こんな感じのアイコン型フォローボタンを設置したい場合は、以下のhtmlソースをコピーして、フォローボタンを設置したい場所へ貼り付けて下さい。（html入力が可能な場所のみ）

htmlソースを貼り付けたら赤字の部分に自分のインスタグラムアカウントのURLを入力すればOKです。

■規約について

ロゴ等の使用についての規約は以下のページで解説しています。

■グラデーションロゴ

■過去の作り方

Instagram（インスタグラム）

ワードプレスでブログをされていて
アクセスを伸ばしたりを期待して
アカウントを持っているSNSの
ボタン等を設置したななんて
おもうとこともあるかと思いますが

ここではInstagram（インスタグラム）
公式バッジ（バナー）の作成方法と

非公式ではありますが
フォローボタンの作成方法に
ついて紹介したいと思います。

ちなみにインスタグラムのロゴやアイコンについては
大きさや色、余白などに制限があるようですので
これらのものをＷＥＢ上や紙媒体上で利用する際は
下記に解説を用意しましたのであわせてご利用ください。

■Instagram（インスタグラム）　規約違反しない画像はここにあった！　ロゴ、バナー、スクショなど

■公式バッジ（バナー）の作り方

1. Instagram（インスタグラム）
   アカウントページにある
   
   https://instagram.com/accounts/badges/
   
   へアクセスすると以下のような画面が出てきます。
   
2. バナーを選択でバナーを選択する。
   |
3. 「このコードをコピー」の右側にコードが
   表示されますのでこれをコピーして
   表示させたい場所へ貼り付けるだけです。
   |
4. 完成！

これで完成です！
ワードプレスであればこの記事に
張り付けているように記事中や
ウィジェット、固定ページ等々
コードが貼り付けれるところで
あればどこでも貼り付けOKです。
（ウィジェット以外に張る場合でワードプレスの場合
ビジュアルとテキストのモードがあるかと思いますが
必ずテキストモードの方でコピペしてください。）

※通常このままですとユーザーが
ボタンを押した際にそのままページ移動
してしまってブログページから
ユーザーが離れてしまうことが懸念
されますので、

<a href=”http://instagram.com/ユーザー名?
ref=badge” class=”ig-b- ig-b-v-24″ target=_blank>

上記のようにコード部分に 「target=_blank 」を
追加するとInstagram（インスタグラム）の
ページを新規で開くようにカスタマイズできます。

■フォローボタン

1. 続いて非公式ではありますが
   フォローボタン設置です。
   こちらへアクセスすると
   
   http://instafollowbutton.com/
   
   このようなページが表示されます。
   |
2. 注意点としては
   Instagram（インスタグラム）へ
   ログインしていないときちんと
   作成できないのでログインしてない
   場合はまず
   Instagram（インスタグラム）
   へログインしてください。
   |
3. Button Preview で実際に表示される
   ボタンが表示されます。
   デフォルトではこんな感じです。
   |
4. サイズは3種類から選べます。
   |
5. カスタマイズでフォロー数の
   表示・非表示が選べます。
   |
6. 次にユーザーネームの
   表示・非表示が選べます。
   |
7. カスタマイズが終わったら
   HTMLというところと
   JAVASCRIPTというところに
   コードが表示されます。こちらも記事ページやウィジェット
   等々好きなところに表示できますので
   まずは設置したい場所に
   HTMLのコードをコピペします。
   |
8. JAVASCRIPTのコードをコピペして完成！

最後にJAVASCRIPTのコードを
コピペする場所ですが
先ほどのHTMLのすぐ後ろでも
いいですし、記事ページであれば
記事の一番下へコピペするのが
いいかと思います。
（ウィジェット以外に張る場合でワードプレスの場合
ビジュアルとテキストのモードがあるかと思いますが
必ずテキストモードの方でコピペしてください。）

これ以外に
Instagram（インスタグラム）に
関連するプラグインで実際の写真を
ページに表示する方法（埋め込み）等
もありますので
Instagram（インスタグラム）での
画像更新を中心としたブログを
されている方には非常に
おすすめなのではと思います。

たとえば、開運旅行記という
サイトの「cruise now・・・」
ではInstagram（インスタグラム）と
twitter（ツイッター）の
＃cruise
＃＝（ハッシュタグ）で
検索した内容をリアルタイム
で表示する
というページを作っています。

SNSを実装することで一気に
アクセスアップのチャンスも
広がりますし、ワードプレスでは
簡単に実装できるようになって
いますので
Instagram（インスタグラム）
に限らず、Twitter等の
埋め込みもおすすめいたします。

合わせて読みたい！
●Instagram（インスタグラム）　規約違反しない画像はここにあった！　ロゴ、バナー、スクショなど

●なぜinstagram（インスタグラム）にハマるのか？を心理学的に分析しました。