How to Disable WordPress Visual Editor on Individual Posts and Pages

Updated on

Do you want to Disable WordPress Visual Editor on individual post and pages? Or you might be struggling to add a specific code in your post and WordPress Post Editor removes the code each time after you save the draft.

In this guide, I will walk you through the steps on how to disable visual editor in WordPress. We will learn two different ways to Disable WordPress Default Editor. The one is using a WordPress Hide Content Editor plugin and another is without a plugin.

How to Disable WordPress Visual Editor on Individual Posts and Pages
How to Disable WordPress Visual Editor on Individual Posts and Pages

A few days back, one of my clients requested me to resolve a unique problem.

The problem was the use of <svg> tags in WordPress Visual Editor. She wanted to use SVG (Scalable Vector Graphics) on a single page of her website.

As WordPress Post Editor does not allow all HTML tags except few. Therefore, she was unable to use <svg> tag through HTML editor.

Did you face such problem ever? I do, during my initial days of WordPress development.

And many people, who want to create a page or unique post, or wants to add some new features and functionality on their website, might have struggled with the same problem.

Before digging into the details. First of all, let’s understand the functionality (how it works) of WordPress Visual Editor and then we will move forward to disable visual editor on pages or pages.

What is WordPress Visual Editor or Post Editor?

The screen where we write our content for post or pages is known as the Visual Editor aka WordPress Post Editor, as displayed in the below-given image.

WordPress Post Editor
WordPress Post Editor

By default, WordPress provides a WYSIWYG interface for writing content as Post Editor.

WYSIWYG stands for ‘What You See Is What You Get”.

Simply, we can understand that, whatever the content is currently being displayed on the screen in Visual Editor at Backend, will be displayed the same after publishing at Frontend.

WordPress Visual Editor is a rich text editor. There are multiple options you can use in WordPress Post Editor like Formatting of Text, Select the heading type, Insert Blockquote, Insert or Remove a Link, Add a Read more tag, etc.

Here one important thing to notice is that Post Editing area has two editors, one is Visual Editor with WYSIWYG interface and another one is a simple Text Editor.

Text Editor can be used to write content in basic HTML language.

The limitation with default WordPress Post Editor is that you cannot use all kind of HTML tags. Since I have initially discussed the problem to use of <svg> tag in WordPress Post Editor.

However, there is a solution to use all kind of HTML tags. You only need to use HTML Text Editor and you have to Disable WordPress Post Editor.

Disable WordPress Post Editor from your dashboard easily

  1. Head over to User Profile Menu, Dashboard > Users > Your Profile.
  2. Find the first option Visual Editor – Disable the visual editor when writing a post.
  3. Select this check box as shown in the below figure, save the options and you are done.
  4. It will disable the WordPress Visual Editor completely for this uses.
Disable WordPress Post Editor for All the Page and Posts for specific User
Disable WordPress Post Editor for All the Page and Posts for specific User

Okay! After disabling visual editor, check your WordPress Post Editor or try to edit your old posts. It will look something like this.

Disabled WordPress Visual Editor for Specific User
Disabled WordPress Visual Editor for Specific User

Do you find yourself comfortable with this? Now you have to write all the posts and pages in HTML language.

This is will be the best possible way to create specific pages, but for writing posts on a regular basis, I personally don’t find myself comfortable with this setup.

So, here is the solution to Disable WordPress Post Editor on specific pages or post.

Alright!

There are Two Methods to Disable WordPress Post Editor on Individual Posts and Pages.

First one is without a plugin and the second one is a plugin.

Method #1 Disable WordPress Visual Editor without Plugin

You only need to add the following code in the functions.php file of your WordPress theme.

Before adding the code, I recommend you take a backup of your functions.php file.

Identify the Page-ID in the case of you want to Disable WordPress Visual Editor on an individual Page, And Post-ID in the case of Post on which you are planning to Disable WordPress Visual Editor.

Identify the Page-ID or Post-ID in WordPress by using this simple method.

Jump to step 4 if the page already exists.

  1. Create a New Page
  2. Enter the Page Title and
  3. Save it as Draft
  4. Now look for the current URL in the browser window as shown in the figure below
  5. Your Page-ID is hidden in the URL
  6. For the given below the figure, Page-ID is 353
Page-ID showing in WordPress Visual Editor
Page-ID showing in WordPress Visual Editor

Follow the same method to identify Post-ID

Add the following code to Disable WordPress Visual Editor on Individual Posts or Pages

function tn_disable_visual_editor( $can ) {
global $post;
if ( 353 == $post->ID )
return false;
return $can;
}
add_filter( 'user_can_richedit', ' tn_disable_visual_editor ' );

I always recommend to take a backup of your functions.php file and use a child theme to edit theme files.

Method #2 Disable WordPress Visual Editor with Plugin

There are a few very good plugins available on WordPress Plugin Directory for free. However, I would recommend you to use Disable Visual Editor WYSIWYG WordPress Plugin developed by Stanislav Mandulov. This plugin is quite simple and lightweight.

Follow the steps to Disable WordPress Visual Editor with Plugin

  1. Install the plugin and activate it.
  2. Head over to the Post Editor and
  3. Look for new Post-Box named Visual Editor below the Publish Post-Box.
  4. Select the Check-Box as per your requirement.
  5. You can disable visual editor for this post only or
  6. For all the posts in this category.
Disable WordPress Visual Editor on Individual Pages and Posts with Plugin
Disable WordPress Visual Editor on Individual Pages and Posts with Plugin

Final Thoughts

Either you use the code or plugin. I found that Disabling WordPress Visual Editor on individual pages and posts is quite easy and handy.

If you want to disable post editor on one or two pages, I would recommend you to use the code rather using a plugin. But, if your requirement is for more pages you can use a plugin.

What method do you use to Disable WordPress Visual Editor on individual pages and posts, do let us know via the comment section below.

Like this post? Then do share it in your social circle. Somebody who is struggling with this problem might find it useful.

Further readings you might find interesting…

Photo of author
Saurabh K
Saurabh K is a technology enthusiast and part-time blogger. He loves to explore the efficient use of technology and gadgets. He is an outlier and lensman. Add him in your social circle to know more.
Disclaimer: Affiliate links of some product(s) are being used on this page, if you follow the link and make a purchase, we may receive compensation from respective companies. This compensation comes at no additional cost to you.

3 thoughts on “How to Disable WordPress Visual Editor on Individual Posts and Pages”

  1. Avatar of Stanley Kroft

    Hi,
    Great post. Just what I needed. Just fyi, however. You have an extra space in your code b/w the underscore and “visual”.

    disable_ visual

    Reply
    • Avatar of Saurabh K

      Have updated the post. Thank you for stopping by.

      Reply
  2. Avatar of JO

    Post needs an update!

    The manual option using a code snippet doesn’t work, it disables the Visual editor everywhere .

    The plugin is over 2 years old without an update.

    Reply

Leave a Comment

Your email address and website details will not be published. Required fields are marked with *.