Question

我在我的插件中使用了jscolor选择器。安装jscolor选择器后，选择器会在我自己的插件小部件中获取颜色。但是在保存小部件之后，颜色选择器已经消失了，它看起来就像一个带有颜色值的文本框。我以为我在更新功能上犯了一个错误。但它看起来也很好。出了什么问题？

我的代码是，

<?php
class blank_widget extends WP_Widget {
function blank_widget() {

        parent::WP_Widget(false, $name = __('Blank Widget', 'blank_widget') );

        /** Enqueue_css Declaration */
        add_action( 'wp_enqueue_scripts', array( $this, 'enqueue_css' ) );

        /** Load CSS in <head> */
        add_action( 'wp_head', array( $this, 'css' ) );


        $this->defaults = array(
            'bg_color'=> 'd00000',
        );
    }

// widget form creation
function form($instance) {
$instance = wp_parse_args( (array) $instance, $this->defaults );
?>
<p>
<label for="<?php echo $this->get_field_id('bg_color'); ?>"><?php _e('Background color:', 'blank_widget'); ?></label>
<input class="color" id="<?php echo $this->get_field_id('bg_color'); ?>" name="<?php echo $this->get_field_name('bg_color'); ?>" type="text" value="<?php echo esc_attr( $instance['bg_color'] ); ?>" />
</p>
<?php
function widget($args, $instance) {
   extract( $args );
 echo $before_widget;
 echo '<div class="site_bg">Test</div>';
 echo $after_widget;
}

function update($new_instance, $old_instance) {
      $instance = $old_instance;
      // Fields
      $instance['bg_color'] = strip_tags($new_instance['bg_color']);
     return $instance;
}

function css() {
/** Pull widget settings, merge with defaults */
$all_instances = $this->get_settings();
$instance = wp_parse_args( $all_instances[$this->number], $this->defaults );
/** The CSS to output */
$css = '
.site_bg{
background: '. $instance['bg_color'].';
}
';

/** Minify a bit */
$css = str_replace( "\t", '', $css );
$css = str_replace( array( "\n", "\r" ), ' ', $css );
/** Echo the CSS */
echo '<style type="text/css" media="screen">' . $css . '</style>';
}
}
add_action('widgets_init', create_function('', 'return register_widget("blank_widget");'));
add_action('admin_enqueue_scripts', 'pw_load_scripts');

function pw_load_scripts() {
    wp_register_script('custom-js', plugin_dir_url(__FILE__).'js/jscolor.js');
    wp_enqueue_script('custom-js');
}
?>

如何在wordpress小部件中添加jscolor选择器 - 插件

0 个答案: