WordPress Editors – Table of Contents
Overview – paints the big picture of the current State of the WordPress Editors
The Basic Editor – establishes the key editing functions supported by all WordPress editors
WP Editor – duplicates the Basic Editor’s Visual Editor with minimal changes but extends the Text Editor’s features broadly
Classic Editor & Classic Add-on – also duplicates the Visual and Text Editor. The Classic Editor really can be thought of as a control routine for the dual availability of the Basic Editor and the new Gutenberg Editor.
Gutenberg and PageBuilder Comparison – definitely a long read
This is a chronology of 7 increasingly important WordPress editing capabilities.WordPress editors have gone through 3 transitions. First, page layout has gone from a 1-dimensional mode inserting content anywhere vertically on a page. Next, a 2 dimensional PageBuilding mode allows placing content anywhere on a page often with prebuilt and customizable components. the 3rd dimension calls for popup content to appear [and then disappear] as layers over a page. In WordPress the starting point in editing is the Basic Editor:
- Basic Editor – provides a Visual Editor that allows point & click text and media alignment, indenting and basic typography. It has a separate Text Editor tab that reveals the HTML and CSS that controls the proper display of the page;
- WP Editor retains all of the Visual Editor while significantly enhancing the Text Editor;
- Classic Editor & Classic Add-on controls the choice of using the basic editor or the Gutenberg Editor;
- Advanced TinyMCE Editor and WP EDIT both significantly enhance the Basic Editor while retaining all of its features;
- PageBuilders provide 2 dimensional page layout with horizontal and vertical placing & sizing of prebuilt yet also customizable blocks/components on a web page. PageBuilders use both point and click as well as drag and drop operations plus the magic of responsive layouts. This has been the breakthrough WordPress editing capability by easing and speeding up both page layout and designing/styling;
- Template Editors are now used to extend PageBuilding with either prebuilt or user created customizable components/blocks as reusable templates – Gutenberg Editor, Beaver Themer, Elementor Templates, Thrive Themes, Bricks Builder, Oxygen Theme, etc;
- Popup Editors provide 3 dimensional layered components/blocks with sophisticated popup/layer creation tools, triggering options, event-driven entry/exit rules, plus transparency and inter popup layer controls – Elementor Popups, Popup Builder, Popup Maker, and others;
Two things are of note about these WordPress editors. First, each of the above WordPress Editor is not only currently functional but actively deployed on millions of websites today. For example, the Advanced TinyMCE Editor is being used to write this post.
Second, as WordPress worldwide market share accelerated to 40% in the past 2-3 years, more vendors are offering their enhanced plugins into the more lucrative marketplace. One can see this in the number of PageBuilders/Theme Builders, Program Frameworks, and now Gutenberg Block vendors that are all vying for a portion of the WordPress Editor marketplace.
The Basic Editor
Starting with a newly minted WordPress install and disabling the aggressive default Gutenberg editor [now in the WordPress Core] produces a capable combo – a point and click Visual Editor plus a competent Text Editor. To this add a Media Files library that has accumulated a lot of features over the past few years so the emphasis is on the original image adding features.
Here is the Visual Editor with its basic edit features on display:
Using the Visual Editor, the most often used commands are Bold and/or Italic, Bulleted or Numbered lists and surprisingly Paste Clipboard Copy As Text-only. This is to allow for entering direct clipboard copies from other online sources as plain text.
The Text Editor, click the upper right tab, displays the Visual Editor content in the HTML+CSS code used by WordPress. As well the Text Editor command menu changes to fewer command buttons on the top line:
Yes, if you are HTML and/or CSS savvy, the Text Editor allows users to add their own HTML and/or CSS. This styling flexibility can be remarkably useful.
The Media Library has changed dramatically over the past 5 years and will be the subject of separate review. Here is the most common use, adding and inserting images or video. Yes, the Media library can contain audio files, PDFs, Excel files, PowerPoint presentations, Word documents, etc. But handling images is shown here:
And here is how the inserted image set to the full image size appears in the Visual Editor:
This ability to upload images to the image library and then place and size them on a page has been a winning feature for WordPress as witnessed by the tripling in the use of images on WordPress pages in the past 4 years.. However, no attempt is being made to describe all the Media Library features that have been added to WordPress in this same 4 year period. A special review of these WordPress Media Library features will appear in thePhotoFinishes.com
The other secret charm buried in the Basic Editor is Keyboard Shortcuts revealed by the keyboard sequence Shift + Alt + h .
The Keyboard Shortcuts are crammed with editing options which do not appear in the Basic Editor’s header bar. Many Ctrl + letter shortcuts are taken directly from browser defaults.
New options include underline, strikethrough, justify, header 1 to header 6, enter or leave distraction-free writing mode, and add media.
In summary thee are the starting WordPress editor features. It is important to note these features are carried forward largely intact within all 7 WordPress Editors.
When to use. You probably are using this editor now as it appears as an essential component in all of the other editors, PageBuilders and even the Gutenberg editor.
This is a plugin that available to WordPress users for the past 4-6 years. As seen in the screenshot below WP Editor retains all the basic Editor layout and icon commands:
However, WP Editor does not add any features to the Visual Editor. But it changes the Text Editor, as you can see from the screenshots below, WP Editor adds some very useful code editing extensions:
When to use. If you need to do a lot of HTML and CSS coding as a WordPress developer, add the WP Edtor plugin to your site and it will help immensely in the coding.
Classic Editor Classic Add-on
The Classic Editor is a Fix until 2022 which allows plugins that require the Classic Editor and its core hooks to operate within WordPress. for core edition 5.0 and beyond. The Classic Editor and Addon supports not just the Basic Editor but also WP Editor, WP Edit, the Advanced TinyMCE Editor plus Gutenberg, the full range of Page Builders and most other WordPress plugins. Here is the Classic Editor used with WP-Editor:
Because of the risk associated with losing Classic Editor, the WordPress clone, ClassicPress has been developed.
When to use: If you want to turnoff the Gutenberg editor for a specific page or post, go to the Classic Editor settings and make the Classic editor the default. Alternatively use the Disable Gutenberg plugin to banish Gutenberg from all edits.
Advanced TinyMCE Editor + WP Edit
Advanced TinyMCE and WP Edit appeared about 8-10 years ago and have competed in offering new editing feature that could be added to the Basic Editor while retaining its look and features. Among the many common new features were font choice and font size, table creation and editing, emoticons, background text color settings, anchors, printing, preview, and find & replace.
WP Edit has some unique features that hint at the upcoming PageBuilder revolution. The columns shortcode allows users to divide a row into separate container blocks. The latex Equations tools allows adding complex math equations into table or column elements as seen in screenshot below. The Pro version [$20US/2 users/year ]adds template Snidgets components, Qr-code support, Google and other custom font uploads, basic CSS stylesheet editor, and top menu bar with user customized contents.
The Advanced TinyMCE Editor has one unique editing feature – its settings can be added to the Gutenberg Editor’s Classic Paragraph block so a custom edit toolbar will be used when the block is loaded. Here is a screenshot with all of the Advanced TinyMCE toolbar command shown:
A small advantage to the Advanced Editor is that Andrew Ozz , creator of the TinyMCE, s on the WordPress Solutions Board.
When to use: Both editors add very useful features to the Basic Editor. So for quick posts I find myself using one of these Advanced Editors fairly often. In contrast, for pages and custom posts a PageBuilder is preferred
Gutenberg and PageBuilder Comparison
During this early phase of web app building one can see the transition from 1-dimensional, insert new content somewhere vertically on the evolving page to 2-dimensional placement of content components anywhere on the page.. But to make this “No coding required” web page building work well required 7 web technologies that had to mature :
- 1992 -editors like BBEdit and Hotmetal use full screen, point and click operations in dual Visual Editor/Text Editor split tasking that is used in today’s editors.
- 1996 – Liquid Layout with x% rather than fixed widths and Table Grid Hacks launch widespread use of 2-dimensional horizontal component placements on a web page.
- 2003 – Slide-in CSS, CSS Sprites and Popup ads hint at the impact of 3-dimensional layering and pop-ins on web page design. WordPress is launched.
- 2004 & 2010 – Resolution Dependent Layout and Responsive Design paper spell out how to merge fluid grids, flexible images, and media queries to create layouts that respond to the width & height of the client browser.
- 2010 – Customizable Web Templates can be inserted as a complete page or section of a page.
See the timeline of these Web technologies here.
The PageBuilder Explosion
In 2010 the software technologies for WordPress “No Coding Required ” PageBuilders burst on the WordPress market with 3 pioneering tools from Headway Themes, SiteOrigin,Builder, and Visual Composer. These first PageBuilders provided drag and drop page layout and placementf rom a selection of wireframe templates/components displayed as wirframes with point and click styling and customization of each component.. Here is some screenshots of the new PageBuilders:
Headway Themes delivers both user-chosen and/or template determined placement of all page components including headers, footers widgets – a precursor of FSE-Full Site Editing in 2010:!
The Headway Theme has been cloned and updated with many new components and style by Padma Unlimited.
Site Origins uses the wireframe model today along with the choice of a WYSIWYG Live Edit view.
SiteOrigin for a long time made its Page Builder free of charge. This strategy was followed by Elementor which made a substantial portion of Elementor free to users. Now both SiteOrigin and Elementor have major free versions and premium Pro versions.
As PageBuilder downloads from the WordPress grew along with positive reviews about the tools, a whole new crop of PageBuilders began to appear in 2014 and continue to this day. Here is a table of the major tools:
|3rd party addons||31||200+||hundreds||hundreds||8||25||5||14|
|Point&Click Styling⊗3||Very Good||Tops||Very Good||Lagging||Very Good||Very Good||Tops||Tops|
|WYSIWYG⊗4||FSE Now||Very Good||FSE Now||Lagging||Very Good||Very Good||FSE Now||FSE now|
|Popups⊗7||3rd party||3rd party||tops as pioneer||little||3rd party||3rd party||very good||very good|
|SiteControl⊗8||very good||good||good||good||good||good||good||very good|
|User Guides⊗9||very good||good||very good||little||good||good||good||very good|
Builder Conclusions or Why Gutenberg Editor is Disliked
Peering over the table of Builder Tools it is not hard to see that Guteberg Builder is in a pivotal position. As part of the WordPress Core it soon will be loaded on almost every WordPress website – literally millions. Also after a slow start, the number of 3rd party Gutenberg add-ons has reached the hundreds. And now these Gutenberg are now immediately available in the blocks list directory listing active in every Gutenberg Editor session. And the question is when will the Classic Editor and the Disable Gutenberg plugin be disabled?
However, when Gutenberg Editor is measured against key UI Builder features, it still runs a distinct second . This
night help explain how the Gutenberg editor after 5 years still only gets a 2.1 rating in the WordPress plugin Registry:
This is after 3,440 user reviews. Here is our conjecture as to why:
- WordPress has become coercive. If you update to WordPress 5.7 or later you get Gutenberg as the default Editor. Unless your site has the Classic Editor or Disable Gutenberg plugin, you must come up to speed in Gutenberg quickly.
- Coming up to speed in Gutenberg was very difficult in the first 3 years because of missing and changing features.
- Coming up to speed in Gutenberg currently is still difficult because Gutenberg tool names and features are still changing rapidly.
- With so many Gutenberg blocks and tools to choose from it easy to get lost trying to find the right edit tool. Also the lack of a comprehensive Gutenberg Users Guide from WordPress means searching for edit answers among. a variety of 3rd party resources.
- Gutenberg Editors lagging performance in Point and Click Styling and WYSIWYG editor display adds significant drawback to ease of use and speed of editing.
In sum Gutenberg has reached a crossroads. ts shortcomings and coercive approach to what heretofore has been an Open software. protecting their future, look what Beaver Builder, Bricks, Elementor, Oxygen, WP Manage and other vendors are investing in around the WordPress landscape. It is case of survival strategies now.