noteのRSSフィードを取得して表示する実装サンプル
たーさん最終更新日時 : 2026.08.26
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>※はWordPress上の記述となりますので、その他の場合はフルパスで記述するようにしてください。
投稿者プロフィール
- 代表者
-
東海大学工学部を卒業後、東芝情報システム株式会社（旧グループ会社含む）に入社。半導体（SRAM）の開発チームにて、Unix環境でのPerlを用いた業務自動化プログラムの開発など、エンジニアとしての確かな基礎と緻密な論理的思考力を培う。
その後、東証上場企業である株式会社ザッパラスへ。Web・モバイルの最前線で、数多くのユーザーに愛されるコンテンツ制作業務に従事。ここで「ユーザー目線に立った魅力的なWebコンテンツの企画・制作ノウハウ」を深く学ぶ。
開発・システム側から見た「堅牢なロジック」と、制作・ユーザー側から見た「伝わるコンテンツ」の双方を実務で経験した強みを活かし、フリーランスとして独立。
現在は、ウイングアーク1st株式会社の「データのじかん」運営チームに参画するなど、大手・中小企業のWeb運営・開発パートナーとして活動。完全在宅でありながら、固定IPの完備や厳格なセキュリティポリシーの遵守を徹底し、企業のインフラや本番環境を安全に支える「チームの一員」として高い信頼を得ています。
見た目の美しさはもちろんのこと、内部の構造やWordPressのカスタマイズ、運用・セキュリティまでを見据えた、技術的バックボーンのある高品質なWebサイト・システム制作をワンストップでご提供しています。
