noteのつぶやきを取得してティッカーとしてWordPressに表示させる方法

function fetch_note_tweets() {
    $rss_url = 'https://note.com/777hirochanpon/rss'; // noteのRSSフィードURLに置き換える
    $rss = simplexml_load_file($rss_url);
    
    if (!$rss) return [];

    $tweets = [];
    $count = 0;
    foreach ($rss->channel->item as $item) {
        // RSSの内容からデータを抽出
        $tweets[] = (string) $item->title; // タイトルを取得
        $count++;
        // 直近3件だけを取得
        if ($count >= 3) {
            break; // 3件を取得したらループを終了
        }
    }
    return $tweets;
}

// JavaScriptに渡すJSONデータ
function add_note_tweets_script() {
    $tweets = fetch_note_tweets();
    wp_enqueue_script('note-tweet-ticker', get_template_directory_uri() . '/js/note-tweet-ticker.js', [], null, true);
    wp_localize_script('note-tweet-ticker', 'noteTweets', $tweets); // フロントエンドに渡す
}
add_action('wp_enqueue_scripts', 'add_note_tweets_script');

#noteTweetTicker {
    position: relative;
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    padding: 20px;
    background-color: #ffffff; /* 吹き出しの背景色 */
    border-radius: 10px; /* 吹き出しの丸み */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

#tickerText {
    font-size: 14px;
    color: #333333;
    margin: 0;
    text-align: center;
    opacity: 0; /* フェード時の初期状態 */
    transition: opacity 0.5s ease-in-out;
}

document.addEventListener("DOMContentLoaded", function () {
    const tweets = noteTweets; // PHPから渡されたnoteのつぶやきデータ
    if (!tweets || tweets.length === 0) return; // つぶやきがない場合は何もしない

    let currentIndex = 0;
    const tickerText = document.getElementById("tickerText");

    // ティッカー更新関数
    function updateTicker() {
        // 現在のつぶやきをフェードアウト
        tickerText.style.opacity = 0;

        setTimeout(() => {
            // 次のつぶやきに切り替え
            tickerText.textContent = tweets[currentIndex];
            tickerText.style.opacity = 1;

            // インデックスを更新
            currentIndex = (currentIndex + 1) % tweets.length;
        }, 500); // フェードアウトのタイミングに合わせて切り替え
    }

    // 初期表示
    tickerText.textContent = tweets[currentIndex];
    tickerText.style.opacity = 1;
    currentIndex++;

    // 定期的に更新 (3秒ごと)
    setInterval(updateTicker, 3000);
});

function note_ticker_shortcode() {
    return '<div id="noteTweetTicker"><div class="compactTweetBubble"><p id="tickerText"></p></div></div>';
}
add_shortcode('note_ticker', 'note_ticker_shortcode');

[[note_ticker]]