by shigemk2

当面は技術的なことしか書かない

一昨日のナウい人気記事表示で、最近の記事も表示さすようにした

f:id:shigemk2:20131117002319p:plain

昨日のナウい人気記事表示を画像なしエントリーに対応さしてみた - by shigemk2

 <a href="http://b.hatena.ne.jp/entrylist?url=http://shigemk2.hatenablog.com/">Recent entries</a>

と、

 var feed = new google.feeds.Feed("http://b.hatena.ne.jp/entrylist?mode=rss&url=" +blogURL);

の部分をちょっと修正しただけです。

<!-- HTML : recent_entries -->
<div class="hatena-module-title">
 <a href="http://b.hatena.ne.jp/entrylist?url=http://shigemk2.hatenablog.com/">Recent entries</a>
</div>
<!-- 最近記事を表示する -->
<div id="recent_entries_feed" align="center">Now Loading...</div>
<!-- SCRIPT : recent_entries_feed -->
<script src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("feeds", "1"); 
function initialize() {
 //RSSフィードの取得
 var blogURL = "http://shigemk2.hatenablog.com/";
 var blogTITLE = "by shigemk2";
 var feed = new google.feeds.Feed("http://b.hatena.ne.jp/entrylist?mode=rss&url=" +blogURL);
 //取得するフィード数
 feed.setNumEntries(5);
 //実際に読む込む
 feed.load(function(result) {
 //読み込めたか判別
  if (!result.error) {
   //表示部分を選択
   var container = document.getElementById("recent_entries_feed");
   //変数の初期化
   var useFeed = "";
   //Feedの処理
   for (var i = 0; i < result.feed.entries.length; i++) {
    //Feedを一つ抽出
    var entry = result.feed.entries[i];
    //日付を抽出
    var pdate = new Date(entry.publishedDate);
    var strdate = (pdate.getMonth() + 1) + '月' + pdate.getDate() + '日';
    //最初の画像を抽出
    var first_image = entry.content.match(/(http:){1}[\S_-]+\.(?:jpg|gif|png)/);
    //画像サイズを調整
    first_image[0] = first_image[0].replace(/(\.[^.]+$)/ , "_l$1");
    if (first_image[0] == "http://b.hatena.ne.jp/images/append_l.gif") {
      //画像がないとき
      useFeed += '<div class="htbl_popular_entry"><a href="' + entry.link + '"><div class="htbl_popular_entry_text_no_img"><span class="entry_title">' + entry.title.replace('- '+blogTITLE , '') + '</span><span class="entry_hatebu"><img src="http://b.hatena.ne.jp/entry/image/' + entry.link + '"></span><span class="entry_date">' + strdate + '</span></div></a></div>';
    } else {
      useFeed += '<div class="htbl_popular_entry"><a href="' + entry.link + '"><img class="htbl_popular_entry_img" src="' + first_image[0] + '"><div class="htbl_popular_entry_text"><span class="entry_title">' + entry.title.replace('- '+blogTITLE , '') + '</span><span class="entry_hatebu"><img src="http://b.hatena.ne.jp/entry/image/' + entry.link + '"></span><span class="entry_date">' + strdate + '</span></div></a></div>';
    }
   }
  //リストを表示させる
  container.innerHTML = '<div class="htbl_popular_entries">' + useFeed + '</div>';
   }
 });
}
google.setOnLoadCallback(initialize);
</script>