Custom widget doesn't work in customizer
-
Hi, I have working widget on the dashboard, which can upload images. My source was here, but in customizer the Upload image button doesn’t work. The scripts are loaded, can alert a message on click, and also tb_show() function doesn’t work on click. Here is the code:
class My_Widget extends WP_Widget { function __construct() { parent::__construct( 'my_widget', __('My Widget', 'my_theme'), ); add_action('admin_enqueue_scripts', array($this, 'upload_scripts')); } public function upload_scripts() { global $pagenow; if($pagenow == 'widgets.php' || $pagenow == 'customize.php') { wp_enqueue_script('media-upload'); wp_enqueue_script('thickbox'); wp_enqueue_script('upload_media_widget', get_template_directory_uri() . '/js/upload-media.js', array('jquery')); wp_enqueue_style('thickbox'); } } public function widget($args, $instance) { echo $args['before_widget']; ?> <a href="<?php echo $instance['link']; ?>" title="<?php echo $instance['title']; ?>" target="_blank"> <div style="background-image: url(<?php echo $instance['image']; ?>)"> <h2><?php echo $instance['title']; ?></h2> </div> <p><?php echo $instance['description']; ?></p> </a> <?php echo $args['after_widget']; } public function form($instance) { $title = !empty($instance['title']) ? $instance['title'] : ''; $description = !empty($instance['description']) ? $instance['description'] : ''; $link = !empty($instance['link']) ? $instance['link'] : ''; $image = !empty($instance['image']) ? $instance['image'] : ''; ?> <p> <label for="<?php echo $this->get_field_id('title'); ?>"><?php _e('Title:'); ?></label> <input class="widefat" id="<?php echo $this->get_field_id('title'); ?>" name="<?php echo $this->get_field_name('title'); ?>" type="text" value="<?php echo esc_attr($title); ?>"> </p> <p> <label for="<?php echo $this->get_field_id('description'); ?>"><?php _e('Description:'); ?></label> <textarea class="widefat" id="<?php echo $this->get_field_id('description'); ?>" name="<?php echo $this->get_field_name('description'); ?>"><?php echo esc_attr($description); ?></textarea> </p> <p> <label for="<?php echo $this->get_field_id('link'); ?>"><?php _e('Link:'); ?></label> <input class="widefat" id="<?php echo $this->get_field_id('link'); ?>" name="<?php echo $this->get_field_name('link'); ?>" type="text" value="<?php echo esc_attr($link); ?>"> </p> <p> <label for="<?php echo $this->get_field_name('image'); ?>"><?php _e('Image:'); ?></label> <input name="<?php echo $this->get_field_name('image'); ?>" id="<?php echo $this->get_field_id('image'); ?>" class="widefat" type="text" size="36" value="<?php echo esc_url($image); ?>" /> <input class="js-upload-image-button" type="button" value="Upload Image" /> <?php } public function update($new_instance, $old_instance) { $instance = array(); $instance['title'] = (!empty($new_instance['title']) ) ? strip_tags($new_instance['title']) : ''; $instance['description'] = (!empty($new_instance['description']) ) ? strip_tags($new_instance['description']) : ''; $instance['link'] = (!empty($new_instance['link']) ) ? strip_tags($new_instance['link']) : ''; $instance['image'] = (!empty($new_instance['image']) ) ? strip_tags($new_instance['image']) : ''; return $instance; } } function register_my_widget() { register_widget('My_Widget'); } add_action('widgets_init', 'register_my_widget');
And here is upload-media.js :
jQuery(document).ready(function($) { $(document).on("click", ".js-upload-image-button", function() { jQuery.data(document.body, 'prevElement', $(this).prev()); window.send_to_editor = function(html) { var imgurl = jQuery('img',html).attr('src'); var inputText = jQuery.data(document.body, 'prevElement'); if(inputText != undefined && inputText != '') { inputText.val(imgurl); } tb_remove(); }; tb_show('', 'media-upload.php?type=image&TB_iframe=true'); return false; }); });
Thanks for help.
- The topic ‘Custom widget doesn't work in customizer’ is closed to new replies.