noteのRSSフィードを取得して表示する実装サンプル

WordPress上でnoteのRSSフィードを取得しページ上の任意の場所に表示するサンプルを作成してみました。

WordPressに限らず通常のHTMLサイトでも機能すると思いますのでよければ使ってみてください。

get_rss.php

date_default_timezone_set('Asia/Tokyo');
$url = "https://note.com/*****/m/*****/rss"; // noteのrssフィードURL
$max = 5;
if( $rss = simplexml_load_file( $url ) ){
	$cnt = 0;
	$output = '';
	/*
	* $item->title:タイトル
	* $item->link:リンク
	* strtotime( $item->pubDate ):更新日時のUNIX TIMESTAMP
	* $item->description:詳細
	*/
	foreach( $rss->channel->item as $item ){
		if( $cnt >= $max ) break;
		$date = date( 'Y年m月d', strtotime( $item->pubDate ) );
		$output .= '<a href="'. $item->link .'"><img src="' . $item->children('media',true)->thumbnail . '" width="300" height="" />' . $date . " " . $item->title . '</a><br>';
		$cnt++;
	}
	echo $output;
}

feed.html

<!DOCTYPE html>
<html lang="ja">
<body>

<script>
window.addEventListener('DOMContentLoaded', function() {
	var req = new XMLHttpRequest();
	req.onreadystatechange = function() {
		if( req.readyState == 4 && req.status == 200 ) {
			document.getElementById( "rss-note" ).innerHTML = req.responseText;
		}
	}
	req.open( "GET", "<?php echo get_template_directory_uri(); ?>/get_rss.php" );
	req.send();
})
</script>

<div id="rss-note"><!--ここに挿入されます--></div>

</body>
</html>

※<?php echo get_template_directory_uri(); ?>はWordPress上の記述となりますので、その他の場合はフルパスで記述するようにしてください。