# Previous Song - Random Song - Next Song Buttons

**URL:** <https://forums.realmacsoftware.com/t/previous-song-random-song-next-song-buttons/52778>\
**Category:** Elements CMS\
**Created:** [November 25, 2025, 5:54pm UTC](https://forums.realmacsoftware.com/t/previous-song-random-song-next-song-buttons/52778 "2025-11-25T17:54:12Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![MichaelDroste](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/michaeldroste/32/37212_2.png) [@MichaelDroste](https://forums.realmacsoftware.com/u/MichaelDroste)\
**Post date:** [November 25, 2025, 5:54pm UTC](https://forums.realmacsoftware.com/t/previous-song-random-song-next-song-buttons/52778/1 "2025-11-25T17:54:12Z")

</div>

Previous Song - Random Song - Next Song Buttons

 ![Screenshot 2025-11-25 at 11.49.31 AM](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/7/e/7efe67278176bebaddb0faf37d9754fce29650fb.png)

How can I program this?

{{item.number -1}} {{item.number random1-365}} {{item.number +1}} ???

---

<div class="post-metadata">

**Author:** ![MichaelDroste](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/michaeldroste/32/37212_2.png) [@MichaelDroste](https://forums.realmacsoftware.com/u/MichaelDroste)\
**Post date:** [November 26, 2025, 12:49am UTC](https://forums.realmacsoftware.com/t/previous-song-random-song-next-song-buttons/52778/2 "2025-11-26T00:49:56Z")

</div>

Trying to guess here:  
Trying Variations on a theme 🙂

 ![Screenshot 2025-11-25 at 6.47.21 PM](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/b/5/b5f5b7e85050cb31a2d9f7e4543a1489b959c8e6.png)  
 ![Screenshot 2025-11-25 at 6.47.39 PM](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/c/4/c4a3a24d07c4e86338551c111e197a0179fd68dd.png)  
 ![Screenshot 2025-11-25 at 6.47.55 PM](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/9/d/9d1c9450a48a33accf5eef6bffca5ed786919c61.png)

---

<div class="post-metadata">

**Author:** ![MichaelDroste](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/michaeldroste/32/37212_2.png) [@MichaelDroste](https://forums.realmacsoftware.com/u/MichaelDroste)\
**Post date:** [November 26, 2025, 5:16am UTC](https://forums.realmacsoftware.com/t/previous-song-random-song-next-song-buttons/52778/3 "2025-11-26T05:16:09Z")

</div>

Elements Bot created this will try tomorrow…

```auto

Button Code

<php>
// Assuming $cms is your CMS instance
$randomIndex = array_rand($cms->items());
$randomSong = $cms->items()[$randomIndex];

// This adds Tailwind CSS classes for styling
echo '<a href="' . $randomSong->url() . '" class="bg-blue-500 text-white p-2 rounded">Random Song: ' . htmlentities($randomSong->title()) . '</a>';
</php>

<php>
// Assuming $cms is your CMS instance and $currentSong is the current song object
$currentSongIndex = array_search($currentSong, $cms->items());

if ($currentSongIndex !== false && $currentSongIndex > 0) {
    $previousSong = $cms->items()[$currentSongIndex - 1];
    
    // This adds Tailwind CSS classes for styling
    echo '<a href="' . $previousSong->url() . '" class="bg-blue-500 text-white p-2 rounded">Previous Song: ' . htmlentities($previousSong->title()) . '</a>';
}
</php>

<php>
// Assuming $cms is your CMS instance and $currentSong is the current song object
$currentSongIndex = array_search($currentSong, $cms->items());

if ($currentSongIndex !== false && $currentSongIndex < count($cms->items()) - 1) {
    $nextSong = $cms->items()[$currentSongIndex + 1];
    
    // This adds Tailwind CSS classes for styling
    echo '<a href="' . $nextSong->url() . '" class="bg-blue-500 text-white p-2 rounded">Next Song: ' . htmlentities($nextSong->title()) . '</a>';
}
</php>

```

---

<div class="post-metadata">

**Author:** ![ben](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/ben/32/28488_2.png) [@ben](https://forums.realmacsoftware.com/u/ben)\
**Post date:** [November 26, 2025, 7:49am UTC](https://forums.realmacsoftware.com/t/previous-song-random-song-next-song-buttons/52778/4 "2025-11-26T07:49:37Z")

</div>

At the moment this isn’t possible. We’d need to extend the CMS Item with additional properties and/or introduce new components to handle this kind of navigation, similar to how Related Items works.

---

<div class="post-metadata">

**Author:** ![MichaelDroste](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/michaeldroste/32/37212_2.png) [@MichaelDroste](https://forums.realmacsoftware.com/u/MichaelDroste)\
**Post date:** [November 26, 2025, 9:30am UTC](https://forums.realmacsoftware.com/t/previous-song-random-song-next-song-buttons/52778/5 "2025-11-26T09:30:01Z")

</div>

Thanx for responding! I really appreciate it …

I’m trying to solve the problems as best as I can…

Ok - will wait…