Below, you’ll find a detailed guide on how to add the Compact WP Audio Player Shortcodes to your WordPress website, including their parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the Compact WP Audio Player Plugin shortcodes not to show or not to work correctly.
Before starting, here is an overview of the Compact WP Audio Player Plugin and the shortcodes it provides:
"Compact WP Audio Player is a lightweight, user-friendly WordPress plugin. It simplifies the integration of audio files into your posts and pages, ensuring seamless audio playback."
- [sc_embed_player]
- [sc_embed_player_template1]
Compact WP Audio Player [sc_embed_player] Shortcode
The Compact WP Audio Player shortcode is a tool that embeds an audio player into your WordPress site. This shortcode accepts parameters like ‘fileurl’, ‘autoplay’, ‘volume’, ‘class’, and ‘loops’. It generates a unique ID for each instance, ensuring no conflicts occur. If the ‘autoplay’ parameter is set, the audio file starts playing automatically upon page load. The ‘volume’ parameter controls the audio level, and ‘loops’ allow the audio to repeat. The ‘class’ parameter is for CSS customization. Remember to provide a valid mp3 file URL in the ‘fileurl’ parameter; otherwise, an error message will display.
Shortcode: [sc_embed_player]
Parameters
Here is a list of all possible sc_embed_player shortcode parameters and attributes:
fileurl– Specifies the URL of the mp3 file to be played.autoplay– Automatically starts playing the audio file when the page loads.volume– Determines the audio volume level. Default is ’80’.class– Defines the CSS class for the audio player container.loops– Determines if the audio file should loop continuously. Default is ‘false’.
Examples and Usage
Basic example – A simple usage of the compact-wp-audio-player plugin shortcode is by specifying the ‘fileurl’ parameter. This parameter is used to define the URL of the mp3 file you want to play.
[sc_embed_player fileurl="http://example.com/path-to-your-audio-file.mp3" /]Advanced examples
Using the shortcode with multiple parameters allows for more control over the audio player’s behavior. In the following example, we’re specifying the ‘fileurl’, ‘autoplay’, ‘volume’, ‘class’, and ‘loops’ parameters.
[sc_embed_player fileurl="http://example.com/path-to-your-audio-file.mp3" autoplay="true" volume="70" class="my_custom_class" loops="true" /]The ‘autoplay’ parameter is used to determine whether the audio should start playing automatically when the page loads. ‘volume’ is used to set the initial volume level of the audio player. ‘class’ allows you to add a custom CSS class to the audio player’s container for styling purposes. Finally, ‘loops’ determines whether the audio file should loop continuously or stop after playing once.
Another advanced example involves using the shortcode to play an audio file with a custom volume and class. The audio will not autoplay and will not loop.
[sc_embed_player fileurl="http://example.com/path-to-your-audio-file.mp3" volume="50" class="another_custom_class" /]PHP Function Code
In case you have difficulties debugging what causing issues with [sc_embed_player] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('sc_embed_player', 'sc_embed_player_handler');Shortcode PHP function:
function sc_embed_player_handler($atts, $content = null) {
extract(shortcode_atts(array(
'fileurl' => '',
'autoplay' => '',
'volume' => '',
'class' => '',
'loops' => '',
), $atts));
if (empty($fileurl)) {
return '<div style="color:red;font-weight:bold;">Compact Audio Player Error! You must enter the mp3 file URL via the "fileurl" parameter in this shortcode. Please check the documentation and correct the mistake.</div>';
}
if (empty($volume)) {
$volume = '80';
}
if (empty($class)) {
$class = "sc_player_container1";
}//Set default container class
if (empty($loops)) {
$loops = "false";
}
$ids = uniqid('', true);//uniqid();
$player_cont = '<div class="' . esc_attr($class) . '">';
$player_cont .= '<input type="button" id="btnplay_' . $ids . '" class="myButton_play" onClick="play_mp3(\'play\',\'' . $ids . '\',\'' . esc_url($fileurl) . '\',\'' . esc_attr($volume) . '\',\'' . esc_attr($loops) . '\');show_hide(\'play\',\'' . $ids . '\');" />';
$player_cont .= '<input type="button" id="btnstop_' . $ids . '" style="display:none" class="myButton_stop" onClick="play_mp3(\'stop\',\'' . $ids . '\',\'\',\'' . esc_attr($volume) . '\',\'' . esc_attr($loops) . '\');show_hide(\'stop\',\'' . $ids . '\');" />';
$player_cont .= '<div id="sm2-container"><!-- flash movie ends up here --></div>';
$player_cont .= '</div>';
if (!empty($autoplay)) {
$path_to_swf = SC_AUDIO_BASE_URL . 'swf/soundmanager2.swf';
$player_cont .= <<<EOT
<script type="text/javascript" charset="utf-8">
soundManager.setup({
url: '$path_to_swf',
onready: function() {
var mySound = soundManager.createSound({
id: 'btnplay_$ids',
volume: '$volume',
url: '$fileurl'
});
var auto_loop = '$loops';
mySound.play({
onfinish: function() {
if(auto_loop == 'true'){
loopSound('btnplay_$ids');
}
else{
document.getElementById('btnplay_$ids').style.display = 'inline';
document.getElementById('btnstop_$ids').style.display = 'none';
}
}
});
document.getElementById('btnplay_$ids').style.display = 'none';
document.getElementById('btnstop_$ids').style.display = 'inline';
},
ontimeout: function() {
// SM2 could not start. Missing SWF? Flash blocked? Show an error.
alert('Error! Audio player failed to load.');
}
});
</script>
EOT;
}//End autopay code
return $player_cont;
}
Code file location:
compact-wp-audio-player/compact-wp-audio-player/shortcodes-functions.phpCompact WP Audio Player [sc_embed_player_template1] Shortcode
The Compact WP Audio Player shortcode is designed to embed an audio player in your WordPress posts. It allows you to customize various parameters such as file URL, autoplay, volume, class, and loops. This shortcode extracts the attributes and checks if the ‘fileurl’ is empty. If empty, it returns an error asking for the mp3 file URL. It sets default values for ‘class’, ‘autoplay’, and ‘loops’ if they are not specified. The shortcode then creates an audio player with the specified parameters and returns it in a div container.
Shortcode: [sc_embed_player_template1]
Parameters
Here is a list of all possible sc_embed_player_template1 shortcode parameters and attributes:
fileurl– the URL where the mp3 file is locatedautoplay– if set, the audio will play automaticallyvolume– to control the audio volume, but not used in this functionclass– to apply a custom CSS class to the playerloops– if set, the audio will loop continuously
Examples and Usage
Basic example – Compact WP Audio Player plugin allows you to embed an audio file simply by using a shortcode with the file URL as a parameter.
[sc_embed_player_template1 fileurl="http://example.com/wp-content/uploads/my-audio-file.mp3" /]Advanced examples
Embedding an audio file with autoplay enabled. This means the audio will start playing as soon as the page loads.
[sc_embed_player_template1 fileurl="http://example.com/wp-content/uploads/my-audio-file.mp3" autoplay="on" /]Embedding an audio file with a custom CSS class. This allows you to style the audio player according to your preferences.
[sc_embed_player_template1 fileurl="http://example.com/wp-content/uploads/my-audio-file.mp3" class="my-custom-class" /]Embedding an audio file that will loop indefinitely. This means the audio will start over again every time it finishes playing.
[sc_embed_player_template1 fileurl="http://example.com/wp-content/uploads/my-audio-file.mp3" loops="on" /]Embedding an audio file with autoplay enabled, a custom CSS class, and looping. This example combines multiple parameters for the most control over how the audio player behaves and appears.
[sc_embed_player_template1 fileurl="http://example.com/wp-content/uploads/my-audio-file.mp3" autoplay="on" class="my-custom-class" loops="on" /]PHP Function Code
In case you have difficulties debugging what causing issues with [sc_embed_player_template1] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('sc_embed_player_template1', 'sc_embed_player_templater1_handler');Shortcode PHP function:
function sc_embed_player_templater1_handler($atts){
extract(shortcode_atts(array(
'fileurl' => '',
'autoplay' => '',
'volume' => '',
'class' => '',
'loops' => '',
), $atts));
if (empty($fileurl)) {
return '<div style="color:red;font-weight:bold;">Compact Audio Player Error! You must enter the mp3 file URL via the "fileurl" parameter in this shortcode. Please check the documentation and correct the mistake.</div>';
}
if (empty($class)) {
$class = "sc_fancy_player_container";//Set default container class
}
if (empty($autoplay)) {//Set autoplay value
$autoplay = "";
}else{
$autoplay = "on";
}
if (empty($loops)) {//Set the loops value
$loops = "";
}else{
$loops = "on";
}
$args = array(
'src' => $fileurl,
'loop' => $loops,
'autoplay' => $autoplay,
'preload' => 'none'
);
$player_container = "";
$player_container .= '<div class="'.esc_attr($class).'">';
$player_container .= wp_audio_shortcode($args);
$player_container .= '</div>';
return $player_container;
}
Code file location:
compact-wp-audio-player/compact-wp-audio-player/shortcodes-functions.phpConclusion
Now that you’ve learned how to embed the Compact WP Audio Player Plugin shortcodes, understood the parameters, and seen code examples, it’s easy to use and debug any issue that might cause it to ‘not work’. If you still have difficulties with it, don’t hesitate to leave a comment below.
Leave a Reply