Gutenberg Block Editor Toolkit – EditorsKit – WordPress plugin | WordPress.org

Gutenberg Block Editor Toolkit – EditorsKit

Description

EditorsKit provides a set of page building block options and toolkit for the new WordPress Gutenberg editor.

You can now have better control, text formats, styling, and workflow by simply utilizing the tools provided by the EditorsKit plugin.

New: Block Styles Manager

You can now easily create and manage all of your block styles with the new styles manager.

Rich Text Formats

EditorsKit also adds the missing text formats for better content creation. The following rich text formats are available upon plugin activation:

Glyphs and Special Characters

Insert special characters and symbols on Gutenberg editor at ease. Special characters are categorized and you can use the search field to find specific symbols.

Markdown Support

Starting EditorsKit 1.6, you can now use markdown on the Gutenberg editor while typing. Markdowns for *bold*, _italic_ and ~strikethrough~ are available upon plugin activation. Lists of available markdowns are also accessible on the settings menu.

Block Visibility

Using EditorsKit you will have the following visibility control in order to manage and display better content:

Estimated Reading Time

Word count is already available on Gutenberg editor. EditorsKit then extends this word count and displays the estimated count as well. Using roughly 275 words per minute plus additional calculations based on image blocks, you can display better estimated reading time on your posts and pages.

Powered by shortcode you can display the Estimated Reading Time on your content by using the code below.

[editorskit display="wordcount" before="Reading Time: " after=" min"]

Block Guide Lines

EditorsKit features other tools aside from visibility management. With the new Block Guide Lines, you can easily toggle visible guide lines on title and each editor block to check the element boundaries. This feature will also help your workflow on handling nested blocks.

Image and Cover Block Styles

Comes with a selection of styles on Cover and Image Block for custom shapes and layouts such as diagonal, circular, and rounder corners; and even add drop shadows.

List Block Additional Styles

Provides the following additional styling for list blocks:

Responsive Text Alignment

Easily change text alignment per device. This will help you provide different alignment views on mobile and tablet devices aside from the existing option for desktop.

Full Height Screen Option

Easily display selected blocks as a full screen layout by toggling “Full Screen Height” option under the advanced panel. You’ll instantly have a beautiful hero section by just using core blocks.

Toggle Title Visibility

Easily hide post, page or any post type’s title on your website in just a click. This will enable you to create full Gutenberg editor-driven posts and pages without getting “(No Title)” on your admin dashboard.

Block Import and Export

Export each block or selected blocks and reusable blocks directly in the editor; no need to navigate to a separate admin dashboard. You can then drag and drop exported JSON files on the editor and it will automatically be transformed into Gutenberg blocks, same goes with reusable blocks.

Better Custom CSS Class(es)

Huge improvement on Additional CSS Class(es) option! EditorsKit provides better UI with classes suggestions while typing. Powered with custom PHP filter, theme developers can include custom Utility Classes for more customization options.

Set Image Block as Featured Image

Enable the selected image block to be set as featured image easily using the block settings dropdown.

Drag and Drop Featured Image Upload

Easily upload or change the featured image on the Gutenberg editor by dragging and dropping image on the Featured Image sidebar panel.

Code Editor Mode Syntax Highlighter

Improve display when on “Code Editor Mode”. Powered by WordPress default CodeMirror library, Code Editor will be displayed with code syntax highlights and you will easily check each element and if there are any errors in your HTML codes.

Media and Text Block Link and Card Layout Option

Assign custom links to Images on the Media and Text Block. You can also set links to open in a new tab, add a nofollow, and/or set the link for the whole block. Additionally, you can set Media and Text Block to display as card layout with the option to set the image on top or bottom. Integrated perfectly with the toolbar layout selection.

Add Link to Cover, Group and Column Blocks

Assign links to cover, group, and column blocks at ease with the option to enable link attributes like open in a new tab, apply nofollow and/or sponsored rel value. Additionally, you can enable the extra option to apply hover animation.

Keyboard Shortcuts

EditorsKit adds the missing keyboard shortcuts from Classic Editor. When activated you can use the following shortcuts to easily save time and improve writing workflow:

Features Manager

Enable or disable EditorsKit features using the “EditorsKit Settings” menu. This will give you full control over the plugin features and let you disable features that you don’t need on your website.

Theme Supports for Developers

EditorsKit is moving toward being developer-friendly as well. Starting version 1.5, custom theme_supports were added to provide theme developers with the option to make Gutenberg block editing experiences for their users match the frontend display.

Accessible Help, Tips, and Tricks

Add help, tips, and tricks button on the bottom right side of the editor to help users discover several helpful power tips and shortcuts. These tips will definitely improve your workflow and save time navigating the new block editor.

ShareABlock block

Insert your downloads from shareablock.com easily using this block. Browse through your block patterns and templates then add them to your content in just a click.

Helping you with the new Gutenberg Editor

EditorsKit is created to help you navigate through the new editor. Each new feature will make your page building more convenient and easier.

Screenshots

Blocks

This plugin provides 2 blocks.

Installation

This section describes how to install the plugin and get it working.

e.g.

  1. Upload the full directory into your wp-content/plugins directory
  2. Activate the plugin at the plugin administration page
  3. That’s it! I hope you’ll love this plugin 🙂

Ratings

4.6 out of 5 stars.

Your review
See all reviews