Widgets

How to Disable Visual Editor in the Text Widget

In the new version of WordPress 4.8, the text widget was changed and now new text widget comes with a simple visual and text editor. Similar to the one you see on the post edit screen.

After this update, many developers got a problem, some elements that they inserted on the site using a text widget worked uncorrected. Someone will say that you can make your custom widget and the problem will be solved, but it will take a long time to restore and remake everything. The best solution is to allow users to enable and disable the editor in a text widget when necessary, and now I’ll tell how I did it in my projects.

So, let’s start

We don’t know what version of WordPress use our buyer, and first we check the version. You can also add a new parameter to the theme settings page and add the activity check of this parameter to the condition. That’s exactly what I did.


// Disable Editor in the Text Widget
if ( $wp_version >= 4.8 && $theme_config['config']->get('enable_editor_text_widget', true) )
{
    ...
}

The next step we remove the text-widgets.js from the array of loading files.


// Disable Editor in the Text Widget
if ( $wp_version >= 4.8 && $theme_config['config']->get('enable_editor_text_widget', true) )
{
    add_action( 'admin_init', function()
    {
        global $wp_scripts;

        if ( $wp_scripts )
        {
            $wp_scripts->remove( 'text-widgets' );
        }
    });
}

Next, we change the fields in the widget form


// Disable Editor in the Text Widget
if ( $wp_version >= 4.8 && $theme_config['config']->get('enable_editor_text_widget', true) )
{
    add_action( 'admin_init', function()
    {
        global $wp_scripts;

        if ( $wp_scripts )
        {
            $wp_scripts->remove( 'text-widgets' );
        }
    });

    add_action('in_widget_form', function( $widget, $return, $instance )
    {
        if ($widget->id_base=='text')
        {
            $filter = isset( $instance['filter'] ) ? $instance['filter'] : 0;
            $title = isset( $instance['title'] ) ? sanitize_text_field( $instance['title'] ) : '';
            $text = isset( $instance['text'] ) ? esc_textarea( $instance['text']) : '';
            ?>
            <p>
                <label for="<?php echo $widget->get_field_id('title'); ?>"><?php esc_html_e( 'Title', 'deepsoul'); ?>:</label>
                <input class="widefat" id="<?php echo $widget->get_field_id('title'); ?>" name="<?php echo $widget->get_field_name('title'); ?>" type="text" value="<?php echo esc_attr($title); ?>" />
            </p>
            <p>
                <label for="<?php echo $widget->get_field_id('text'); ?>"><?php esc_html_e( 'Content', 'deepsoul' ); ?>:</label>
                <textarea class="widefat" rows="16" cols="20" id="<?php echo $widget->get_field_id('text'); ?>" name="<?php echo $widget->get_field_name('text'); ?>"><?php echo $text; ?></textarea>
            </p>
            <p>
                <input id="<?php echo $widget->get_field_id('filter'); ?>" name="<?php echo $widget->get_field_name('filter'); ?>" type="checkbox"<?php checked( $filter ); ?> class="checkbox onoff"/>
                <label for="<?php echo $widget->get_field_id('filter'); ?>"><?php esc_html_e( 'Automatically add paragraphs', 'deepsoul' ); ?></label>
            </p>
            <?php
        }
    }, 10, 3);

}

And last, we save the data when the user presses save


// Disable Editor in the Text Widget
if ( $wp_version >= 4.8 && $theme_config['config']->get('enable_editor_text_widget', true) )
{
    add_action( 'admin_init', function()
    {
        global $wp_scripts;

        if ( $wp_scripts )
        {
            $wp_scripts->remove( 'text-widgets' );
        }
    });

    add_action('in_widget_form', function( $widget, $return, $instance )
    {
        if ($widget->id_base=='text')
        {
            $filter = isset( $instance['filter'] ) ? $instance['filter'] : 0;
            $title = isset( $instance['title'] ) ? sanitize_text_field( $instance['title'] ) : '';
            $text = isset( $instance['text'] ) ? esc_textarea( $instance['text']) : '';
            ?>
            <p>
                <label for="<?php echo $widget->get_field_id('title'); ?>"><?php esc_html_e( 'Title', 'deepsoul'); ?>:</label>
                <input class="widefat" id="<?php echo $widget->get_field_id('title'); ?>" name="<?php echo $widget->get_field_name('title'); ?>" type="text" value="<?php echo esc_attr($title); ?>" />
            </p>
            <p>
                <label for="<?php echo $widget->get_field_id('text'); ?>"><?php esc_html_e( 'Content', 'deepsoul' ); ?>:</label>
                <textarea class="widefat" rows="16" cols="20" id="<?php echo $widget->get_field_id('text'); ?>" name="<?php echo $widget->get_field_name('text'); ?>"><?php echo $text; ?></textarea>
            </p>
            <p>
                <input id="<?php echo $widget->get_field_id('filter'); ?>" name="<?php echo $widget->get_field_name('filter'); ?>" type="checkbox"<?php checked( $filter ); ?> class="checkbox onoff"/>
                <label for="<?php echo $widget->get_field_id('filter'); ?>"><?php esc_html_e( 'Automatically add paragraphs', 'deepsoul' ); ?></label>
            </p>
            <?php
        }
    }, 10, 3);

    add_filter('widget_update_callback', function( $instance, $new_instance, $old_instance, $widget )
    {
        if ( $widget->id_base == 'text' )
        {
            $instance['filter'] = ! empty( $new_instance['filter'] );
        }
        return $instance;
    }, 10, 4);

}
Just paste this code into the functions.php file your theme and don’t forget to change the text domain and condition.

Leave a comment