I have created a 2x shortcodes that displays a youtube video and vimeo video when the user enters the videos id in it, for example: [youtube id=""] [vimeo id=""].

Instead of entering this in my post I am trying to create a custom meta box that the user can enter the id in and then this is displayed.

So far I have been able to create a plugin to display the meta box but I'm not sure how to get it to save the youtube/vimeo ID and display the video.

Will I need 2x different meta boxes? One that the user can enter the youtube video ID in and the other where the vimeo ID can be entered and then this is displayed on the front end?

The code I have for the meta box is:

add_action( 'add_meta_boxes', 'cd_meta_box_add' );
function cd_meta_box_add()
    add_meta_box( 'my-meta-box-id', 'Enter Video ID', 'cd_meta_box_cb', 'videos', 'normal', 'high' );

function cd_meta_box_cb( $post )
    $video_type = get_post_meta($post->ID,'my_video_type',true);
    $video_id = get_post_meta($post->ID,'my_meta_box_text',true);
    wp_nonce_field( 'my_meta_box_nonce', 'meta_box_nonce' );

        <label for="my_meta_box_text">Select video type:</label>
         <!-- added select for selecting vedio type -->
        <select name="my_video_type" id="my_video_type">  
            <option <?php echo ($video_type == 'youtube') ? "selected='selected'" : "" ;?> value="youtube">Youtube</option>
            <option <?php echo ($video_type == 'vimeo') ? "selected='selected'" : "" ;?> value="vimeo">Vimeo</option>
        <!-- added select for selecting vedio type -->

        <label for="my_meta_box_text">Youtube/Vimeo ID:</label>
        <input type="text" name="my_meta_box_text" id="my_meta_box_text" value="<?php echo $video_id; ?>" />


add_action( 'save_post', 'cd_meta_box_save' );
function cd_meta_box_save( $post_id )
    // Bail if we're doing an auto save
    if( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) return;

    // if our nonce isn't there, or we can't verify it, bail
    if( !isset( $_POST['meta_box_nonce'] ) || !wp_verify_nonce( $_POST['meta_box_nonce'], 'my_meta_box_nonce' ) ) return;

    // if our current user can't edit this post, bail
    if( !current_user_can( 'edit_post' ) ) return;

    // now we can actually save the data
    $allowed = array( 
        'a' => array( // on allow a tags
            'href' => array() // and those anchords can only have href attribute

    // Probably a good idea to make sure your data is set
    if( isset( $_POST['my_meta_box_text'] ) )
        update_post_meta( $post_id, 'my_meta_box_text', wp_kses( $_POST['my_meta_box_text'], $allowed ) );


In single.php I need to run a query to display the video based on what the user enters in the meta box. My code for that is:

<?php global $post; ?>

                        if(get_post_meta($post->ID,'my_video_type',true) == "youtube"){
                            $youtube_id = get_post_meta($post->ID,'my_meta_box_text',true);     
                            if(get_post_meta($post->ID,'my_video_type',true) == "vimeo"){
                                $vimeo_id = get_post_meta($post->ID,'my_meta_box_text',true);   


However this does not display anything. I have been pulling my hair out to get this sorted. If anyone can help it will be greatly appreciated. Thanks in advance.

  • 2
    Why aren't you simply using the built-in embed support for youtube and vimeo? Wordpress will convert the complete URL for either of those sites into a video for you.
    – t31os
    Commented Jan 21, 2014 at 18:45

1 Answer 1


Do you have custom post type videos? if not change videos to post

add_meta_box( 'my-meta-box-id', 'Enter Video ID', 'cd_meta_box_cb', 'post', 'normal', 'high' );

Your code is fine but you are not saving the video type select box you just updated the id input field.

Place this code in add_action('save_post', 'cd_meta_box_save');

if( isset( $_POST['my_meta_box_text'] ) && isset( $_POST['my_video_type'] ) ) {
        update_post_meta( $post_id, 'my_meta_box_text', wp_kses( $_POST['my_meta_box_text'], $allowed ) );
        update_post_meta( $post_id, 'my_video_type', strip_tags($_POST['my_video_type']) );

It will also save your selected video type and after try echo with the following code.


global $post;
if (get_post_meta($post->ID, 'my_video_type', true) == "youtube") {
    echo do_shortcode('[youtube id="'.get_post_meta($post->ID, 'my_meta_box_text', true).'"]');
if (get_post_meta($post->ID, 'my_video_type', true) == "vimeo") {
    echo do_shortcode('[vimeo id="'.get_post_meta($post->ID, 'my_meta_box_text', true).'"]');

Youtube and Vimeo Shortcode:

function wp_youtube_video($atts) {
    extract(shortcode_atts(array('id' => ''), $atts));
    return '<iframe title="YouTube video player" class="youtube-player" type="text/html" width="640" height="390" src="http://www.youtube.com/embed/'.$id.'" frameborder="0" allowFullScreen></iframe>';

add_shortcode('youtube', 'wp_youtube_video');

    function wp_vimeo_video($atts) {
        extract(shortcode_atts(array('id' => ''), $atts));
        return '<iframe src="http://player.vimeo.com/video/'.$id.'" width="WIDTH" height="HEIGHT" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>';
    add_shortcode('vimeo', 'wp_vimeo_video');
  • Thanks. I do have a custom post type called videos which is why I placed that there. I have added the code you suggested to save the the video type but for some reason it wont display the video on the front end :( Commented Sep 25, 2013 at 13:04
  • I don't know how you implemented the vimeo video or youtube video but if you echo the above code it will output the video id in front end. Commented Sep 25, 2013 at 13:10
  • I dont want it to return the video id I want it to display the video in the front end when the user enters the id in the meta box. I want wordpress to display the video once the id has been entered. Commented Sep 25, 2013 at 13:13
  • You can paste the video id in your created shorcode. You should also need to paste the video shortcodes code in question too without seeing the code its not possible to answer with your needs. Commented Sep 25, 2013 at 13:17
  • I cannot add the videos id in the shortcode because this will not always be the same it will be different each time Video Short code :function wp_youtube_video($atts) { extract(shortcode_atts(array( 'id' => '' ), $atts)); return '<iframe title="YouTube video player" class="youtube-player" type="text/html" width="640" height="390" src="http://www.youtube.com/embed/'.$atts['id'].'" frameborder="0" allowFullScreen></iframe>'; } add_shortcode('youtube', 'wp_youtube_video'); Commented Sep 25, 2013 at 13:22

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.