Bloggerのプロフィールにリンクを貼る方法
こんにちは、ひろ(@hiro_hb)です。
Bloggerのプロフィールウィジットって、ブログに追加するだけでプロフィールが表示されてべんりですよね。
でもこれだとブログごとにプロフィールを使い分けることができないし、リンクなんかも貼れない。
TwitterやInstagramなんかとブログを繋げる場合、リンクはわかりやすくプロフィールに表示したいところ。
それにほしい物リストも以前記事にて公開しましたが、やはりもっと目立つプロフィールに貼りたい。笑
ということで、プロフィールにいい感じのリンクを貼る方法はないか考えて見ました。
Bloggerプロフィールにリンクを貼る方法
もう一度、プロフィールウィジットを確認して見ます。
やはりあらかじめ設定したプロフィール以外は表示できないようです。
しかし、Bloggerには自由にHTMLやCSS、JSを記入・表示できるHTMLウィジットがあります。
なので、それを使っていい感じにしていきます。
とりあえず、リンクを貼るには<a>タグで囲めばOK。
さらに、リンクを新しいタブで開くにはtarget="_blank"、リンクにドメインパワーを与えないようにするにはrel="nofollow"をつけてあげます。
ドメインパワーについては諸説ありますが、僕の場合、個人のブログなどへのリンクであればつけません。
今回のようにリンク先がTwitterやAmazonの場合はつけるようにしています。
ということで、リンクを作るには
あとはいい感じにデザインを揃えて、画像持ってきてー。。。
こんな感じのやつにしてみました!!
やはりあらかじめ設定したプロフィール以外は表示できないようです。
しかし、Bloggerには自由にHTMLやCSS、JSを記入・表示できるHTMLウィジットがあります。
なので、それを使っていい感じにしていきます。
とりあえず、リンクを貼るには<a>タグで囲めばOK。
さらに、リンクを新しいタブで開くにはtarget="_blank"、リンクにドメインパワーを与えないようにするにはrel="nofollow"をつけてあげます。
ドメインパワーについては諸説ありますが、僕の場合、個人のブログなどへのリンクであればつけません。
今回のようにリンク先がTwitterやAmazonの場合はつけるようにしています。
ということで、リンクを作るには
<a href="リンク先URL" rel="nofollow" target="_blank">表示するテキスト</a>これを使えばOK。
あとはいい感じにデザインを揃えて、画像持ってきてー。。。
こんな感じのやつにしてみました!!
結構いい感じ!!
いい具合にうちのブログに馴染んでます。
実はこれ以外にもう一つ別バージョンを作ったのですが、こっちの方が個人的に好みのデザインなのでこっちにしました。
詳しい作り方とかコピペ用テンプレなんかはBloggerなびで記事にしました。
>>HTMLウィジットでプロフィールを作ろう【テンプレ有】
Bloggerなびの記事では別バージョンも載せてあるのでみてください。
まとめ。
ということで、Bloggerユーザーの方はプロフィールをアレンジして見ましょう。
BloggerなびのほうにテンプレのHTMLコードをのせてるので見てください。
ちなみにほしい物リストを当ブログのプロフィールに貼ったので、絶賛プレゼント募集中です。笑
これ送ったよ!と教えていただけると、当ブログで徹底的に紹介させていただきます。
以前欲しいものリストで本をいただいたときの記事
>>ブログで欲しいものリストを公開したら素敵なものが届きました!
では!