Weird issue: Custom wordpress widget being confused as text widget

Question

Wordpress appears to be confusing my widget with the "Text Widget".

On my widget settings page, it is displayed as

About Author (the name of my widget)
Arbitrary text or HTML (the description of the text widget)

When I register my widget with wordpress, it removes all widgets in the "Available Widgets" row from use.

When I open my widget to edit it, the final textarea (called about-author) is filled with the HTML of the widget settings page

When I put in content to the forms and click save, the form changes to that of the text widget (none of what I entered is saved either, the widget just goes back to "Available Widgets" when I refresh the page).

Here's the html the widget form contains when opening it (it's too long to paste here): Weird HTML

Here's my widget code (in functions.php in my theme):

class Ms_About_Author_Widget extends WP_Widget {

public function __construct() {
    parent::__construct('ms_about_author_widget', 'About Author',
            array(
                'classname' => 'ms_about_author_widget',
                'description' =>
                'A signature block containing your name and summary',
                ));

    // $this->widget_options['before_widget'] = sprintf($this->widget_options['before_title'],
    //  'authored-by', 'itemscope itemtype="http://schema.org/Person"');
}

public function widget($args, $instance) {
    echo $args['before_widget'];
    echo '<table>
                <tr>
                    <td class="author-image">
                        <img src="'.get_avatar('*my email*', 140).'"
                        width="70" height="70" itemprop="image">
                    </td>
                    <td class="author-bio">
                        <h3>Authored by <span itemprop="name">'.$instance['title'].'</span></h3><a href="https://twitter.com/'.$instance['twitter-name'].'" class="twitter-follow-button" data-show-count="false" data-show-screen-name="false">Follow</a>
                        <p itemprop="description"><img src="'.get_avatar('*my email*', 140).'"
                        width="70" height="70">'.$instance['about-author'].'</p>
                    </td>
                </tr>
            </table>';
    echo $args['after_widget'];

}

public function form($instance) {
    echo '
    <p>
        <label for="'.$this->get_field_name('title').'">Name:</label>
        <input class="widefat" id="'.$this->get_field_id('title').'" name="'.$this->get_field_name('title').'" type="text" value="">
    </p>
    <p>
        <label for="'.$this->get_field_name('twitter-name').'">Twitter Handle:</label>
        <input class="widefat" id="'.$this->get_field_id('twitter-name').'" name="'.$this->get_field_name('twitter-name').'" type="text" value="">
    </p>
    <p>
        <label for="'.$this->get_field_name('about-author').'">About You:</label>
        <textarea class="widefat" id="'.$this->get_field_id('about-author').'" name="'.$this->get_field_name('about-author').'" value="">
    </p>';
}

public function update($new_instance, $old_instance) {
    $instance = array();

    $instance['title'] = (!empty($new_instance['title'] )) ? strip_tags($new_instance['title']) : '';
    $instance['twitter-name'] = (!empty($new_instance['twitter-name'] )) ? strip_tags($new_instance['twitter-name']) : '';
    $instance['about-author'] = (!empty($new_instance['about-author'] )) ? strip_tags($new_instance['about-author']) : '';

    return $instance;
}
}

 function ms_register_widgets() {
    register_widget('Ms_About_Author_Widget');
}

add_action('widgets_init', 'ms_register_widgets');

Any ideas on what this is or how to fix it?

Ayub Ayub · Accepted Answer · 2013-08-22T12:30:20

/facepalm

.....

The issue was an unclosed </textarea>...

Only found out after rewriting the whole thing.

Weird issue: Custom wordpress widget being confused as text widget

1 Answers