0

以下のコードのJSで、ウィジェットから設定できるオプションを追加できるかどうか疑問に思っていました。ワードプレスのバックエンドで、私の主張を理解していただければ幸いです。

具体的には、スライド時間のオプションを追加する必要があります。私が使用しているjCarouselでは、その期間は$（'。slides_widget'）。jcarouselで「auto：5」によって指定されているため、「5」を「slide_duration」オプションに置き換える必要があります。ご覧のとおり、下のウィジェット。どうすればいいですか？

<?php 

/* Slides Widget */
class Slides_Widget extends WP_Widget {
    function Slides_Widget() {
        $widget_ops = array('classname' => 'widget_slides', 'description' => __('Create slides with this widget.'));
        $control_ops = array('width' => 400, 'height' => 350);
        parent::__construct('slides_widget', __('Slides_Widget'), $widget_ops, $control_ops);
    }
    function widget( $args, $instance ) {
        extract($args);
        $title = apply_filters( 'widget_title', empty( $instance['title'] ) ? '' : $instance['title'], $instance, $this->id_base );
        $slide_duration = $instance['slide_duration'];
        $text = apply_filters( 'widget_text', empty( $instance['text'] ) ? '' : $instance['text'], $instance );
        echo $before_widget;
        if ( !empty( $title ) ) { echo $before_title . $title . $after_title; } ?>
            <div class="textwidget">
                <ul id="slides_widget" class="slides_widget">
                    <?php echo !empty( $instance['filter'] ) ? wpautop( $text ) : $text; ?>
                </ul>
            </div>
        <?php
        echo $after_widget;
    }
    function update( $new_instance, $old_instance ) {
        $instance = $old_instance;
        $instance['title'] = strip_tags($new_instance['title']);
        $instance['slide_duration'] = absint($new_instance['slide_duration']);
        if (!$instance['slide_duration']) {
            $instance['slide_duration'] = "";
        }
        if ( current_user_can('unfiltered_html') )
            $instance['text'] =  $new_instance['text'];
        else
            $instance['text'] = stripslashes( wp_filter_post_kses( addslashes($new_instance['text']) ) );

        $instance['filter'] = isset($new_instance['filter']);
        return $instance;
    }
    function form( $instance ) {
        $defaults = array( 'filter' => true, 'title' => 'Create Your Slides', 'text' => '<li>Each slide must be in a "li" element, like this one.</li>
<li>Or like this one. Save it and check it.</li>' );
        $instance = wp_parse_args( (array) $instance, $defaults );
        $title = strip_tags($instance['title']);
        $text = esc_textarea($instance['text']);
        $slide_duration = strip_tags($instance['slide_duration']);
?>
        <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>

        <textarea class="widefat" rows="16" cols="20" id="<?php echo $this->get_field_id('text'); ?>" name="<?php echo $this->get_field_name('text'); ?>"><?php echo $text; ?></textarea>

        <p><label for="<?php echo $this->get_field_id('slide_duration'); ?>"><?php _e('Slide Duration:'); ?></label>
        <input class="widefat" id="<?php echo $this->get_field_id('slide_duration'); ?>" name="<?php echo $this->get_field_name('slide_duration'); ?>" type="text" value="<?php echo esc_attr($slide_duration); ?>" />
        </p>

        <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><input id="<?php echo $this->get_field_id('filter'); ?>" name="<?php echo $this->get_field_name('filter'); ?>" type="checkbox" <?php checked(isset($instance['filter']) ? $instance['filter'] : 0); ?> />&nbsp;<label for="<?php echo $this->get_field_id('filter'); ?>"><?php _e('Automatically add paragraphs'); ?></label></p>
<?php
    }
}
register_widget('Slides_Widget');

function pixy_asd() {
?>  
<script type='text/javascript'>
jQuery(document).ready(function($) {
    /* Slides Widget */
    function mycarousel_initCallback(carousel)
    {
        carousel.buttonNext.bind('click', function() {
            carousel.startAuto(0);
        });
        carousel.buttonPrev.bind('click', function() {
            carousel.startAuto(0);
        });
        carousel.clip.hover(function() {
            carousel.stopAuto();
        }, function() {
            carousel.startAuto();
        });
    };
    $('.slides_widget').jcarousel({
        auto: 5,
        wrap: 'last',
        visible: 1,
        scroll: 1,
        initCallback: mycarousel_initCallback
    });
});
</script>
<?php
}
add_action('wp_head', 'pixy_asd');

function pixy_slides_widget_script() {
    wp_enqueue_script('pixySlidesJS', get_stylesheet_directory_uri() . '/admin/include/theme-slides-widget/js/slides_widget.js', array('jquery'), true);
    wp_enqueue_style( 'pixySlidesCSS', get_stylesheet_directory_uri() . '/admin/include/theme-slides-widget/css/slides_widget.css', false, 1, 'screen' ); 
}
add_action('wp_enqueue_scripts', 'pixy_slides_widget_script');


?>

さらに詳しい説明が必要な場合はお知らせください。ありがとうございました！

4

1 に答える 1

1

form（）に追加：

<input type="hidden" id="slide_duration" value="<?php echo $slide_duration;?>">

次に、autoの代わりに使用します：5 this：

auto: $("#widgets-right #slide_duration").val()

PHPソリューションはどうですか？pixy_asd（）の場合：

$options = get_option('Slides_Widget');
$slide_duration = $options['slide_duration'];
?>
...
$('.slides_widget').jcarousel({
    auto: <?php echo $slide_duration;?>,
    wrap: 'last',
于 2012-05-21T11:32:31.137 に答える