Below, you’ll find a detailed guide on how to add the YouTube Embed, Playlist and Popup by WpDevArt Shortcode to your WordPress website, including its parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the YouTube Embed, Playlist and Popup by WpDevArt Plugin shortcode not to show or not to work correctly.
Before starting, here is an overview of the YouTube Embed, Playlist and Popup by WpDevArt Plugin and the shortcodes it provides:
"YouTube Embed, Playlist and Popup by WpDevArt is a versatile plugin that allows seamless embedding of YouTube videos, creation of playlists and pop-up video players on your WordPress site."
- [wpdevart_youtube]
[wpdevart_youtube] Shortcode
The WPDevArt YouTube Embed shortcode allows embedding a YouTube video into a WordPress site. It offers customization options like setting video dimensions, alignment, autoplay, theme, loop, fullscreen mode, title display, YouTube icon, annotations, progress bar color, initial volume, and keyboard disable.
Shortcode: [wpdevart_youtube]
Parameters
Here is a list of all possible wpdevart_youtube shortcode parameters and attributes:
youtube_embed_width– Sets the width of the YouTube video player.youtube_embed_height– Sets the height of the YouTube video player.youtube_embed_align– Determines the alignment of the video player.youtube_embed_caption– Allows for a caption to be added to the video.youtube_embed_autoplay– Controls whether the video plays automatically.youtube_embed_theme– Sets the theme of the video player.youtube_embed_loop_video– Controls whether the video loops continuously.youtube_embed_enable_fullscreen– Allows the video to be played in fullscreen.youtube_embed_show_title– Controls whether the video’s title is displayed.youtube_embed_show_youtube_icon– Controls whether the YouTube icon is displayed.youtube_embed_show_annotations– Controls whether video annotations are displayed.youtube_embed_show_progress_bar_color– Sets the color of the progress bar.youtube_embed_autohide_parameters– Hides the video parameters when not in use.youtube_embed_set_initial_volume– Sets the initial volume level of the video.youtube_embed_initial_volume– The actual value of the initial volume level.youtube_embed_disable_keyboard– Controls whether keyboard controls are disabled.
Examples and Usage
Basic example – Embed a YouTube video using the shortcode with the video id as the content.
[wpdevart_youtube]dQw4w9WgXcQ[/wpdevart_youtube]Advanced examples
Embed a YouTube video with customized width and height. The video will autoplay and the theme will be dark.
[wpdevart_youtube width="800" height="450" autoplay="1" theme="dark"]dQw4w9WgXcQ[/wpdevart_youtube]Embed a YouTube video with additional parameters. The video will loop, show the video title, enable fullscreen, and set the initial volume to 50.
[wpdevart_youtube loop_video="1" show_title="1" enable_fullscreen="1" set_initial_volume="1" initial_volume="50"]dQw4w9WgXcQ[/wpdevart_youtube]Embed a YouTube video with all parameters set to their defaults. This will create a video player with the standard YouTube settings.
[wpdevart_youtube youtube_embed_width="640" youtube_embed_height="360" youtube_embed_align="left" youtube_embed_caption="" youtube_embed_autoplay="0" youtube_embed_theme="dark" youtube_embed_loop_video="0" youtube_embed_enable_fullscreen="1" youtube_embed_show_title="1" youtube_embed_show_youtube_icon="1" youtube_embed_show_annotations="0" youtube_embed_show_progress_bar_color="red" youtube_embed_autohide_parameters="1" youtube_embed_set_initial_volume="" youtube_embed_initial_volume="90" youtube_embed_disable_keyboard="0"]dQw4w9WgXcQ[/wpdevart_youtube]PHP Function Code
In case you have difficulties debugging what causing issues with [wpdevart_youtube] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('wpdevart_youtube', array($this, 'shortcode'));Shortcode PHP function:
function shortcode($atts, $content) {
if (!$content) {
return '<span style="color:red; font-size:16px">Set Vidio id</span>';
}
$voloutput = '';
$initial_values = array(
"youtube_embed_width" => "640",
"youtube_embed_height" => "360",
"youtube_embed_align" => "left",
"youtube_embed_caption" => "",
"youtube_embed_autoplay" => "0",
"youtube_embed_theme" => "dark",
"youtube_embed_loop_video" => "0",
"youtube_embed_enable_fullscreen" => "1",
"youtube_embed_show_title" => "1",
"youtube_embed_show_youtube_icon" => "1",
"youtube_embed_show_annotations" => "0",
"youtube_embed_show_progress_bar_color" => "red",
"youtube_embed_autohide_parameters" => "1",
"youtube_embed_set_initial_volume" => "",
"youtube_embed_initial_volume" => "90",
"youtube_embed_disable_keyboard" => "0"
);
if (!is_array($atts)) {
$atts = array();
}
foreach ($initial_values as $key => $value) {
if (!(get_option($key, 12365498798465132148947984651) == 12365498798465132148947984651)) {
$coming_key = str_replace('youtube_embed_', '', $key);
if (!isset($atts[$coming_key]) || $atts[$coming_key] == "")
$atts[$coming_key] = get_option($key);
} else {
$coming_key = str_replace('youtube_embed_', '', $key);
$$key = $value;
if (!isset($atts[$coming_key]) || $atts[$coming_key] == "")
$atts[$coming_key] = $value;
}
}
$allowfullScreen = '';
$voloutput = '';
if ($atts['set_initial_volume'] == 'true' || $atts['set_initial_volume'] == '1')
$voloutput = ' data-volume="' . intval($atts['initial_volume']) . '" ';
if ($atts['enable_fullscreen'] == '1')
$allowfullScreen = ' allowFullScreen="true"';
$parametrs = array(
'autoplay' => intval($atts['autoplay']),
'theme' => 'dark',
'loop' => intval($atts['loop_video']),
'fs' => intval($atts['enable_fullscreen']),
'showinfo' => intval($atts['show_title']),
'modestbranding' => $atts['show_youtube_icon'] ? '0' : '1',
'iv_load_policy' => $atts['show_annotations'] ? '1' : '3',
'color' => ($atts['show_progress_bar_color']=='white')?'white':'red',
'autohide' => intval($atts['autohide_parameters']),
'disablekb' => intval($atts['disable_keyboard']),
'enablejsapi' => '1',
'version' => '3',
);
$link_youtube = 'https://www.youtube.com/embed/' . $content;
$link_youtube = add_query_arg($parametrs, $link_youtube);
$code = '<div style="text-algn:' . $this->correct_align($atts['align']) . '"><span style="display:inline-block;text-align:center;"><iframe allow="autoplay" class="youtube_embed_iframe" ' . $voloutput . $allowfullScreen . ' style="width:' . intval($atts['width']) . 'px; height:' . intval($atts['height']) . 'px" src="' . $link_youtube . '"></iframe></span></div>';
return $code;
}
Code file location:
youtube-video-player/youtube-video-player/front_end/front_end.phpConclusion
Now that you’ve learned how to embed the YouTube Embed, Playlist and Popup by WpDevArt Plugin shortcode, 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