Troubleshooting: WordPress editor toolbar doesn't match Page Builder toolbar

There are two types of differences between the WordPress text editor and Page Builder text editor that you might notice:

  • The default WordPress text editor toolbar has some icons that Page Builder doesn't, and vice versa.
  • Some WordPress plugins add icons to the WordPress text editor toolbar that don't appear in the Page Builder text editor toolbar.

Both of these cases are described here.

Editor toolbar differences

If you're used to working with the WordPress text editor, you might notice some subtle differences in the Page Builder text editor. Here's a specific comparison. The Page Builder text editor is displayed above and the WordPress text editor is displayed below.

Item in Page Builder that doesn't appear in the WordPress editor:

(These are the orange items in the Page Builder text editor above)

  • Font sizes
    This setting makes it convenient to change text size without going to the Text tab and typing in the code.

Items in the WordPress editor that are missing in Page Builder:

(These are the green items in the upper WordPress editor)

  • Blockquote
    This tool inserts a <blockquote> tag at the beginning and end of what you type when you toggle it on and off. You can add the <blockquote> tags manually on the Text tab. Check the output after the page is published, as how it is rendered depends on your theme.
  • Insert Read More tag
    Page Builder doesn't use the more tag or the text <!--more--> because it breaks Page Builder.
  • Text strikethrough
    You can add text strikethrough in either of the following ways:
    • Click the Text tab and enclose your text in an <s> tag. For example:
      <s>keyboard shortcuts</s> results in keyboard shortcuts.
    • Use the Alt+Shift+d keyboard shortcut on Windows; Control+Option+d on Mac.
  • Keyboard shortcuts
    You can access a more complete list of keyboard shortcuts in the WordPress codex.

Plugin icons in the WordPress toolbar missing in the Page Builder text editor

In addition, you might have some special icons on your WordPress toolbar for plugins that don't appear in the Page Builder text editor. For example, the following screenshot shows some plugin buttons in the WordPress editor toolbar.

These icons are missing in Page Builder:

Plugin buttons that appear in the WordPress text editor are removed in Page Builder because, in WordPress coding concepts, the WordPress text editor is considered "back end" and Page Builder is considered "front end." Many plugins are only coded to work in the WordPress "back end" admin area, and when used in the front end, they don't work or even completely break Page Builder.

The only way to fix this is to contact the plugin developer and request that they make the plugin Beaver Builder-compatible and add the button to the UI with a priority higher than 9999.