phpwordpresswordpress-shortcodedynamic-contentdivi

WordPress - Adding dynamic video content into Divi page template


I've added a code snippet (Snippets plug-in) in WordPress that creates a shortcode that we can use to display dynamic video on a page template. The video field comes from a custom field (file field) that we've added using ACF. This code works to display the video, however we are trying to get it to display the thumbnail image for the video, which is also using a dynamic field, and that is not working. We have followed this article: https://speckyboy.com/html5-video-wordpress-custom-fields/, but instead created a custom short code rather than running the code on the back-end (because we are using Divi, we want to be able to insert the short code from the front-end). Here is the snippet:

// function that runs when shortcode is called
function wpb_video_shortcode() { 
  
// Get the Video Fields
$video_mp4 =  get_field('video_mp4'); 
$video_thumbnail  = get_field('video_thumbnail'); 

// Build the  Shortcode
$attr =  array(
'mp4'      => $video_mp4,
'poster'   => $video_thumbnail,
'preload'  => 'auto'
);

// Output needs to be return
return $attr;
 }
// register shortcode
add_shortcode('course_video', 'wpb_video_shortcode');

Thanks in advance.


Solution

  • Shortcode functions should echo HTML. Yours returns an array of attributes.

    Try this for the last line of your function.

    echo wp_video_shortcode( $attr );
    

    The tutorial you followed is clear about this.