はてブ新着記事をタグ指定サムネイルつきの抜粋で表示する

はてなブックマークの新着記事をタグ指定のRSSで取得する方法を調べてみた。

まずはURLで取得してみる

以下の形式で取得できる。

https://b.hatena.ne.jp/t/(タグ)?sort=hot&threshold=1&mode=rss

ボイント1: &threshold=(数字）で、収集するはてブの数を指定できる。

ボイント2: （タグ)の名前はパーセントエンコード(URLエンコード）でのUTF-8で書かないと認識されない。

変換したいパスをそのままChromeのURLに貼り付けたら変換された。

このサイトで変換できるみたい。

URLエンコード・デコードフォーム

具体例

例えば、睡眠のタグがついたはてブで、3フォロー以上はこんな感じだ。

https://b.hatena.ne.jp/t/%E7%9D%A1%E7%9C%A0?sort=hot&threshold=3&mode=rss

取得したRSSを記事に表示する

次は、取得したRSSをWEBページに表示する。

wordpressを使えば、カンタンに表示できた。参考にしたのは、以下のサイト。

複数外部RSSフィードをWordPressで表示 | 簡単ホームページ作成支援-Detaramehp

<archives/hp include_once(ABSPATH . WPINC . '/feed.php');
$rss = fetch_feed(array(
'https://b.hatena.ne.jp/t/%E7%9D%A1%E7%9C%A0?sort=hot&threshold=3&mode=rss',
//RSSフィード1
));
if (!is_wp_error( $rss ) ) : 
    $rss->set_cache_duration(1800);
    $rss->init(); 
    $maxitems = $rss->get_item_quantity(3); 
    $rss_items = $rss->get_items(0, $maxitems); 
    date_default_timezone_set('Asia/Tokyo');
endif;
?>

<dl>
  <archives/hp if ($maxitems == 0) echo '<dt>No items.&lt;/dt>';
      else
      foreach ( $rss_items as $item ) : ?>

  <dt>
    <archives/hp echo $item->get_feed()->get_title(); ?>
    
    
    <a href='<archives/hp echo $item->get_permalink(); ?>' target="_blank"><archives/hp echo $item->get_title(); ?></a>
    
  </dt>
  
  
  <dd>
    (<archives/hp echo $item->get_date("Y-n-j H:i:s"); ?>)
  </dd>
  
  
  <archives/hp endforeach; ?>
  
</dl>

<archives/hp include_once(ABSPATH . WPINC . '/feed.php');
$rss = fetch_feed(array(
'https://b.hatena.ne.jp/t/%E7%9D%A1%E7%9C%A0?sort=hot&threshold=3&mode=rss',
//RSSフィード1
));
if (!is_wp_error( $rss ) ) : 
    $rss->set\_cache\_duration(1800);


      
$rss->init();
      
$maxitems = $rss->get\_item\_quantity(3);
      
$rss\_items = $rss->get\_items(0, $maxitems);
      
date\_default\_timezone_set('Asia/Tokyo');
  
endif;
  
?>

<archives/hp if ($maxitems == 0) echo '

<dt>No items.</dt> 

';
      
else
      
foreach ( $rss_items as $item ) : ?>

<archives/hp echo $item->get\_feed()->get\_title(); ?>
  
<a href='<archives/hp echo $item->get\_permalink(); ?>' target="\_blank">

<archives/hp echo $item->get_title(); ?></a> 
:   (<archives/hp echo $item->get_date("Y-n-j H:i:s"); ?>)

<archives/hp endforeach; ?></dl> 

さらに、サムネイルつきで表示させてみる

今度は，取得したURLをサムネイル画像つきで表示してみる。

<archives/hp include_once(ABSPATH . WPINC . '/feed.php');
$rss = fetch_feed(array(
'https://b.hatena.ne.jp/t/%E7%9D%A1%E7%9C%A0?sort=hot&threshold=3&mode=rss'

));
if (!is_wp_error( $rss ) ) : 
    $rss->set_cache_duration(1800);
    $rss->init();
    $maxitems = $rss->get_item_quantity(20); 
    $rss_items = $rss->get_items(0, $maxitems); 
    date_default_timezone_set('Asia/Tokyo');
endif;
?>


<dl>
  <archives/hp if ($maxitems == 0) echo '<dt>No items.&lt;/dt>';
      else
      foreach ( $rss_items as $item ) : ?>
      
  
  <dt>
    <a href='<archives/hp echo $item->get_permalink(); ?>' target="_blank">
    <img class="alignleft" align="left" border="0" src="https://capture.heartrails.com/150x130/shadow?
<archives/hp echo $item->get_permalink(); ?>" alt="" width="150" height="130" /></a> 
    
    <a style="color:#0070C5;" href='<archives/hp echo $item->get_permalink(); ?>' target="_blank">
    <archives/hp echo $item->get_title(); ?></a> 
    
    
    
    <img border="0" src="https://b.hatena.ne.jp/entry/image/
<archives/hp echo $item->get_permalink(); ?>" alt="" style="" /> 
    
    <archives/hp echo mb_substr(strip_tags($item->get_description()), 0, 100); ?>
    ・・・
    
    <a href='<archives/hp echo $item->get_permalink(); ?>' target="_blank">続きを読む</a>
    (<archives/hp echo $item->get_date("Y-n-j H:i:s"); ?>)
    
    
    <br style="clear:both;" />
    
    
    <hr />
    
  </dt>
      
  
  <archives/hp endforeach; ?>
  
</dl>

<archives/hp include_once(ABSPATH . WPINC . '/feed.php');
$rss = fetch_feed(array(
'https://b.hatena.ne.jp/t/%E7%9D%A1%E7%9C%A0?sort=hot&threshold=3&mode=rss'

));
if (!is_wp_error( $rss ) ) : 
    $rss->set\_cache\_duration(1800);


      
$rss->init();
      
$maxitems = $rss->get\_item\_quantity(3);
      
$rss\_items = $rss->get\_items(0, $maxitems);
      
date\_default\_timezone_set('Asia/Tokyo');
  
endif;
  
?>

<archives/hp if ($maxitems == 0) echo '

<dt>No items.</dt> 

';
      
else
      
foreach ( $rss_items as $item ) : ?>

<a href='<archives/hp echo $item->get\_permalink(); ?>' target="\_blank">


  
<img class="alignleft" align="left" border="0" src="https://capture.heartrails.com/150x130/shadow? <archives/hp echo $item->get_permalink(); ?>" alt="" width="150" height="130"></a> </p> 

<a style="color:#0070C5;" href='<archives/hp echo $item->get\_permalink(); ?>' target="\_blank">


  
<archives/hp echo $item->get_title(); ?></a> 

<img border="0" src="https://b.hatena.ne.jp/entry/image/ <archives/hp echo $item->get_permalink(); ?>" alt="" style=""> 

<archives/hp echo mb_substr(strip_tags($item->get_description()), 0, 100); ?>


  
・・・<a href='<archives/hp echo $item->get\_permalink(); ?>' target="\_blank">続きを読む</a>


  
(<archives/hp echo $item->get_date("Y-n-j H:i:s"); ?>)


  
<br style="clear:both;" />

* * *

<archives/hp endforeach; ?></dl>

wordpressだとカンタンだぁ。