THE HAM MEDIA BLOG

はてなブックマークでの人気のエントリーが自動的に表示されるようにしてみた

Clip to Evernote このエントリーをはてなブックマークに追加
カテゴリ:
jQuery
タグ:
API
javascript
jquery
RSS

はてなブックマークでの人気のエントリー

少しずつですがここのブログも訪れる人が増えてきています。
こんなブログですが、訪れていただきありがとうございます。

訪れる人が増えるにつれて、ブックマークされる数も
微々たるものですがされるようになってきました。

まだまだ微々たるものですが、
せっかくなので、こんな記事がブックマークされているよという、
現在はてなブックマークで人気のエントリーを
コンテンツの下部にて自動的に表示されるようにしてみました。



今回もGoogle AJAX Feed APIを使って

今回もGoogle AJAX Feed APIを使って表示してみた。
また、簡素化するためにjQueryも利用している。

■ サンプルスクリプト

//Fees APIをロード
google.load("feeds", "1");
 
$(function() {

	//RSSフィードのURL
    var feed = new google.feeds.Feed(RSS);
    
    //表示するエントリー数を入力
    feed.setNumEntries(10);
    
    feed.load(function(result) {
        if (!result.error) {
        
        	//変数を初期化
            var useFeed = "";
            
            //指定したエントリー数分リピート
             for (var i = 0; i < result.feed.entries.length; i++) {
                
                //エントリーを一つずつ取得
                var entry = result.feed.entries[i];
                
                //不必要な部分を削除(今回はブログ名を削除)
                var Title = entry.title.replace("不必要テキスト" , "");
                
                //リストの中に入れる
                useFeed += '<li><a href="' + entry.link + '">'
                + Title + '</a>
                <a href="http://b.hatena.ne.jp/entry/'
                + entry.link + '">
                <img src="http://b.hatena.ne.jp/entry/image/'
                + entry.link + '" /></a>
                <a href="http://b.hatena.ne.jp/append?'
             	+ entry.link + '">
             	<img src="GIFのURL"
             	 alt="このエントリーをはてなブックマークする"
             	 title="このエントリーをはてなブックマークする"
             	  width="16" height="12" /></a></li>';
            }
        
        //表示部分の指定
        $("div#feed").html('
    ' + useFeed + '
'); } }); });

■ サンプルプレビュー

RSSフィードが読み込めませんでした

ちょっと解説

本当にちょっとだけ解説。

以前にも紹介したソースに、
はてなブックマーク数と、ブックマークするをつけた。

ブックマークするの画像は書くブログにアップしてそれを利用してください。

ここのブログのエントリーが表示されるときに、
各タイトルに毎回ブログ名がつく仕様になっていたため(titleタグからとっているため)
.replace("検索文字","")を使って削除した。

今後はページの下に表示されるようにしてあるので、
ここのブログの何がブックマークされているんだ?というのをぜひみてください。



この記事へのコメント
コメントを書く
お名前: [必須入力]

メールアドレス: [必須入力]

ホームページアドレス:

コメント: [必須入力]

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。

この記事へのトラックバック

はてブでの人気エントリーをGoogle AJAX Feed APIを使って表示する
Excerpt: <p>はてブでの人気記事一覧を表示してみました。<br /> 重くなりそうな気がするからそのあたりの対策も今後やっていかないと。</p>
Weblog: linker journal
Tracked: 2009-08-31 19:28

トップに戻る

×

この広告は180日以上新しい記事の投稿がないブログに表示されております。