Why won't the player load when the cache is enabled? I don't want to exclude the entire sales page from the cache. How can I exclude just the player?

Hi. I have just seen how the Substack and YouTube Music apps allow users to switch between streaming a video version or an audio-only version of the same piece of content within the same player.

It would be very useful if FluentPlayer could support an Audio Only playback mode for video sources where the hosting provider makes an audio-only rendition available.

For example, when a Vimeo, Mux, Bunny, Gumlet or other supported video is added to FluentPlayer, the player could detect whether an audio-only stream is available and allow the viewer to switch between:

📺 Video | 🎧 Audio

This would be similar to the Video / Audio experience offered by platforms such as Substack and YouTube Music for podcast content.

In Audio mode, FluentPlayer could replace the moving video with the video’s poster image, thumbnail or featured artwork while retaining the normal player interface and its same size on the webpage, and retaining the players timeline, chapters, playback-speed controls and captions options.

Where a supported video provider exposes a separate audio rendition or track, FluentPlayer could switch to audio-only streaming while preserving the current playback position and player state, and stop loading the video rendition while Audio mode is active.

This would reduce mobile data usage and make longer videos, teaching content and podcast-style material much more practical to listen to while travelling, walking or using a mobile device.

The same FluentPlayer media item could therefore offer two ways of consuming the same content without requiring the site owner to export, upload and maintain a separate audio file.

FluentPlayer has recently added Vimeo quality selection, so conceptually Audio Only could become another available playback option when the source provider supports it.

For providers that do not expose or permit audio-only playback, the Video / Audio option could simply remain unavailable.

This could be a FluentPlayer Pro feature, that helps differentiate it from the free version. 

The attached images are full screen mobile app versions of a player. That could be an option, from a playlist or as a modal display option, however as I see video as the primary delivery mode within a webpage, the overall FluentPlayer could remain 16:9, with things like inline chapters underneath, as it is currently, also in mobile.

This is beneficial especially if the FluentPlayer is in a FluentCommunity course lesson page, so any other items on the lesson page can still be seen or easily scrolled to, for example a lesson description, and other potential downloadable items in the lesson page.

When a user switches between video and audio-only versions the size and position of the FluentPlayer remains the same on the webpage. The only real difference is in audio-only mode, the streaming video is replaced by a still image. All the other aspects of the player would remain the same.

I would like to be able (via URL) to use Zoom recordings and Clips in FluentPlayer

Can anyone explain to me how the FluentPlayer works for audio? I don't get it. In the docs they say "go to FluentPlayer, then "add media" and then set the file type to "audio". But there is no such option. I want to store my audio tracks on bunny.net. But when I upload a mp3 in bunny and then add the FluentPlayer to a course lesson and select bunnyCDN as source it cannot retrieve the audio from bunny.net. It doesn't find the file. When I paste the file URL into the Player it does get the file, but not the file name. So I uploaded my file now to my wordpress library - what I definitey don't want to do in the future. Thanks for all help.

Because of my error, the file had the wrong name, and the slug was taken from the wrong name of the file... So I corrected de the name of video/media, BUT I couldn't edit the slug (I know I can make the change by DB, BUT, it's preferable having possibilty to edit the slug on FlluentPlayer).

I know you use the prefix "fluent-player-BUT-I-WANT-TO-EDIT-THIS-PART-OF-SLUG"

Thanks!

P.S. I hope I explained well... LOL

I have some videos in unusual aspect ratios, very wide.

Fluentplayer adds letterboxing, black bars above and below the video to make it conform to a standard aspect ratio.

To show you what I mean. Here is a screenshot that shows the video playing as I would like it to
(embedded using Gumlet embed code)

And below that, the same video as it appears when in a fluent player (Ambient preset).

I would like to remove those black bars in FluentPlayer. Is that possible?

How can I keep the red button and black control panel for my video player, but have my audio players a different colour and with different button colour. I have checked in branding settings, but does not seem possible
How can I make the audio player different colours to video player?

I love the timestamp links, but hate to add every link by hand. I've created a snippet that automatically creates a timestamp link list for all available chapters

/**

• FluentPlayer — Auto Chapter Links
• Genereert automatisch [fluentplayer_timestamp] links uit de chapters van een media.
• Gebruik: [fluentplayer_auto_chapters id="129"]
  */
  defined( 'ABSPATH' ) || exit;

add_action( 'init', function () {
if ( ! class_exists( '\FluentPlayer\App\Models\Media' ) ) {
return;
}

add_shortcode( 'fluentplayer_auto_chapters', function ( $atts ) {
    $atts = shortcode_atts( [
        'id'       => '',
        'media_id' => '',
    ], $atts );

    $mediaId = absint( $atts['id'] ?: $atts['media_id'] );
    if ( ! $mediaId ) {
        return '';
    }

    $media = \FluentPlayer\App\Models\Media::findVisible( $mediaId );
    if ( ! $media ) {
        return '';
    }

    $chapters = (array) ( $media->settings['chapters'] ?? [] );
    if ( empty( $chapters ) ) {
        return '';
    }

    usort( $chapters, fn( $a, $b ) => ( $a['startTime'] ?? 0 ) <=> ( $b['startTime'] ?? 0 ) );

    $items = '';
    foreach ( $chapters as $chapter ) {
        $title = trim( (string) ( $chapter['title'] ?? '' ) );
        if ( $title === '' ) {
            continue;
        }
        $timeLabel = fp_auto_chapters_format_time( (float) ( $chapter['startTime'] ?? 0 ) );
        $items    .= sprintf(
            '<li class="fp-auto-chapter-item"><fluentplayer-timestamp time=\'%s\' media_id=\'%d\'>%s</fluentplayer-timestamp></li>',
            esc_attr( $timeLabel ),
            $mediaId,
            wp_kses_post( $title )
        );
    }

    return $items ? '<ul class="fp-auto-chapters-list">' . $items . '</ul>' : '';
} );

} );

if ( ! function_exists( 'fp_auto_chapters_format_time' ) ) {
function fp_auto_chapters_format_time( $seconds ) {
$seconds = max( 0, (int) round( $seconds ) );
$h = (int) floor( $seconds / 3600 );
$m = (int) floor( ( $seconds % 3600 ) / 60 );
$s = $seconds % 60;
return $h > 0 ? sprintf( '%d:%02d:%02d', $h, $m, $s ) : sprintf( '%d:%02d', $m, $s );
}
}

Hi Support,

I'm using the FluentCommunity course module and have an audio lesson using the FluentPlayer. On mobile, the player extends beyond the screen width on the right side, causing horizontal overflow.

Is this a general bug, or could you please let me know how I can fix it?

Thank you!

It looks like I can not switch this on. There is no save button, and when I leave this tab, switch is off again.
Is this core or pro functionality?