ブログのプロフィールにボタン付きソーシャルリンクを設置しよう

ブログをやっている人は他のソーシャルメディアも使ってると思うのでブログにリンクを貼りたいところです。
僕は今まで味気ないテキストリンクを使っていましたが、すっきりしてたほうがいいので上の画像のようなボタンに変えました。
それどうやるのって聞かれたのでやり方書いておきます。

ボタンアイコンを入手

僕が使っているのはこちらのサイトからダウンロードできます。ミニ・ソーシャル・アイコンヴォルフロッシュ
国内で使われているソーシャルメディアはほとんどカバーされてると思うので十分だと思います。
他にも無料のアイコンなどは探せばいくらでも出てきますので、お気に入りのアイコンを探してみてください。

アイコンをサーバーにアップロード

ここではWordPressを使って解説しますが、各サービス共に画像をアップロードする機能はあると思いますし、だいたい手順は同じだと思うので頑張ってください。
新規投稿画面に行って、アップロード/挿入をクリック。
そこでダウンロードした中で自分の使うアイコンだけを選択してドラッグしてアップロード。
アップロードされたら好きなボタンの「表示する」をクリックしてリンクURLの欄にアイコンのリンクさせるURLを入力して投稿に挿入をクリック。

するとこんな感じのテキストが挿入されます。
前半のa href=の後がリンク先のURLで、後半のimg srcの後のURLが画像の貼ってある場所です。普通の画像リンクは前半と後半が同じになっていて、クリックすると画像が拡大表示されるような使い方をしますね。

はい、こんな感じでどんどんリンク付きのボタンを作ってください。

各ソーシャルメディアの自分のページへのリンク

〇〇の部分を自分のIDに変更してください。
twitter:https://twitter.com/◯◯
mixi:http://mixi.jp/show_profile.pl?id=◯◯
tumblr:http://◯◯.tumblr.com/
instagrm:http://instagram.com/〇〇
foursuquare:https://ja.foursquare.com/〇〇
アメーバピグライフ:http://life.pigg.ameba.jp/user/◯◯
アメーバピグ:http://pigg.ameba.jp/?targetAmebaId=〇〇
Skype:skype:◯◯?userinfo (Skypeアプリが起動します)
メールアドレス:mailto:自分のメールアドレス(メーラーが起動します)