Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I'm playing a little with wordpress widgets and I trying to do something like this:

I created a sidebar and a widget to display a slider with latest posts. The jQuery loader is something like this:

jQuery('#slider-wrap-id').mySlider({
    //args
});

Ok, there aren´t problems if user include one of this slider of sidebar. But if two sliders or more was been included there are problems because the slider wrape have the same id.

<div id="slider-wrap-id">
    <!--slides-->
</div>

My aproach at the moment is the following:

In widget function I create a hook with parameters to load slider like this.

Note: pseudo code

class Vi_Posts_Slider_Widget extends WP_Widget {

    function Pi_Posts_Slider_Widget() { 
        //register args 
    }

    //the key function to solve my problem, maybe :)
    function widget( $args, $instance ) {
        //extract, WP_Query to retrive posts ...
        //ok now the key, I want to define slider id dynamically
        <div id="$id"></div>
        //finally generate hook to load slider
        do_action('vi_posts_slider_widget', array(......, 'slider_id' => $sid ) );
    }

    // update and form functions
}

//load individual sliders with diferent id and arguments
function vi_load_slider($sldier_opts){
    <script type="text/javascript">
        jQuery('<?php echo $sldier_opts['id'] ?>').mySlider({
            //args using $slider_opts
        });
    </script>
} 
add_action('vi_posts_slider_widget', 'vi_load_slider');

the only argument I need is the current widget id. For example when I register sidebars I created like this:

register_sidebar(array(
    'name' => __('Default Sidebar', "theme_textdomain"),
    'before_widget' => '<div id="%1$s" class="widget %2$s">',
    // $s provide the single id
    //............
));

By this way the results look lik this.

<div id="sample-widget-1">
<div id="sample-widget-2">
.......

I'm trying to find the same approach to define unique sliders id. If you have any advice or suggestion please push me in the right direction.

PD: so sorry for my English, I´m learning at the same time WordPress and English :)

share|improve this question
add comment

1 Answer

up vote 1 down vote accepted

The correct practice is actually to use $args['before_widget] and $args['after_widget'] to handle the id, class, and anything else. In pseudo code:

class My_Widget extends WP_Widget {
    function My_Widget() {

        //basic widget settings.
        $widget_ops = array(
            'classname'   => 'my-name',
            'description' => 'This is the description'
        );

        //widget control settings.
        $control_ops = array(
            'id_base' => 'my-name-widget'
        );

        //create widget
        $this->WP_Widget( 'my-name-widget', 'Widget Title', $widget_ops, $control_ops );

    }
    function widget( $args, $instance ) {

        // split $args
        extract( $args );

        /* Our variables from the widget settings. */
        $title = apply_filters( 'widget_title', $instance['title'] );
        //apply any additional settings here

        /* Before widget (defined by themes). */
        echo $before_widget;

        /* Display the widget title if one was input (before and after defined by themes). */
        if( $title )
            echo $before_title . $title . $after_title;

        // do all the widget output

        /* After widget (defined by themes). */
        echo $after_widget;
    }
}

If you're still a bit confused, print_r() $args and you'll see what all you have available to you. If you're STILL confused, Justin Tadlock has a great guide that will get you going in the right direction.

It's important that you use $before_widget and $after_widget because if someone were to register the widgets with <li>s and you had hardcoded <divs>, they would pretty quickly either become frustrated, or just move away from your code altogether.

share|improve this answer
    
Oh my god, print_r(). Now I'm using $widget_id and the objetive is completed. The article linked is awesome. Thanks a lot. –  Marcos Feb 12 '12 at 22:48
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.