bloggerの機能として付いているソーシャルボタンは
gmailに送るとかg+に送るとかあまり使えたもんじゃないので、ガッと簡単に追加できれば嬉しいな、ということで探した結果、楽ちんに追加できるJavaScriptを発見したので紹介します。
Social Media Buttonsという名前のプロジェクトでgithubに上がっていますが面倒な事はおまかせで、表示させたい部分にちょこっとソースを書き込むだけでOKです。
うちのブログにも設置してみました。
上のリンク先にも書いていますがmd5.jsとsmb.jsをロードするだけで下準備は完了です。
と書くだけでは意味がないので、bloggerでの利用を想定した設置方法を。
上記の2つのファイルを、githubから直接ロードするようにします。
これをbloggerのレイアウトでHTMLを直接編集してheadタグ内に入れます。どこでも大丈夫だと思いますが、困ったら一番最後にでも入れましょう。</head>で検索するとすぐに分かると思います。ちなみにウィジェットを展開したHTMLで修正を行います。
次に、実際に表示させたい部分に表示用のコードを書きます。
上のコードだけで、twitterのソーシャルボタンが表示されます。「|」で連結すれば、複数のソーシャルボタンを一括で表示できるらしいですが、表示順≠記述順なので、一つ一つ書く方をオススメします。
HTMLの直接編集はバックアップを取って、いつでも戻せる状態にしてから、ガシガシやりましょう!
github: Social Media Buttons
gmailに送るとかg+に送るとかあまり使えたもんじゃないので、ガッと簡単に追加できれば嬉しいな、ということで探した結果、楽ちんに追加できるJavaScriptを発見したので紹介します。
Social Media Buttonsという名前のプロジェクトでgithubに上がっていますが面倒な事はおまかせで、表示させたい部分にちょこっとソースを書き込むだけでOKです。
うちのブログにも設置してみました。
上のリンク先にも書いていますがmd5.jsとsmb.jsをロードするだけで下準備は完了です。
と書くだけでは意味がないので、bloggerでの利用を想定した設置方法を。
上記の2つのファイルを、githubから直接ロードするようにします。
<script type="text/javascript" src="https://raw.github.com/clown/smb/master/md5.js"></script> <script type="text/javascript" src="https://raw.github.com/clown/smb/master/smb.js"></script>
これをbloggerのレイアウトでHTMLを直接編集してheadタグ内に入れます。どこでも大丈夫だと思いますが、困ったら一番最後にでも入れましょう。</head>で検索するとすぐに分かると思います。ちなみにウィジェットを展開したHTMLで修正を行います。
次に、実際に表示させたい部分に表示用のコードを書きます。
smb.show(smb.twitter);
上のコードだけで、twitterのソーシャルボタンが表示されます。「|」で連結すれば、複数のソーシャルボタンを一括で表示できるらしいですが、表示順≠記述順なので、一つ一つ書く方をオススメします。
smb.show(smb.twitter); smb.show(smb.facebook); smb.show(smb.tumblr); smb.show(smb.hatena); smb.show(smb.delicious);
HTMLの直接編集はバックアップを取って、いつでも戻せる状態にしてから、ガシガシやりましょう!
github: Social Media Buttons
コメント
コメントを投稿