使用添加媒体添加图像链接

时间:2018-07-18 14:00:47

标签: wordpress

function tshirt_gif_text() {
    woocommerce_wp_text_input( 
        array( 
                    'id'          => 'gif_tshirt', 
                    'label'       => __( 'GIF T-Shirt', 'woocommerce' ), 
                    'placeholder' => 'http://',
                    'desc_tip'    => 'true',
                    'description' => __( 'Them GIF links.', 'woocommerce' ),
                    'value'       => get_post_meta( get_the_ID(), 'gif_tshirt', true )
        )
    );
}
add_action( 'woocommerce_product_options_advanced', 'tshirt_gif_text' );

function tshirt_gif_text_save( $post_id ) {
    // update_post_meta( $post_id, 'gif_tshirt', $checkbox );
    if (isset($_POST['gif_tshirt'])){
        update_post_meta( $post_id, 'gif_tshirt', $_POST['gif_tshirt'], false );
    }

    if (!isset($_POST['gif_tshirt'])){
        delete_post_meta( $post_id, 'gif_tshirt');
    }
}
add_action( 'woocommerce_process_product_meta', 'tshirt_gif_text_save' );

我创建了一个自定义文本字段,以将链接添加到图像。我想使用媒体上传器上传图片或从现有图片中选择图片,并使用链接更新“ gif_tshirt”帖子元,但我不知道该如何开始。

<a href="#" id="insert-my-media" class="button">Add my media</a>

我认为可以使用此按钮。

这是JS

jQuery(function($) {
    $(document).ready(function(){
            $('#insert-my-media').click(open_media_window);
        });

function open_media_window() {
    if (this.window === undefined) {
        this.window = wp.media({
                title: 'Insert a media',
                library: {type: 'image'},
                multiple: false,
                button: {text: 'Insert'}
            });

        var self = this; // Needed to retrieve our variable in the anonymous function below
        this.window.on('select', function() {
                var first = self.window.state().get('selection').first().toJSON();
                wp.media.editor.insert('[myshortcode id="' + first.id + '"]');
            });
    }

    this.window.open();
    return false;
}
});

但是它将其插入到主要说明中,我该如何选择目的地?

1 个答案:

答案 0 :(得分:0)

我做到了!

add_action('plugins_loaded', function(){
  if($GLOBALS['pagenow']=='post.php'){
    add_action('admin_print_scripts', 'my_admin_scripts');
    add_action('admin_print_styles',  'my_admin_styles');
  }
});

function my_admin_scripts(){
  wp_enqueue_script('jquery');
  wp_enqueue_script('media-upload');
  wp_enqueue_script('thickbox');
}

function my_admin_styles(){
  wp_enqueue_style('thickbox');
}
add_action(
  'add_meta_boxes',
  function(){
    add_meta_box(
      'my-metaboxx1', // ID
      'Hover MP4 Catalog', // Title
      'func99999', // Callback (Construct function)
      get_post_types(), //screen (This adds metabox to all post types)
      'side', // Context
      'core'
    );
 },
 999
);
function func99999($post){
$url =get_post_meta($post->ID,'gif_tshirt', true);   ?>
<label for="video_URL">
<input id="video_URL" type="text" name="video_URL" value="<?php echo $url;?>" /> 
<input id="upload_video_button" class="button" type="button" value="Choose a Video" />
<br />Choose a video from the media library then, update your post/page to save it.<br /><br />
<?php
if ($url != "") {
?>
<video class="video" controls>
            <source src="<?php echo $url;?>" type="video/mp4" id="vidsrc">
            Your browser does not support HTML5 video.
        </video>
<?php
}
?>
</label>
 <script>


jQuery(document).ready(function($){
 $('#video-metabox.postbox').css('margin-top','30px');

 var custom_uploader;
 $('#upload_video_button').click(function(e) {

    e.preventDefault();

    //If the uploader object has already been created, reopen the dialog
    if (custom_uploader) {
        custom_uploader.open();
        return;
    }

    //Extend the wp.media object
    custom_uploader = wp.media.frames.file_frame = wp.media({
        title: 'Choose a Video',
        button: {
            text: 'Choose a Video'
        },
        multiple: false
    });

    //When a file is selected, grab the URL and set it as the text field's value
    custom_uploader.on('select', function() {
        attachment = custom_uploader.state().get('selection').first().toJSON();
        $('#video_URL').val(attachment.url);

    });

    //Open the uploader dialog
    custom_uploader.open();

    });


});
</script>
<?php
}

add_action( 'save_post', function ($post_id) {
if (isset($_POST['video_URL'])){
    update_post_meta($post_id, 'gif_tshirt',$_POST['video_URL']);
}
});