0

I'm developing a video oriented theme. I need to include native WordPress video player in my page template. This is what I'm doing:

  1. $video url comes from a custom field. It outputs the video file url http://example.com/video.mp4

  2. do_shortcode() outputs the standard [video] shortcode used in posts/pages.

    $video = get_field( "video_file_url"); echo do_shortcode('[video src="'.$video.'"]');

This is what I'm getting: enter image description here The control bar color is light (not dark as in the standard WP player) and there's not play button in the middle center of the video.

I want to achieve the standard dark colored WordPress video player with a play button in the middle.

I guess I need to load mediaelement.js in my theme footer.php. I'm developing the theme from scratch and haven't done anything about mediaelement. Could that be the reason I'm getting light colored video player?

How can I output standart video player in the template?

Improve this question
6
  • What happens when you use the shortcode in the post content? The mediaelement js/css should be auto enqueued for the first shortcode instance.
    – birgire
    Commented Nov 6, 2016 at 11:10
  • The video player displays normally in the backend editor. But when I open the post in the frontend, player looks as shown in the question.
    – Azamat
    Commented Nov 6, 2016 at 11:25
  • Do you have the wp_head(); and wp_footer(); in your theme?
    – birgire
    Commented Nov 6, 2016 at 11:27
  • I have footer.php and header.php files. I've included them in index.php with get_header() and get_footer(). I don't have wp_head and wp_footer() anywhere.
    – Azamat
    Commented Nov 6, 2016 at 11:37
  • Then that's the problem, you must have those functions, for the js+css enqueue-ing to work
    – birgire
    Commented Nov 6, 2016 at 11:41

1 Answer 1

Reset to default
0

I included wp_head(); in the beginning of my header.php file. wp_footer(); was included at the end of the footer.php file.

Failure in including them led to the problem with the video player. Everything is working fine after adding wp_head(); and wp_footer();.

Thank you, birgire!

Improve this answer
1
  • 1
    You're welcome. Please close the question by accepting your answer, thanks.
    – birgire
    Commented Nov 6, 2016 at 12:44

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.