2009年12月16日水曜日

Blogger でサイドに Twitter の Follow me のバッジを付ける

1. Twitter の Follow me バッジをつけたい

たまに見かけるブログの横にある Twitter の Follow me のバッジ。どこのサービスを利用しているのだろう?

ブログの横に「Follow me」バッジをつける方法・・・ - IDEA*IDEA ~ 百式管理人のライフハックブログ によると、

このバッジをつけるツール、たくさんあるかと思いきや、探してみたらGO2WEB20のものしかないようですね・・・。

 

2. コードの生成とテンプレートの編集

早速、Twitter "Follow" Badge for your site でコードを生成。

  • Blogger のダッシュボード > レイアウト > HTML の編集 の「テンプレートの編集

において、</body> タグの前に貼り付けた。

しかし、バッジが表示されず。 (+_+)

 

3. <> を HTML の特殊文字に置き換える

Blogger Buster: 16 Useful Twitter Tools for Blogger によると、Blogger で表示させるには、上記のコードを HTML/JavaScript のウィジェットとして追加するか、または、

Replace <-- and --> in the generated code with &lt;-- and --&gt; (this enables the script to function correctly and display the badge in your page)

script タグ内の < >HTML の特殊文字 に置き換えることによって動作するようだ。

先ほど生成されたコードの中の

<script  … ><!--

--></script>

<script  … >&lt;!--

--&gt;</script>

に変更することで、バッジが表示されるようになった。

10 件のコメント:

  1. このエントリーで、あきらめかけていたバッジをサイトにつけることができました。ありがとうございました!!

    返信削除
  2. Twitterを始めたら付けたいと思っていましたが表示されずあきらめかけていました。
    ありがとうございました。

    返信削除
  3. 助かりました!ありがとうございます。とてもグッドなエントリーですね!

    返信削除
  4. 私もFollow meボタンをつけることができました。
    ありがとうございました。

    返信削除
  5. わたしもつけることができました!
    ありがとうございました!

    返信削除
  6. 今朝から全然表示されず困り果てていたところ、
    コチラのブログにたどり着きました!
    そして、無事に表示されました!
    役立つ情報どうもありがとうございます!!

    返信削除
  7. ありがとうございました。感謝感激です(^o^)

    返信削除
  8. 役に立ちました!リンク付きで紹介させてもらいました→http://blog.elephancube.jp/2011/01/follow-us-blogger.html

    返信削除
  9. ありがとうございます。付けられました。

    返信削除
  10. 参考にさせていただきました。備忘録としてBLOGに投稿してあります。
    http://taka1028.blogspot.com/2011/10/twitterfollowblog.html

    返信削除