新・元地方の中規模印刷会社で苦悩するWebデザイナー改めWebディレクターの日記

自由な20代、窮屈な30代を経て、遂に40代になっちまったWebディレクター&パソコン講師の覚書と思う言(こと)。略称【ちほちゅう】

*

はてブ(はてなブックマーク)ボタンが新しくなった

   

  • このエントリーをはてなブックマークに追加

1年以上前の記事です。内容が古い可能性があります。

どなたかのツイートで知ったのですが、当ブログでも配置しているはてなブックマーク(はてブ)のボタンが新しくなりました。

使いやすくなりました! はてなブックマークボタン

新しいはてなブックマークボタン

スポンサーリンク
 

さっそく入れ替えてみました。ちなみに旧デザインではこんな感じに表示されてました。

旧はてなブックマークボタンによるデザイン

ソースの取得も簡単です。
上記画像のとおりフォームに必要事項を入力すると右側にソースを表示します。
が、ライブドアブログの場合(他、ブログもそうだと思いますが)ちょこっと改造が必要。

まずは、画像の通りやって得たソースが以下のとおり。

<a href="http://b.hatena.ne.jp/entry/http://webdirector.livedoor.biz/" class="hatena-bookmark-button" data-hatena-bookmark-title="地方の印刷会社Webディレクターの日記" data-hatena-bookmark-layout="standard" title="このエントリーをはてなブックマークに追加"><img src="http://b.st-hatena.com/images/entry-button/button-only.gif" alt="このエントリーをはてなブックマークに追加" width="20" height="20" style="border: none;" /></a><script type="text/javascript" src="http://b.st-hatena.com/js/bookmark_button.js" charset="utf-8" async="async"></script>

これの赤字の部分をそれぞれ書き換えます。
フォームに直接入力すると例のごとくデコードしてしまうので使えません。
以下のように書き換えます。

<a href="http://b.hatena.ne.jp/entry/<$ArticlePermalink$>" class="hatena-bookmark-button" data-hatena-bookmark-title="<$ArticleTitle ESCAPE$> : 地方の印刷会社Webディレクターの日記" data-hatena-bookmark-layout="standard" title="このエントリーをはてなブックマークに追加"><img src="http://b.st-hatena.com/images/entry-button/button-only.gif" alt="このエントリーをはてなブックマークに追加" width="20" height="20" style="border: none;" /></a><script type="text/javascript" src="http://b.st-hatena.com/js/bookmark_button.js" charset="utf-8" async="async"></script>

あとは、今までソースの入っていた部分を差し替えればOK。

こんな感じのレイアウトになりました。

新はてなブックマークボタンによるデザイン

他のボタンとも釣り合ってますし、なかなかいい感じじゃないでしょうか?

 - デザイン, 告知・紹介・ニュース

アドセンス広告メイン

Message

メールアドレスが公開されることはありません。

  関連記事

8月8日にフジテレビを見ない運動がツイッターで広がる

1年以上前の記事です。内容が古い可能性があります。□ Twitter上 …

只今開催中!! けやきひろば「秋のビール祭り」@さいたま新都心 #beerkeyaki

1年以上前の記事です。内容が古い可能性があります。去年もリポートしましたが今年も …

jQueryスライドショー「bxSlider」のレイアウトをカスタマイズする際に注意すべきたったひとつのポイント

1年以上前の記事です。内容が古い可能性があります。なんとも有名なjQueryを使 …

結局その気になればハッキングみたいなことなんでもできるらしい

1年以上前の記事です。内容が古い可能性があります。GIGAZINEさんでここのと …

今度のスパムは顔より心。Facebookでこんなメッセージが届いた

1年以上前の記事です。内容が古い可能性があります。うーむ。相変わらず知らない女性 …

あさりラーメン、はまぐりラーメンが女子に人気。あら炊き塩ラーメン「海神(かいじん)」(吉祥寺)

1年以上前の記事です。内容が古い可能性があります。食べログ厨女子がたくさんいるな …

no image
出会い系サイト規制法にガイドライン―全掲示板及びSNSが出会い系サイトに!?

1年以上前の記事です。内容が古い可能性があります。国が出会い系サイトを出会い系サ …

Androidユーザーは「Gcogle Play」に注意!

1年以上前の記事です。内容が古い可能性があります。Androidユーザーはみな、 …

第2回「熊谷B級グルメ大会」は「わくわくスポ文まつり」と同時開催で盛りだくさんだった

1年以上前の記事です。内容が古い可能性があります。ただでさえ、ブログを書いたりバ …

ビールも飲めてケーキも食べれる「ダッキーダック(Ducky Duck)」新宿店

1年以上前の記事です。内容が古い可能性があります。本来の売りは「生パスタ」みたい …

血液型オヤジ