Intereting Posts
Как ограничить количество пользователей ролью Удалить конечную косую черту после расширения .html Сортировка и разбивка пользовательских почтовых таксономий по алфавиту Как распределить таксономию категорий с настраиваемым типом сообщения (плагин Календарь событий) Нужно добавить стоимость, если флажок установлен Как добавить действие customize_register ПОСЛЕ добавления пользовательской таксономии Оберните группу сообщений запроса wp в родительский div по дате / году Добавить атрибут в приложения WordPress, читающий старую версию functions.php, разбивает сайт Вызов неопределенной ошибки функции в плагине Удаление существующего пункта меню Содержимое вытащили из шаблона страницы вместо редактора Удалять wpautop только из определенных коротких кодов Таксономия сливается с существующей страницей как я могу добавить класс css на текущей странице в wordpress wp_nav_menu

Использовать загрузку мультимедиа в пользовательский виджет в wordpress 3.5

Я создаю небольшой виджет для wordpress 3.5, который позволяет загружать изображения.

WordPress загружается корректно. Когда я добавляю виджет к боковой загрузке, кнопка загрузки не работает. Если я обновляю страницу сохранения моего виджета на боковой панели, кнопка работает, и я могу загрузить и сохранить изображение правильно.

Чтобы создать виджет, я был вдохновлен этими ссылками:

https://stackoverflow.com/questions/13863087/wordpress-custom-widget-image-upload

https://stackoverflow.com/questions/13847714/wordpress-3-5-custom-media-upload-for-your-theme-options/13901303#13901303

Мой виджет Код:

<?php add_action('widgets_init', 'ctUp_ads_widget'); function ctUp_ads_widget() { register_widget( 'ctUp_ads' ); } function ctUp_wdScript(){ wp_enqueue_media(); wp_enqueue_script('adsScript', get_template_directory_uri() . '/js/ads.js'); } add_action('admin_enqueue_scripts', 'ctUp_wdScript'); class ctUp_ads extends WP_Widget{ function ctUp_ads() { $widget_ops = array( 'classname' => 'ctUp-ads' ); $control_ops = array( 'width' => 250, 'height' => 350, 'id_base' => 'ctUp-ads-widget' ); $this->WP_Widget( 'ctUp-ads-widget',THEMENAME .' - Ads', $widget_ops, $control_ops ); } public function widget($args, $instance){ extract( $args ); ?> <a href="#"><img src="<?php echo esc_url($instance['image_uri']); ?>" /></a> <?php } function update($new_instance, $old_instance) { $instance = $old_instance; $instance['text'] = strip_tags( $new_instance['text'] ); $instance['image_uri'] = strip_tags( $new_instance['image_uri'] ); return $instance; } public function form($instance){ ?> <p> <label for="<?php echo $this->get_field_id('text'); ?>"><?php _e('Text', THEMENAME); ?></label><br /> <input type="text" name="<?php echo $this->get_field_name('text'); ?>" id="<?php echo $this->get_field_id('text'); ?>" value="<?php echo $instance['text']; ?>" class="widefat" /> </p> <p> <label for="<?php echo $this->get_field_id('image_uri'); ?>">Image</label><br /> <img class="custom_media_image" src="<?php if(!empty($instance['image_uri'])){echo $instance['image_uri'];} ?>" style="margin:0;padding:0;max-width:100px;float:left;display:inline-block" /> <input type="text" class="widefat custom_media_url" name="<?php echo $this->get_field_name('image_uri'); ?>" id="<?php echo $this->get_field_id('image_uri'); ?>" value="<?php echo $instance['image_uri']; ?>"> <a href="#" class="button custom_media_upload"><?php _e('Upload', THEMENAME); ?></a> </p> <?php } } 

Код Js:

 jQuery(function($){ $('.custom_media_upload').click(function(e) { e.preventDefault(); var custom_uploader = wp.media({ title: 'Custom Title', button: { text: 'Custom Button Text', }, multiple: false // Set this to true to allow multiple files to be selected }) .on('select', function() { var attachment = custom_uploader.state().get('selection').first().toJSON(); $('.custom_media_image').attr('src', attachment.url); $('.custom_media_url').val(attachment.url); $('.custom_media_id').val(attachment.id); }) .open(); }); }); 

Заранее благодарим за помощь!

Solutions Collecting From Web of "Использовать загрузку мультимедиа в пользовательский виджет в wordpress 3.5"

Проверьте, работает ли это для вас: поместите этот код в

 jQuery(document).ready( function(){ function media_upload( button_class) { var _custom_media = true, _orig_send_attachment = wp.media.editor.send.attachment; jQuery('body').on('click',button_class, function(e) { var button_id ='#'+jQuery(this).attr('id'); /* console.log(button_id); */ var self = jQuery(button_id); var send_attachment_bkp = wp.media.editor.send.attachment; var button = jQuery(button_id); var id = button.attr('id').replace('_button', ''); _custom_media = true; wp.media.editor.send.attachment = function(props, attachment){ if ( _custom_media ) { jQuery('.custom_media_id').val(attachment.id); jQuery('.custom_media_url').val(attachment.url); jQuery('.custom_media_image').attr('src',attachment.url).css('display','block'); } else { return _orig_send_attachment.apply( button_id, [props, attachment] ); } } wp.media.editor.open(button); return false; }); } media_upload( '.custom_media_upload'); }); 

Вместо ссылки для загрузки вы можете использовать кнопку

  <input type="button" value="<?php _e( 'Upload Image', 'theme name' ); ?>" class="button custom_media_upload" id="custom_image_uploader"/> 

Обновить:

Просто небольшие изменения в js и ваша проблема будут решены вместо

 jQuery(button_class).click(function(e) { 

вы должны использовать

 jQuery('body').on('click',button_class, function(e) { 

по мере добавления виджета с помощью ajax. Даже ваш предыдущий код должен работать, если вы сделаете аналогичные изменения в js.

  $('body').on('click','.custom_media_upload',function(e) {