How to Disable the WYSIWYG Editor Inside the Confirmation Settings

Introduction

Would you like to disable the WYSIWYG editor that appears inside the Confirmation settings? By default when you are inside the form builder you’ll see the standard WYSIWYG that WordPress uses. But if you wanted to disable this field you can easily do this by adding a few lines of PHP. In this tutorial, we’ll walk you through the steps on how to disable this editor.

What is a WYSIWYG editor anyway? This is what is typically referred to as a Visual Editor or rich text Field. When you first go into the Confirmation settings tab from the form builder, you’ll typically see two tabs. One is for the Visual text editor (WYSIWYG) and the other is a plain Text tab.

Confirmation settings screen offers two types of editors, the Visual and the Text

The plain Text editor is typically used more often for users who are comfortable with writing HTML.

Adding the snippet to disable the WYSIWYG editor

Before we create the form, let’s first add the snippet that will disable this editor. To do this, just copy and paste this snippet to your site.

If you need help in adding snippets to your site, please see this tutorial.

/**
 * Disable the WYSIWYG editor in the Confirmation settings
 *
 * @link https://wpforms.com/developers/how-to-disable-the-wysiwyg-editor-inside-the-confirmation-settings/
 *
*/
 
function wpf_dev_builder_enqueues( $view ) {
         
    wp_add_inline_script(
        'wpforms-builder',
        'WPFormsBuilder.settings.tinymceDefaults = { tinymce:false, quicktags:{theme: \'modern\'} };'
    );
 
}
add_action( 'wpforms_builder_enqueues', 'wpf_dev_builder_enqueues', 10, 1 );

/**
 * Add admin styles to WPForms Confirmation Message settings 
 * 
 * @link https://wpforms.com/developers/how-to-disable-the-wysiwyg-editor-inside-the-confirmation-settings/
*/

function wpf_dev_add_admin_styles_confirmation_settings( ) {
  echo '<style>
    #wpforms-panel-settings .wpforms-panel-field-tinymce>label { margin-bottom: 10px !important; }
	#wpforms-panel-settings .wpforms-panel-field-tinymce textarea, .quicktags-toolbar { border: 1px solid #cccccc !important; }
  </style>';
}
add_action( 'admin_head', 'wpf_dev_add_admin_styles_confirmation_settings', 10 );

The first function will disable the Visual editor (the WYSIWYG editor) completely and you’ll only see the Text editor. The second function adds a little CSS to the admin area to balance the removed editor.

now you have successfully used the snippet to disable the WYSIWYG editor

Would you like to also disable the automatic scrolling when there are errors on the form? Check out our article on How to Disable the Scrolling Effect on Field Validation Errors.