2009-11 / 01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30

2009-11-22 (日)

はてなブックマークのコメントを、アイテム毎のページに表示させた [chalow][Twitter]

このブログにはコメント欄があるので、時々コメントを残してもらえるの
ですが、はてなブックマーク(以下、はてブ)にも良いコメントがあります。

そこで、アイテム毎のページにはてブのコメントを表示させました。今の
ところ、一番多いのは [2009-10-04-1] の 509 です。この時は一日で
10,000 アクセスもありました。(普段は 100 アクセス程度です。)

以下、設置手順です。



1.ブログにはてブのコメントを表示するhatana_bookmark_anywhere.js
から、hatena_bookmark_anywhere.js をダウンロードし、
http://masutaka.net/chalow/ に置きました。

2. アイテムページのテンプレート $item_page_template に、以下を追加
しました。

<!-- hatena_bookmark_anywhere.js -->
<script type= "text/javascript">/*<![CDATA[*/
var hatena_bookmark_anywhere_style = false; // trueでデフォルトスタイル falseを設定するとCSSでスタイルの指定が可能
// var hatena_bookmark_anywhere_limit = 10; // 表示する件数
// var hatena_bookmark_anywhere_collapse; // trueにすると、コメントの書いてないブクマを表示しない。指定しない場合は、表示件数を超えた場合のみコメントを表示しない
// var hatena_bookmark_anywhere_url; // 表示するURL 未指定の場合、現在のページ
/*]]>*/</script>
<script src="hatena-bookmark-anywhere.js" type="text/javascript" charset="utf-8"></script>
<div id="hatena_bookmark_anywhere"></div>
<!--/ hatena_bookmark_anywhere.js -->



3.hatana_bookmark_anywhere.jsの設置方法とカスタマイズ」を参考に
しながら、現在使っている kaeru.css に合うように、kaeru.css から
import している clfix.css
に CSS を追加しました。

4. デザインがこのサイトに合うように、hatena_bookmark_anywhere.js を
修正しました。また、より高速な /entry/jsonlite/ エンドポイントを使
うようにも修正しました。(参考情報: はてなブックマークエントリー情報取得API)

--- hatena-bookmark-anywhere-0-1.js	2009-11-22 00:07:27.000000000 +0900
+++ hatena-bookmark-anywhere.js	2009-11-22 11:22:05.000000000 +0900
@@ -57,16 +57,19 @@
 	}

 	if(json==null) {
-	    html += "このエントリーのはてなブックマーク (0) <a class=\"hatena_bookmark_anywhere_go\" href=\"http://b.hatena.ne.jp/entry/"+escapeHTML(hatena_bookmark_anywhere_url)+"\">はてなブックマークのページへ飛ぶ</a><br/>";
+	    html += "<div class=\"hatena_bookmark_anywhere_caption\">";
+	    html += "このエントリのはてなブックマーク (0) <a class=\"hatena_bookmark_anywhere_go\" href=\"http://b.hatena.ne.jp/entry/"+escapeHTML(hatena_bookmark_anywhere_url)+"\">はてなブックマークのページへ飛ぶ</a><br/>";
+	    html += "</div>";
 	    html += "<div class=\"hatena_bookmark_anywhere_zero\">";
-	    html += "このページはまだブックマークされていません。";
 	    html += "</div>";
 	}
 	else {
 	    if((typeof hatena_bookmark_anywhere_limit)!="number") hatena_bookmark_anywhere_limit = 100;
 	    if((typeof hatena_bookmark_anywhere_collapse)=="undefined" && json.bookmarks.length>hatena_bookmark_anywhere_limit) hatena_bookmark_anywhere_collapse = true;

-	    html += "このエントリーのはてなブックマーク ("+json.count+") <a class=\"hatena_bookmark_anywhere_go\" href=\"http://b.hatena.ne.jp/entry/"+escapeHTML(hatena_bookmark_anywhere_url)+"\">はてなブックマークのページへ飛ぶ</a><br/>";
+	    html += "<div class=\"hatena_bookmark_anywhere_caption\">";
+	    html += "このエントリのはてなブックマーク ("+json.count+") <a class=\"hatena_bookmark_anywhere_go\" href=\"http://b.hatena.ne.jp/entry/"+escapeHTML(hatena_bookmark_anywhere_url)+"\">はてなブックマークのページへ飛ぶ</a><br/>";
+	    html += "</div>";
 	    html += "<ul id=\"bookmarked_user\">";
 	    for(var i=0; i<json.bookmarks.length&&hatena_bookmark_anywhere_limit>0; ++i) {
 		var bookmark = json.bookmarks[i];
@@ -96,7 +99,7 @@
 	    var script = document.createElement("script");
 	    script.setAttribute("type","text/javascript");
 	    if((typeof hatena_bookmark_anywhere_url)=="undefined") hatena_bookmark_anywhere_url = location.href.replace(/#.*/,"");
-	    script.setAttribute("src","http://b.hatena.ne.jp/entry/json/?url="+hatena_bookmark_anywhere_url+"&callback=__hatena_bookmark_anywhere_receiver");
+	    script.setAttribute("src","http://b.hatena.ne.jp/entry/jsonlite/?url="+hatena_bookmark_anywhere_url+"&callback=__hatena_bookmark_anywhere_receiver");
 	    document.body.appendChild(script);
 	}
     } catch(e) { }



ついでにサイドバーに「このブログのはてなブックマーク数」を追加しま
した。ほとんどが [2009-10-04-1] の記事ですねえ。^^;

あと、「[を] はてなブックマークによる自blogの注目記事リスト」を参考
にしながら、サイドバーにはてブの新着エントリーや、人気エントリーを
表示させようとしましたが、さくらで kuttuki-rss.pl を実行すると以下
のエラーが発生したので、今回は見送りました。

Use of uninitialized value in string eq at /usr/local/lib/perl5/site_perl/5.8.9/XML/RSS.pm line 934, <DATA> line 855.
Use of uninitialized value in string eq at /usr/local/lib/perl5/site_perl/5.8.9/XML/RSS.pm line 934, <DATA> line 855.
not well-formed (invalid token) at line 128, column 63, byte 7672 at /usr/local/lib/perl5/site_perl/5.8.9/mach/XML/Parser.pm line 187


さらにさらに「MOONGIFT のこの記事」を参考にしながら、Twitter のつぶ
やきを各ページに表示させようとしましたが、うまく表示出来なかったの
で諦めました。Twitter が TinyURL を捨てて、bit.ly を採用したからな
のかもしれません。twitterer anywhere の開発は止まっているようです。

悔しいので、サイドバーに「このブログに関するつぶやき」のリンクを貼
りました。

追記(2009-11-22):
現在は、より高速な /entry/jsonlite/ エンドポイントが使えるので、4
のパッチを修正しました。コメントは日付の昇順にしたいなあ。

この記事に言及しているこのブログ内の記事

2009-11 / 01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30

検索


最近の話題
- 2021-01-16
  tfupdate orb の circleci/orb-tools を v8.27.5 から v10.0.3 にアップデートした
- 2021-01-05
  思考を寝かせて、優先順位を決めるための「やるかもしれないリスト」がとてもうまくワークしている
- 2020-12-20
  『データマネジメントが30分でわかる本』を読んだ
- 2020-12-03
  優先度より優先順位のほうが偉い
- 2020-11-10
  『理論から学ぶデータベース実践入門』を読んだ
- 2020-10-30
  CircleCI の旧 UI で設定した Slack Integration の設定を確認も変更も削除もできない件への対応方法
- 2020-09-03
  Looker User Meetup in Tokyo #4(BEACON Japan 前夜祭)に参加した #lookermeetup
最近追記された記事
- 2014-11-02-2 (301日前)
- 2020-01-22-1 (307日前)
- 2019-02-11-1 (481日前)
- 2019-02-03-1 (481日前)
- 2019-01-28-1 (481日前)
- 2019-02-03-1 (523日前)
- 2018-11-28-1 (537日前)
- 2019-05-07-1 (617日前)
- 2018-04-30-1 (632日前)
- 2018-01-28-1 (644日前)
カテゴリ
- Android (2)
- Anthy (3)
- Apache (11)
- Apple (1)
- ATOK (4)
- au (3)
- AWS (24)
- Bazaar (1)
- Berkshelf (2)
- BigQuery (1)
- BitBar (4)
- Book (111)
- Boxen (2)
- Bugsnag (1)
- capistrano (4)
- chalow (57)
- ChatWork (1)
- Chef (17)
- Chrome (3)
- Chromecast (1)
- CircleCI (14)
- clang (26)
- Comics (2)
- Cooking (10)
- cvs (15)
- cygwin (12)
- D3.js (1)
- Debian (55)
- Docker (5)
- E-mail (9)
- elasticsearch (4)
- Emacs (225)
- Emacs講座 (10)
- English (4)
- feedforce (7)
- fetchmail (3)
- Firefox (20)
- Fluentd (4)
- ftp (2)
- Game (21)
- GCP (1)
- Gem (5)
- Git (9)
- GitHub (23)
- golang (11)
- Google (1)
- gpg (4)
- GrowthForecast (7)
- Health (7)
- Heroku (21)
- Homebrew (10)
- HTML (6)
- iBook (1)
- iOS (1)
- iPad (1)
- iPhone (17)
- IRC (1)
- Jenkins (8)
- JS (1)
- Karabiner (1)
- KeySnail (3)
- Kibana (1)
- Kindle (1)
- Kubernetes (2)
- Langrich (7)
- LDAP (6)
- Life (24)
- Linux (7)
- Mackerel (1)
- macOS (1)
- Mew (18)
- MongoDB (1)
- Mozilla (19)
- Music (1)
- MySQL (1)
- NAS (4)
- nginx (6)
- NHK (1)
- Node (1)
- ntp (4)
- OOP (2)
- OpenID (2)
- openssl (1)
- Opera (2)
- OSX (41)
- Perl (14)
- PHP (19)
- PostgreSQL (1)
- procmail (4)
- Programing (3)
- Puppet (1)
- Python (2)
- Rails (13)
- Rake (2)
- RaspberryPi (2)
- Redash (1)
- RedHat (29)
- Redmine (3)
- RSpec (2)
- Ruby (54)
- samba (3)
- screen (7)
- sed (5)
- serverspec (6)
- sh (8)
- Slack (4)
- Solaris9 (22)
- Spring (2)
- ssh (4)
- StatusNet (21)
- svn (12)
- Swift (1)
- Tablet (1)
- tdiary (3)
- Terraform (3)
- Twitter (15)
- Twmode (6)
- Ubuntu (5)
- UNIX (102)
- vagrant (8)
- Video (21)
- vim (1)
- Wercker (9)
- Windows (29)
- Wine (3)
- XML (11)
- XP (1)
- zsh (26)
- インストールメモ (33)
- クイックシェイプ (12)
- ネタ (15)
- 勉強会 (19)
- 携帯 (6)
- 正規表現 (4)
過去ログ
2021 : 01 02 03 04 05 06 07 08 09 10 11 12
2020 : 01 02 03 04 05 06 07 08 09 10 11 12
2019 : 01 02 03 04 05 06 07 08 09 10 11 12
2018 : 01 02 03 04 05 06 07 08 09 10 11 12
2017 : 01 02 03 04 05 06 07 08 09 10 11 12
2016 : 01 02 03 04 05 06 07 08 09 10 11 12
2015 : 01 02 03 04 05 06 07 08 09 10 11 12
2014 : 01 02 03 04 05 06 07 08 09 10 11 12
2013 : 01 02 03 04 05 06 07 08 09 10 11 12
2012 : 01 02 03 04 05 06 07 08 09 10 11 12
2011 : 01 02 03 04 05 06 07 08 09 10 11 12
2010 : 01 02 03 04 05 06 07 08 09 10 11 12
2009 : 01 02 03 04 05 06 07 08 09 10 11 12
2008 : 01 02 03 04 05 06 07 08 09 10 11 12
2007 : 01 02 03 04 05 06 07 08 09 10 11 12
2006 : 01 02 03 04 05 06 07 08 09 10 11 12
2005 : 01 02 03 04 05 06 07 08 09 10 11 12
2004 : 01 02 03 04 05 06 07 08 09 10 11 12
2003 : 01 02 03 04 05 06 07 08 09 10 11 12
2002 : 01 02 03 04 05 06 07 08 09 10 11 12
2001 : 01 02 03 04 05 06 07 08 09 10 11 12