Below, you’ll find a detailed guide on how to add the Video PopUp 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 Video PopUp Plugin shortcode not to show or not to work correctly.
Before starting, here is an overview of the Video PopUp Plugin and the shortcodes it provides:
"Video PopUp is a dynamic WordPress plugin that allows you to easily add stylish pop-up video content to your site. Enhance user experience with engaging visuals with this versatile tool."
- [video_popup]
Video PopUp [video_popup] Shortcode
The ‘video_popup’ shortcode from the Video Popup plugin allows you to embed a video popup on your WordPress site. It provides various attributes for customization. The shortcode accepts parameters like ‘url’ for the video link, ‘text’ for the anchor text, ‘auto’ for autoplay settings, ‘p’ to wrap the video in a paragraph, and many more. It also supports Soundcloud URLs and offers control over video attributes like width, height, title, overlay color, and more. This shortcode is highly versatile, making video embedding a breeze.
Shortcode: [video_popup]
Parameters
Here is a list of all possible video_popup shortcode parameters and attributes:
url– is the web address of the video.text– is the link text for the video.auto– controls whether the video plays automatically.p– wraps the video link in a paragraph tag.n– adds a nofollow attribute to the video link.rel– specifies the relationship between the current document and the linked document.wrap– controls whether the video link is wrapped.rv– adds a class to the video link.w– sets the width of the video.h– sets the height of the video.title– sets the title of the video link.co– sets the overlay color of the video.dc– controls the display of the video controls.di– controls the display of the video information.iv– controls the display of the video interactive view.img– sets the image source of the video link.
Examples and Usage
Basic example – A simple usage of the video popup shortcode with the URL parameter to display a video popup.
[video_popup url="https://www.youtube.com/watch?v=dQw4w9WgXcQ" /]Advanced examples
Using the shortcode to display a video popup with custom text for the link, disabling autoplay, and wrapping the video in a paragraph tag.
[video_popup url="https://www.youtube.com/watch?v=dQw4w9WgXcQ" text="Watch this video" auto="no" p="1" /]Using the shortcode to display a video popup with a custom image as the link, setting a custom width and height for the video, and disabling related videos.
[video_popup url="https://www.youtube.com/watch?v=dQw4w9WgXcQ" img="https://www.example.com/image.jpg" w="800" h="600" rv="1" /]Using the shortcode to display a video popup with a custom overlay color, disabling video information, and disabling video controls.
[video_popup url="https://www.youtube.com/watch?v=dQw4w9WgXcQ" co="#000000" di="1" dc="1" /]PHP Function Code
In case you have difficulties debugging what causing issues with [video_popup] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('video_popup', 'alobaidi_video_popup_shortcode');Shortcode PHP function:
function alobaidi_video_popup_shortcode($atts){
if( !empty($atts["url"]) ){
$url = esc_url($atts["url"]);
}else{
$url = null;
}
if( !empty($atts["text"]) ){
$text = $atts["text"];
}else{
if( !empty($atts["url"]) ){
$text = esc_url($atts["url"]);
}else{
$text = null;
}
}
if( !empty($atts["auto"]) ){
if( strtolower($atts["auto"]) == 'no' or $atts["auto"] == "1"){
$auto = "vp-s";
}else{
$auto = "vp-a";
}
}else{
$auto = "vp-a";
}
if( !empty($atts["p"]) ){
$p_before = '<p>';
$p_after = '</p>';
}else{
$p_before = null;
$p_after = null;
}
if( !empty($atts["n"]) ){
$nofollow = ' rel="nofollow"';
}else{
$nofollow = null;
}
$filter1 = null;
$filter2 = apply_filters('wpt_video_popup_shortcode_filter', 0);
if($filter2 == 1){
if( !empty($atts["rel"]) ){
$rel = 1;
}else{
$rel = 0;
}
$filter1 = apply_filters('wpt_video_popup_attr_filter', $rel);
}
if( !empty($atts["url"]) ){
$parse = parse_url($atts["url"]);
if( strtolower($parse['host']) == 'soundcloud.com' ){
if( $auto == 'vp-a' ){
$sc_auto = '&vp_soundcloud_a=true';
}else{
$sc_auto = '&vp_soundcloud_a=false';
}
$embed_sc_url = home_url("/?vp_soundcloud=") . $atts["url"] . $sc_auto;
$data_sc = ' data-soundcloud="1" data-soundcloud-url="'.esc_url($atts["url"]).'" data-embedsc="'.esc_url($embed_sc_url).'"';
$url = '#';
}else{
$data_sc = null;
}
}else{
$data_sc = null;
}
if( !empty($atts['wrap']) ){
if( strtolower($atts['wrap']) == 'no' or $atts['wrap'] == '1' ){
$dis_wrap = ' data-dwrap="1"';
}else{
$dis_wrap = null;
}
}else{
$dis_wrap = null;
}
if( !empty($atts['rv']) and $atts['rv'] == '1' ){
$rv_class = ' vp-dr';
}else{
$rv_class = null;
}
if( !empty($atts["w"]) ){
$get_width = $atts["w"];
$width_attr = ' data-width="'.esc_attr($get_width).'"';
}else{
$width_attr = null;
}
if( !empty($atts["h"]) ){
$get_height = $atts["h"];
$height_attr = ' data-height="'.esc_attr($get_height).'"';
}else{
$height_attr = null;
}
if( !empty($atts["title"]) ){
$get_title = $atts["title"];
$title_attr = ' title="'.esc_attr($get_title).'"';
}else{
$title_attr = null;
}
if( !empty($atts["co"]) ){
$get_overlay_color = $atts["co"];
$overlay_color_attr = ' data-overlay="'.esc_attr($get_overlay_color).'"';
}else{
$overlay_color_attr = null;
}
if( !empty($atts["dc"]) ){
$dis_controls_attr = ' data-controls="1"';
}else{
$dis_controls_attr = null;
}
if( !empty($atts["di"]) ){
$dis_info_attr = ' data-info="1"';
}else{
$dis_info_attr = null;
}
if( !empty($atts["iv"]) ){
$dis_iv_attr = ' data-iv="1"';
}else{
$dis_iv_attr = null;
}
if( !empty($atts["img"]) ){
$image_url = $atts["img"];
$text = null;
$text = '<img class="vp-img" src="'.$image_url.'">';
}
$media = '<a'.$filter1.' class="'.$auto.$rv_class.'" href="'.$url.'"'.$title_attr.$nofollow.$width_attr.$height_attr.$data_sc.$dis_wrap.$overlay_color_attr.$dis_controls_attr.$dis_info_attr.$dis_iv_attr.'>'.$text.'</a>';
return $p_before.$media.$p_after;
}
Code file location:
video-popup/video-popup/features/shortcode.phpConclusion
Now that you’ve learned how to embed the Video PopUp 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