Getting Started

Izubizu Radio & Audio Player is a responsive and highly customizable WordPress player for live radio and standard audio playback.

It supports source types audio, hls, shoutcast, and icecast using the same shortcode/API flow.

The plugin is built with modern JavaScript and includes real-time visualizer rendering, metadata-driven info updates, artwork handling, sharing tools, and keyboard support.

Recommended workflow: configure a preset in Presets Manager, then generate/embed shortcode for pages, posts, custom posts, or WooCommerce product content.

Installation

After purchasing the plugin, use the installable WordPress plugin ZIP from your download package.

Installation steps

1. In your WordPress Admin Dashboard, go to Plugins > Add New.
2. Upload the plugin ZIP file that you downloaded.
3. Click Install Now.
4. If successful, click Activate Plugin to activate it, or Return to Plugin Installer.

Update

Replace the plugin with the new version. Existing preset settings are preserved. If you use cache/minification plugins, clear cache to ensure latest files are loaded.

Usage

The plugin is built around Presets Manager and Shortcode Generator. Configure a preset once, then reuse it via shortcode with different source URLs and metadata values.

Presets

First step is to select the preset that you want to use. Presets control layout, colors, playback defaults, info styling, artwork behavior, share options, tooltip styles, and visualizer options.

You can see live examples here: IRAP demos. After changing options, click Update Preset.

Shortcode

After preset setup, use shortcode in page/post/custom post content.

Basic example:

[fwdirap preset_name="Preset 1" source="https://example.com/stream.mp3" source-type="audio"]

With optional metadata and artwork:

[fwdirap preset_name="Preset 1" source="https://example.com/live.m3u8" source-type="hls" title="My Radio" info="Now playing" artwork-src="https://example.com/cover.jpg"]

Supported attributes: preset_name, source, source-type (audio | hls | shoutcast | icecast), optional title, info, artwork-src.

API - Application Programming Interface

This section is for developers that want to use the plugin API. The following lists represent public API methods and event listeners.

You can access player instances by order with the fwdirap name and index, for example fwdirap0, fwdirap1, etc.

<script type="text/javascript">
// API.
let fwdirapAPI = setInterval(() =>{
	if(window['fwdirap0']){
		console.log('IRAP API ready')
		clearInterval(fwdirapAPI);

		// Register ERROR event.
		fwdirap0.addEventListener(FWDIRAP.ERROR, onError);
	}
}, 100);


// Listen for the ERROR event.
function onError(e){
	console.log(e)
}
</script>

Methods

Methods are functions that can be called via the API to execute certain actions.

JavaScript methods look like fwdirap0.methodName( /* arguments */ ). For multiple players, use instance names in order: fwdirap0, fwdirap1, fwdirap2, etc.

setSource

.setSource(source, type):Void

Loads a new source and updates the runtime source mode.

getSource

.getSource():String

Returns the current source URL.

play

.play():Void

Starts playback.

pause

.pause():Void

Pauses playback.

stop

.stop(resetRadio):Void

Stops playback and resets internal playback state.

startToScrub

.startToScrub():Void

Signals that manual scrubbing has started.

stopToScrub

.stopToScrub():Void

Signals that manual scrubbing has ended.

scrub

.scrub(percent):Void

Seeks using a normalized value between 0 and 1.

scrubbAtTime

.scrubbAtTime(duration):Void

Seeks to an absolute time value.

setVolume

.setVolume(volume, updateController):Void

Sets the player volume.

getVolume

.getVolume():Number

Returns the current volume.

setPlaybackRate

.setPlaybackRate(rate):Void

Sets the playback rate.

getPlaybackRate

.getPlaybackRate():Number

Returns the active playback rate.

setInfo

.setInfo(radioName, info):Void

Updates the displayed radio name and info text.

getInfo

.getInfo():String

Returns the current info text.

setArtworksource

.setArtworksource(source):Void

Updates the artwork image source.

getArtworksource

.getArtworksource():String

Returns the current artwork source.

getCurrentTime

.getCurrentTime():Number

Returns the current playback time.

getDuration

.getDuration():Number

Returns the media duration.

startVisualizer

.startVisualizer():Void

Starts or reinitializes the visualizer animation.

pauseVisualizer

.pauseVisualizer():Void

Pauses the visualizer animation.

destroy

.destroy():Void

Destroy the player instance and clean related runtime objects/listeners.

Events

Izubizu Radio & Audio Player events are used via addEventListener on each instance.

The events must be registered when the API is ready.

FWDIRAP.START

Dispatched when playback starts and the player is ready to report progress.

FWDIRAP.PLAY

Dispatched when playback enters the playing state.

FWDIRAP.PAUSE

Dispatched when playback is paused.

FWDIRAP.STOP

Dispatched when playback is stopped.

FWDIRAP.ERROR

Dispatched when playback or stream resolution fails; payload includes error.

FWDIRAP.PLAY_COMPLETE

Dispatched when playback reaches the end.

FWDIRAP.UPDATE

Dispatched during progress updates; payload includes percent.

FWDIRAP.UPDATE_TIME

Dispatched during time updates; payload includes curTime and totalTime.

FWDIRAP.UPDATE_PLAYBACKRATE

Dispatched after playback rate changes; payload includes playbackRate.

FWDIRAP.UPDATE_VOLUME

Dispatched after volume changes; payload includes volume.

Notes

Current behavior notes: info visibility is always on, title/info come from shortcode values, artwork falls back to preset generic cover image, and runtime artwork is replaced only when a valid new image is found.

For support and customizations please write to me directly at this email.

WordPress Documentation

Documentation for the WordPress version, API and overall implementation.