0

I've been following numerous tutorials and codex pages in order to make my own widget in WP 4.0. It seems as though I'm very near; I can output something from the widget, just not any of the fields.

In banner.widget.php I have the following:

class bannerWidget extends WP_Widget {


        public $id_base          =  'banner_widget';
        public $name             =  'Banner Widget';
        public $widget_options   =  array(
                'classname'     =>  'RandomPostWidget',
                'description'   =>  'Displays a random post with thumbnail'
                );
        public $control_options  =  array();


        function bannerWidget() {
            parent::WP_Widget(false, $name = __('Banner Widget', 'banner_widget') );
        }


        function form($instance) {
            // Check values
            if( $instance) {
                $title = esc_attr($instance['title']);
                $text = esc_attr($instance['text']);
                $textarea = esc_textarea($instance['textarea']);
            } else {
                $title = '';
                $text = '';
                $textarea = '';
            }
            ?>

            <p>
            <label for="<?php echo $this->get_field_id('title'); ?>"><?php _e('Widget Title', 'wp_widget_plugin'); ?></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 $title; ?>" />
            </p>

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

            <p>
            <label for="<?php echo $this->get_field_id('textarea'); ?>"><?php _e('Textarea:', 'wp_widget_plugin'); ?></label>
            <textarea class="widefat" id="<?php echo $this->get_field_id('textarea'); ?>" name="<?php echo $this->get_field_name('textarea'); ?>"><?php echo $textarea; ?></textarea>
            </p>
            <?php
        }


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


        public function widget($args, $instance){
            extract( $args );
            // these are the widget options
            $title = apply_filters('widget_title', $instance['title']);
            $text = $instance['text'];
            $textarea = $instance['textarea'];
            echo $before_widget;
            // Display the widget
            echo '<div class="widget-text wp_widget_plugin_box">';
            // Check if title is set
            if ( $title ) {
                echo $before_title . $title . $after_title;
            }
            // Check if text is set
            if( $text ) {
                echo '<p class="wp_widget_plugin_text">'.$text.'</p>';
            }
            // Check if textarea is set
            if( $textarea ) {
                echo '<p class="wp_widget_plugin_textarea">'.$textarea.'</p>';
            }

            echo '</div>';
            echo $after_widget;
        }

}

add_action('widgets_init', create_function('', 'return register_widget("bannerWidget");')

In functions.php:

function make_sidebar_area() {
    register_sidebar( array(
        'name' => 'Test Sidebar Area',
        'id' => 'test_sidebar_1',
        'description' => 'Test sidebar description here',
        'before_widget' => '<div>',
        'after_widget' => '</div>',
        'before_title' => '<h2 class="rounded">',
        'after_title' => '</h2>',
        )
    );
}
add_action( 'widgets_init', 'make_sidebar_area' );

And finally in index.php I have:

the_widget('bannerWidget');

This outputs the following, but none of the filled-in widget fields are showing:

<div class="widget widget_bannerwidget">
    <div class="widget-text wp_widget_plugin_box">
    </div>
</div>

Could somebody please tell me where I'm going wrong?

1

Using the_widget() denies those $instance variables being set, which they normally are when you stick it in a Sidebar in the back end.

Try something like this:

the_widget('bannerWidget', array(
    'title' => 'WordPress rocks!',
    'text' => 'Hello World.',
    'textarea' => 'Some content for the textarea'
) );

the_widget is for hard-coded widgets. To use the one placed in your custom sidebar, replace the_widget() with this:

echo '<ul class="sidebar">';
dynamic_sidebar( 'test_sidebar_1' );
echo '</ul>';

dynamic_sidebar is for displaying all widgets inside of the specified sidebar (passing the sidebar ID), where the_widget is for only rendering a specific widget, usually only used for something that has no options that need to be edited.

  • Well that certainly outputs something, but I need to have the widget configurable from the admin section. I guess I should be using something other than the_widget() - any advice on that? Edit: Aha - I posted this comment before you edited. Thanks. – verism Oct 8 '14 at 13:17
  • Normally you should create a sidebar and put it there. – aifrim Oct 8 '14 at 14:06
  • Yes @verism, I made the answer more complete after reading it over. :) – Eric Holmes Oct 8 '14 at 17:36

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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