ブログ等でよく このエントリーのはてなブックマーク被リンク数 で、はてなユーザのソーシャルブックマークでリンクされた数を表示しているのを見かけますが、これを表示する意味のひとつにSEO的な側面もあるみたいなので、表示できるようにしてみました。

SEO的な話は、今日のSEO:はてなブックマークの活用は有効なSEOだのブログ記事なんですが、そこにこのように書かれていました。

※3人以上のはてなユーザーからブックマークされると、注目エントリーに掲載される。

今日のSEO:はてなブックマークの活用は有効なSEOだ

で、この注目エントリーの Google PageRank が2なので、そこからバックリンクがもらえるとSEOの効果があるよ。ということらしいです。そういう一面もあったんですね。もちろんそれだけの理由で表示してるわけではないでしょうけど。

それほどブックマークされなくても、こちらからリンクをはれば、はてなからバックリンクをもらえるしくみになっているのならそこそこSEOの意味はあるだろうし、誰がブックマークしたかも簡単にチェックできるといった便利さもあるので、表示するようにカスタマイズしてみました。

wp-hatena プラグインをカスタマイズしてみる

このブログのテーマのひとつでもある『あるものは使う』の精神にのっとって、WordPress エントリをはてなブックマークに登録 – wp-hatena プラグイン正式版 – リリースで配布されている wp-hatena をカスタマイズしてみました。(正確にはWordPress Plugins/JSeries ≫ wp-hatenaで配布しているのでしょうか?)

上記リンク先からファイルをダウンロードして解凍するとwp-hatena.phpがあるので、そのなかの適当な場所に、以下のコード二つを追加してください。
(2007/04/24現在、wp-hatena-0.93j.zipです)

/**
 * WP interface.
 *
 * @param none
 * @return none (はてなブックマーク用の被リンク数を echo)
 */
function entryHatena()
{
    echo
        $this->entryBookmarkURL(
            'はてなブックマーク',
            'http://b.hatena.ne.jp/entry/',
            'http://b.hatena.ne.jp/entry/image/'
        );
}
/**
 * Bookmark URL entry.
 *
 * @param $sitename (サイト名称文字列)
 * @param $linkurl (リンク先URL)
 * @param $iconfile (画像ファイル URL)
 * @return $tag (画像リンクタグ)
 */
function entryBookmarkURL($sitename, $linkurl, $iconfile)
{
    $title = $this->utf8_encode(get_the_title());

    $tag  = '<a';
    $tag .= ' href="' . $linkurl . get_permalink() . '"';
    $tag .= '>';
    $tag .= '<img';
    $tag .= ' src="' . $iconfile . get_permalink() . '"';
    $tag .= ' alt="' . $title . 'の' . $sitename . '被リンク数"';
    $tag .= ' title="' . $title . 'の' . $sitename . '被リンク数"';
    $tag .= ' style="border: 0;margin: 0;padding: 0;vertical-align: baseline;" ';
    $tag .= '/>';
    $tag .= '</a>';

    return $tag;
}

あとは、テーマの表示したいところに以下のコードを追加すれば表示されます。

<?php if(isset($wph)) $wph->entryHatena(); ?>

ちなみに、このブログのバージョンは、2.1.3で動いていますが、2.0.X でも動くと思います。採用するかどうかは自己責任でお願いします。

で、このブログをブックマークしてくれている人がいないので現状表示されていません。(2007/04/24現在)
テストのために自分でブックマークして確認はしたのですが消しました。
誰か、ブックマークしてください。(反映されるのにちょっと時間がかかります。)

おまけで、del.icio.us と livedoorクリップ・ソーシャルブックマークも作ったのですが、どれくらい需要はあるんでしょう?

ファイルをそのままダウンロードできるようにしたいところですが、こういうのを公開したことがないので、ライセンスとかその辺のルールがいまいち分からないし、作者のhiromasa.zone :o ) さん の許可もないので回りくどくて申し訳ないです。正直、ブログにソースコード書くのは面倒です。何か楽な方法はないでしょうか。

その後

で、カスタマイズした後にブックマークの登録件数を取得して、1件以上なら表示できるようにしようと思って、APIとかないか調べていたら、[WP:Plugin] 被ブックマーク数表示+ランキング生成プラグインという素敵なプラグインがありました。ショック。。

でも、自分がカスタマイズしたものに愛着が沸いたというか、懲りずに被ブックマーク数表示+ランキング生成プラグインを参考に、wp-hatenaを自分好みにカスタマイズしたんですけど、それはまた次の機会に。

style.cssの変更に対応する

2007/04/22 日曜日 18:40 投稿者 zon

ブログを立ち上げて間もない状態なので、ブログのレイアウトやデザインの微調整のためにスタイルシートを頻繁にいじっている状態になっています。

で、このスタイルシートがブラウザにキャッシュされていて、内容を変更しても閲覧している側がページの再読み込みをしてくれなければ、古いキャッシュファイルのスタイルシートのまま閲覧されておかしなレイアウトになっていることってあると思います。

正確には、自分が使っているFirefox2.0はスタイルシートが変更されたら、自動的にスタイルシートを再読み込みしてくれているのかこの現象は出ないのですが、IE6.0だと、スタイルシートを変更しても古いスタイルシートを使ってレイアウトがおかしくなります。

これを回避する為にちょっとした小技メモ。

ファイル名が同じでもHTMLで読み込む際のファイル名の後に、?v=xxx をつければ、別ファイルとしてキャッシュされるようです。これが、HTMLの文法的にありかなしなのかは調べていないから分かりませんが、割と使われている方法みたいだし、この際その辺の細かいことは気にせずコレを利用します。

?v=xxxを使った例

<style type="text/css" media="screen">
@import url(style.css?v=1.0.0);
</style>

この ?v=xxx の xxx 部分を更新時間が表示されるようにして、スタイルシートを修正すると自動で xxx が変更されるようにします。

WordPress の場合は、スタイルシートを読み込んでいる処理をしているところは、以下のファイルがほとんどだと思うのでここを修正すればOKです。

/wp-content/themes/テーマ名/header.php

スタイルシートのパスを出力する関数は、

<?php bloginfo('stylesheet_url'); ?>

でこの後に、ファイルの更新時間を取得する関数 filemtime('ファイルのパス') を使って

?v=<?php filemtime('ファイルのパス') ?>

を追加します。

WordPressでのカスタマイズ例

難しいことは分からないという人のために WordPress で使えるサンプルコードを以下に書いておきますが、この小技は、WordPressだけじゃなく、スタイルシートのパスさえ変更すれば、いろいろなところで使えます。

<style type="text/css" media="screen">
@import url(<?php bloginfo("stylesheet_url"); ?>?v=<?php echo filemtime(get_stylesheet_directory() . '/style.css'); ?>);
</style>

Technorati(テクノラティ)に登録してみた

2007/04/22 日曜日 5:08 投稿者 zon

とりあえず記事を投稿した時点で立派なブログになったので、Technorati(テクノラティ) に登録してみました。

と言っても、この Technorathi がどういうものかはよく分かっていなくて、テクノラティジャパンとはを読んではみたもののどのように使ったらいいのかよく分かりませんでした。

では、なぜ登録したかと言うと、 SEOに利くというのをちらほらと目にすることがあったので、いかほどの効果があるものか試してみようと思ったわけです。 でも、これってブロガーには知られているかもしれませんが、ブログをコミュニケーションや外部に公開するものとしてほとんど使ったことがない自分にとっては、テクノラティの存在自体をほぼ知りませんでした。ロゴは見かけたことがあったくらいで、読み方が分からなかったくらいです。何かを調べるために検索をしても引っかかることもないし。

その点、はてなは、このブログのために最近登録したくらい関わりがなかったのですが、検索でよく引っかかっていたので、詳しくは知らなくても大体どんなサービスをしているかくらいは分かるのですが。

ブログにはブログの文化やルールがあるのだろうと思いつつ、もう少しこのブログを続けていけば、その効果も見えてくるだろうと期待しています。

Background Image Maker を使ってみた

2007/04/22 日曜日 3:46 投稿者 zon

メニューのヘッダとかフッタの背景画像を Background Image Maker で作ってみました。『WEB2.0 っぽいサイト』にする為のWEBツールとしてといろいろな場所で紹介されているので、今更感はあるかと思いますが、自分はあまりジェネレータ系のWEBツールとか使ったことがないので、このブログでは、あえて積極的にそういったものを使っていこうと思っています。

ついでに、現状で使っているジェネレータがもうひとつあったので、これも結構有名っぽいですが紹介しておきます。

右のメニューのメタ情報っぽく並んでいる80×15のボタン画像の一部は Dynamic Drive online tools: Button Maker を使って作成しています。全部ではないのは、gtmcknight.com: Steal These Buttons で、この80×15のボタン画像がコレクションされていて、そこから拝借したものもいくつかあるからです。

『あるものは使う』を基本のスタンスとして、気になるところだけ自分の好みに修正していこうかと思っています。

zontheworld
うまい焼肉が喰いたい。
HTML convert time: 0.580 sec. ( Login )