Top Ten EditorPlus Features

Introduction

EditorPlus is an addon for the Gutenberg Block Editor. It is not just another block set addon. EditorPlus brings lots of features to Gutenberg by extending core. In that way it is unique in the Gutenberg space. You may not need it on every site, but after reading this post you will understand the benefits it offers and have a good idea of when you will want to use it.

This is a countdown post listing the features of EditorPlus. Starting at ten, each feature is more important and compelling as we countdown to one. Lets get started.

Video Version

Feature Ten: Kept Up to Date and Supported

Editor Plus On WordPress Org

EditorPlus is free, GPL licensed, and available from the WordPress plugin directory. It gets regular updates, has a five star rating, and support is active. The author manages a number of other successful projects, including the Gutenberghub website, and is the number one seller on the Elegant Themes Marketplace.

Feature Nine: Ability to Disable Features You Don’t Intend to Use

I think that it is a sign of a good plugin when it offers you the option to disable features that you don’t plan to use. When you install and activate EditorPlus you can an Admin menu item under the Settings menu.

Styling, CSS Editor, Blocks, Icons Library, and Animations are the major feature areas, which we will cover. You can use the toggle to disable those you don’t want to use.

Editorplus Admin Menu Area

Feature Eight: Icons Everywhere

When you have EditorPlus activated, it adds an Icon option to the block toolbar for core blocks that allow text. It also works with many third party blocks, if they use the same core rich edit control.

Editor Plus Icon Option

You can select from the free Font Awesome set or from the Icon Moon set. One thing that would be a nice enhancement here is if you could search for icons in addition to paging through them.

Editor Plus Icon List

There are some design options for color and background.

Design Settings

Here is an example of adding an icon to a button.

Example With Icon Added

Feature Seven: Ability to “Copy Styling”

Have you gotten tired of styling buttons to look the same or otherwise applying styles to keep the look consistent? EditorPlus adds a “Copy Style” feature. When you use any of the EditorPlus settings, then the “Copy Styling” button can be used to copy and paste styles.

Copy Styling

Once you click on the Copy Styling button then a Paste Styles button appears. In this case, I entered “Another Heading,” which was the default black color. Then I clicked on the Test Heading block and clicked Copy Styling. Then I selected the text in the Another Heading block and clicked Paste Styles.

Paste Styling

Currently this only works for option settings added by EditorPlus. Perhaps in the future they will include setting from the core blocks as well.

Feature Six: Responsive Controls and Hover Options

Responsive Controls

Core blocks don’t give you the ability to set layout and style options by device size, leaving it up to the theme. Sometimes referred to as “responsive,” Editor Plus gives you the ability to enter different options settings, depending on the visitor’s device size. EditorPlus adds a number of option settings panels to each block and these have responsive options.

Editorplus Options Panels

If you click on the icon that look like a tablet then it opens a place to pick the device size that the selected options apply to.

Device Size Options

To test this I added a heading and image to the page.

Heading And Image Added

For the test, I set the image on desktop to 40% width.

Responsive Image Sizing

I did that by clicking on Sizing, then the responsive icon, and then Desktop. Note that the sizing unit is percentage by default, but you can use any unit measure you want by clicking on the percent sign and selecting from the list. Sometimes your theme may have styles set that it tries to enforce, so you can override those, if necessary by clicking on the exclamation point button.

Editor Plus Sizing Units Option

Checking on mobile, the image looked too small.

Image Too Small On Mobile

So I set it to 100% for that device size.

Image Width Set On Mobile

Back to Desktop I noticed that the image was not centered.

Image Not Centered

So I went to the Margins panel, clicked on the responsive icon to be able to set the margin options by device size, and then clicked on the Advanced tab to get the input boxes for each direction. I clicked the checkboxes to the left of the input boxes for the Right and Left margins to auto set the margins and center the image.

Image Centered

Two things to note. The first is that when you use the EditorPlus responsive options the screen resizes automatically in the editor to give you a preview. Gutenberg has its own Preview option, but when using the EditorPlus settings, just let it control the preview and don’t try to use both, or results may be confused. The second thing is that when you set an option for Desktop, it automatically applies the same setting to Tablet and Mobile. However, when you set it on Mobile it does not automatically apply the setting up to the other two sizes. So, check the various sizes to make sure the settings are as desired.

Hover Options

EditorPlus also provides hover options for each block. In our example, the image is sized to 40% of the width on Desktop. I clicked on the pointer icon to access the hover options.

Image Before Hover Options

Then the Hover tab showed and I set the width on hover to 100%. Mobile was already 100%, but Desktop and Tablet were smaller, so when you hover on those sizes the image goes to full size. When you have the Hover tab selected, the content shows as it would when the mouse is over it, to make it easier to preview.

Hover Option Set

As you can imagine, it is possible to combine the different layout and style hover options, if desired.

Feature Five: Shape Dividers, Animations, and a CSS Editor

Things are heating up in the countdown, as this is actually three separate features.

Shape Dividers

SVG shape dividers are available for the Cover Block, the Columns Block and Inner Column Block, and the Group Block. Here I’ve added a two column block with a heading and image in each column.

Column Block With Content

Here are the Shape Divider options. There are twelve styles of divider.

Shape Divider Options

There are height and width settings.

Shape Divider Height And Width Options

And here I’ve added a divider.

Shape Divider Added

Currently you can only set a shape divider for the top or bottom, but not both.

Animations

There are seven entrance animation types to chose from: Fade, Slide, Bounce, Zoom, Flip, Fold, and Roll.

Editorplus Animation Options

When you select one of the options then you get some controls for it. There is a Player there which you can click on to test it.

Animation Chosen

CSS Editor

EditorPlus adds a panel for custom CSS to each block. If you know CSS and want to add a tweak then this is a nice convenience.

Custom Css Panel For Each Block

Feature Four: Integration with the Gutenberg Hub Library

The Gutenberg Hub website

Gutenberg Hub Website

The blocks and templates are made using the core blocks and EditorPlus, so they are just pre-designed. When you find one you like you click on it to go to the details page. I thought that the blue background and blob was part of the block, but it isn’t.

Note the “Copy Code” button and the block name. Click the Copy Code button to copy the block.

Gutenberg Hub Example

Then go to the EditorPlus Admin page at Settings/Editor Plus and then to the Blocks tab.

Editor Plus Page In The Admin

When you click the Add Block button you get a popup where you can paste the code.

Paste In Block Code

After you click the Add Block button in the popup then it is added to you site.

Block Added To Site

In the Gutenberg editor you can now add the block to the page the way you regularly do.

Searching For Block

And here is the block added to the page. When you add one of these block to a page they default to full width. You can add it to a column or use the settings to set the size.

Block Added To Page

The ability to copy and paste a block from the Gutenberg Hub website works fine. It would be nice if this feature was integrated into the Gutenberg editor like the pre-designed libraries of other addons.

Feature Three: Blocks Added By EditorPlus

While most of EditorPlus is focused on enhancing the default blocks, the plugin now adds several blocks which you cannot make by combining core blocks. Some of them, like the Tabs and Toggle (Accordion) blocks, are found in almost every block addon. Some of the others, like the Lottie block, are more unique. Here I’ll look at two of them, the Lottie Block and the Rating Block.

Editorplus Blocks

The Lottie Block

The Lottie block is one of my favorites. Lottie animations are small JSON files that can be scaled without pixilation. There are a number of free Lottie animations available online. One place to get them is from LottieFiles.com. I searched for one I liked and selected this one.

Lottie Animation Search Online

When you click on it you go to a details page. On the details page, you want to download the JSON file by clicking the button in the upper right corner. If you want to, you can adjust some of the parameters first, like the play speed and background color.

The Details Page

After you download the JSON file, you can go to the page where you want to show it and add it to the page.

Lottie Block Adding Json File

The Lottie block has some settings options available.

Lottie Block Options

If you click on the Block / Customize button you go to a sub panel with some design options.

Lottie Block Design Options

And here is the result after adding the JSON file. The magnifying glass and pencil move back and forth.

Lottie Final View

Rating Block

The rating block is another one not available in core. You have the option to show the stars, or icon of your choice, inline or stacked. There are some some design options that are available from sub panels by clicking on one of the Customize buttons.

Rating Block Options

For example, here is the Customize panel for the Title, which gives you the EditorPlus Typography options.

Rating Block Design Options

Feature Two: Creating a Custom Block

Gutenberg core comes with the ability to create reusable blocks and EditorPlus adds the ability to create custom blocks. The difference is that when you edit a reusable block then it changes everywhere. A Custom block on the other hand is ready to be edited when you insert it into a page.

To create a custom block, first select several blocks and click on the three dot menu and then click on Group.

Editorplus Group Of Blocks

Then you can click on the group and click the Add to Custom Blocks menu.

Add Group To Custom Blocks

Give the custom block a name.

Name The Custom Block

Then when you want to use the custom block, find it in the block list.

Add Custom Block

Then insert it as you would any other block.

Custom Block Inserted

Feature One: EditorPlus Adds Consistent Options to Every Block

One of the main reasons people use third party block addons is because the core blocks are too limited and inconsistent. For example, here are the settings for the Heading block. You can set the font size, the heading color, and the background color. That’s it. If you need to adjust the margin or padding you are out of luck.

Core Heading Block Settings

Here is the columns block’s settings. You can adjust the colors and number of columns, but nothing else.

Core Columns Block Settings

Here is the Button block settings. You can choose a predefined style and set color, border, and link settings.

Core Button Block Settings

Now lets look at these blocks with EditorPlus active. Here is the Heading block again, this time with EditorPlus options.

Editorplus Heading Block Settings

The columns block with the EditorPlus options.

Editorplus Columns Block Settings

And the Button block with the EditorPlus options.

Editorplus Button Block Settings

Note how there are panels for Typography, Background, Box Shadow, Border, Border Radius, Margin, Padding, Sizing, Extras, and Animations on every block. Core WordPress leaves this styling to your theme and if you need to make adjustments then you will need to add some CSS. EditorPlus makes these settings available universally.

Discussion and Conclusions

The EditorPlus plugin is under active development. This might make it seem “unfinished,” as it is regularly being improved. For example, here are three features that could be improved to make them more complete:

  • First, when you go to add an icon (feature eight above), there is no way to search for an icon, you need to page through them.
  • Second, you can only add a shape divider (feature five above) to the top or the bottom of a block, but not both. Also, while you can flip a divider right to left, you cannot flip one top to bottom.
  • Third, you need to go to the Gutenberg Hub website to get predesigned blocks or templates, and then copy and paste them (feature 2 above). It would be nice if the library of predesigned elements was integrated with Gutenberg, the way it is for many of the other addons.

I understand that these improvements are on the future roadmap, so the author is aware and actively improving the offering.

Despite the room for improvements, EditorPlus has all of the hallmarks of a good plugin, you know, the markers people look for to judge if it is a quality option and safe to use.

  • EditorPlus is GPL open source, it is free with no upsell, it is regularly updated, and the author is an accomplished developer.
  • The author is engaged with users and wants to make Gutenberg easy to use. If you are on Facebook, there is an active group where the author regularly asks for feedback and suggestions.
  • EditorPlus provides layout and design options by device size, which is another good benefit. It is a bit surprising that Gutenberg core does not address this and just leaves it up to the theme.
  • The core blocks are the most likely to be supported in the future. Also, they tend to be light-weight and performant. For these reasons an argument could be made for using core blocks whenever possible. EditorPlus makes that possible by bringing consistent layout and design options. This is a huge benefit.
  • This consistent set of layout and style options helps to bridge the gap between page builders and Gutenberg and makes it easier for users to get started.
  • As far as I have been able to see, using the layout and styling options supplied by EditorPlus with the core blocks is safe. If you disable EditorPlus you may lose some styling, but I did not see any weird characters, broken blocks, or broken pages. This is not true of non-core blocks where you get a broken block message or an odd mix of CSS and HTML when it is disabled.

Of course, if you have a pro addon for Gutenberg that replaces all of main the core blocks, if it is well coded, provides consistent features, and you know it will be around in the future, then you may not need EditorPlus. However, when you see a plugin like this one, and it is clear that many of its features should really already be part of core, then it is obvious that it “hits the spot” and is worthy of consideration.

Some of the links in the post above are “affiliate links.” This means if you click on the link and purchase the item, I will receive an affiliate commission. You will still pay the same amount so there is no extra cost to you. I am disclosing this in accordance with the Federal Trade Commission’s 16 CFR, Part 255: “Guides Concerning the Use of Endorsements and Testimonials in Advertising.”  

Similar Posts

  • Though I know Munir Kamal well and I have been using this of plugin by him for a long period ( one update even broke the option images to be added in the post editor so I contacted him in the support forum) , i enjoyed this review because have not still used the features in the latest update and have missed some things.
    Like Lottie animations and was really confused how to use the icons hence have never done it.
    So thank You , David!

  • Wow, David, this review makes me smile and take my hat off. 🙂

    I don’t know any other place on the internet where to find such well-structured and well-illustrated reviews of WordPress plugins etc.

    I had just shortly tried this plugin after reading Justin Tadlock’s positive reviews, but was having big import difficulties because I was following the really bad video on the GB Hub site. Reading your review now makes it crystal clear to me and my own testing can start, thank you so much!

  • Hey David,

    Thank you so much for this very detailed review. 🙏

    This is surely the first most detailed walkthrough of what the EditorPlus plugin does and where it needs improvements.

    I am here to answer any of your readers’ questions via comments. 😇

    I would also like to highlight this fact for your readers that you have tested the plugin thoroughly for about a week and reported to me the issues and struggles you found throughout your review process of the plugin. Like one of your readers mentioned in a comment, I was surprised how you actually review the plugin properly while you write the review. 👏

    In the end, I must mention that the plugin surely has a lot of room for improvement (like any other plugin) and that I am closely noting all the feedback from everywhere I am getting. So please keep the feedback coming my way. 🙌

    Regards,
    Munir

    • So I guess this quality plugin won’t stay free for ever, which I am absolutely fine with, as 1) its present quality already shows that there is an enormous amount of time and dedication invested in it, and 2) this will hopefully guarantee it has a long lifetime. 🙂

      I still think this possibility has to be given a thought, as someone who is not willing or able to pay for it might later, as with all block-plugins, be faced with the lock-in effect, unless they only use the core blocks.

      @Munir Kamal
      I am very impressed with your work and this plugin in particular.
      I wish you good luck and will eagerly follow any development news about it here and with Justin Tadlock where I first read about it.
      Really looking forward to testing your plugin together with the Kadence theme I have installed. Keep up the excellent work!

      • Hey Chris,

        Thank you for the feedback. 🙏

        Regarding the future plans. Justin raised this as well a few times in his posts and asked me directly.

        EditorPlus will remain free with what you got already and there will be more features added for sure. Rest assured, what’s being added will remain free and improve over time.

        My intention is to make it capable of creating modern web designs easily as you can using other page builders and website builders overall.

        I do have some monetisation plans for this and GutenbergHub overall. I will disclose that once the time comes. 😇

        But that also will hopefully open up earning opportunities for others who uses EditorPlus.

        For example selling premium templates for Gutenberg is one option. 🤔

        I am also open to suggestions and ideas. So let me know what you think?

        • Hi Munir,

          Thanks a lot for your kind and interesting reply, much appreciated!

          You wrote:
          “EditorPlus will remain free with what you got already and there will be more features added for sure. Rest assured, what’s being added will remain free and improve over time.”

          That’s amazing news and seems a very generous attitude to me!

          As for later monetization — as can also be said about the quality features already present in the plugin — you obviously know what you are doing and I have the greatest respect for it and really like the usage potential you are hinting at in your reply.

          You wrote:
          “I am also open to suggestions and ideas. So let me know what you think?”

          I will certainly provide some feedback after having tested it for a while and in depth, which I am really looking forward to.

          Right now, I’m thinking the same as David did above:

          “EditorPlus has all of the hallmarks of a good plugin, you know, the markers people look for to judge if it is a quality option and safe to use.” 🙂