What's WP
Find Everything Related to WordPress - Best Tutoriasl on WordPress!
The Beginner's Guide on WordPress Visual Editor

The Beginner’s Guide on WordPress Visual Editor

The visual editor is a special tool for the editing of WordPress posts. As it is a WYSIWYG editor, you can preview your blog posts, modify the content structure, and add some images or multimedia during the content creation process. It includes some obscure but great WordPress features you may want.

As comparing with the text editor, the visual one is much more user-friendly for both newbies and experienced webmasters. With it, you do not need to add some coding stuff for content customization and click the Preview button to check how your posts displayed in the front-end. Instead, you can edit your posts and add some visual effects simply by clicking a few buttons. Also, the content that shows up on your editing screen will be displayed in the same way on your front-end.

Here, we’d like to come out a beginner’s guide about this special WordPress editor.

Character Customization

In the text editor, you have to use some special tags to add the formats of bold, italic, strike-through and underline to your characters. With the visual editor, however, you can add these effects by clicking the corresponding buttons.

Character customization

Besides, you can decide the font size by choosing from the drop-down list as the screenshot below. Note that the list includes various headings and some pre-defined styles built into your templates. Therefore, besides the default styles, you may be able to utilize some additional formatting to apply to your text.

Font Size

As for the text color, you can make use of the “A” button by picking your target color. Note that WordPress only allows 39 options by default, but you can add some custom options as you want.

Font Color

Paragraph Format

As for the format of paragraph, you can firstly decide the alignment, including left-aligned, right-aligned and center-located. Besides, you can align your paragraph to both left and right margins by adding additional spaces between your characters, achieving a full-display of your content.

Paragraph Alignment

Besides, if your posts have some sub-points or sub-paragraphs, you can also achieve the bulleted list and the numbered list with the following two buttons.

List Button

Lastly, you can also make use of two indent buttons to move your text left or right by one level, fully meeting your webpage design and layout.

Indent Buttons

Functional Buttons

WordPress visual editor has some functional buttons to achieve different goals. For instance, you can add some quotes with the block-quote button, add a horizontal line with the horizontal-line button, insert a read more tag with the read more button, add some special characters with the special-character button, clear all the formatting with the eraser button, remove or repeat the last actions with the undo or redo button.

Function Buttons

Besides these, you can also find a button allowing you to paste words as text. Generally, when you copy and paste some words from somewhere else, you may find that they will change the format of your current text using their original styles. In this case, the utilization of this button is great as it automatically removes any special formatting and tags of your copied text. This is particularly useful when you copy words from Microsoft Word.

Paste as Text

Insert Links

No matter you are going to insert an internal link or an external link, WordPress visual editor allows you to do this within second. Here, you only need to click the Insert Link button, enter the target URL and link title, and click the Add Link button. If you want to insert an internal link, you can click the “link to existing content” button and choose your preferred link within your website. Note that if you want this link to be opened in a new window or tab, you can check the box as the image showed as below.

Insert Links

As for the removal of links, simply click the remove link button.

Special Note

By default, you can only check the first row of buttons from WordPress visual editor. If you need the second role of buttons to achieve your goal, you have to click the Toolbar Toggle button.

Besides, if you add some plugins to extend the functionality of the core WordPress installation, you may get additional buttons from the visual editor.

Toolbar Toggle button


Joyce is a professional writer & SEOer who loves trying new things and sharing the experience through blogging. She loves clean design, playing with different WordPress themes, SEO, etc. Very often, you could find her in various WordPress event as invited speakers.