New Highlighted Text & Background Color, Justify and Underline Formats; Disable Auto Save, Theme Support in EditorsKit 1.5

New Highlighted Text & Background Color, Justify and Underline Formats; Disable Auto Save, Theme Support in EditorsKit 1.5

Since the rebranding of Block Options to EditorsKit, I’ve been working on more features to extend Gutenberg Block Editor. This latest release contains more rich text format and controls for better content creation. I’ve also added option to toggle Auto Saving and custom theme support for block sizes. Most of these features are the ones I needed the most and hopefully you, too.

Take a closer look on the brand new features for version 1.5 👀

Highlighted Text Color and Background Color

Adding text and background color to highlighted text or heading is the most requested rich text control I have so far. It’s also one of my most used controls on Tiny MCE to make certain text stand out. I’m really excited to finally manage adding this option to Gutenberg perfectly.

Add Text and Background Color to Gutenberg Highlighted Text or Heading Blocks

Add Text and Background Color to Gutenberg Highlighted Text or Heading Blocks

Paragraph Justify Alignment and Underline Text Formats

Aside from color highlights, it’s also a necessity for some to add underline to selected text. AlignmentToolbar is also missing justify text alignment for some reasons. In this version I’ve decided to bring these formats to Gutenberg Editor.

Paragraph Justify Alignment and Underline Text Formats

Enable or Disable Auto Save

Enable or Disable Gutenberg Auto Save
Enable or Disable Gutenberg Auto Save

I’ve experienced some problems with regards to Auto Saving and needed to disable this sometimes. If you are having one of the following issues, then I highly suggest to toggle the Auto Saving.

This issue: 

Editor freezes while you are writing or adding contents;

and this one that Jay @wpdevlife replied to my tweet:

I’ve seen users leave their browser tab open all night and their session expires, but the autosaves continue to post even though it’s now getting a 403. Then when the person wakes up their server blacklisted their IP.

Theme Support to Change Blocks Width to Match Page Template and Layout

This feature is to provide theme developers option to make Gutenberg block editing experience for their theme users match the frontend display.  I’ve created editorskit-template-block-sizes theme support to be able to add block sizes based on the page template selected. When user changes the page template, it will add custom body class and will set different block sizes for default, wide and full width. Here’s how the theme_support works :

Change Blocks Width to Match Page Template
Change Blocks Width to Match Page Template

I’ve been using Genesis Framework for a long time and I’ve decided to create separate theme_support to Genesis Layouts.

I’ll be releasing a separate article to explain how these theme supports work. 😉

Upvote on ProductHunt 🙏

With all the features added on EditorsKit, I feel like it’s time to add the plugin on ProductHunt. Please do upvote and don’t forget to share the news that the free Gutenberg Toolkit plugin is now available for hunters.

EditorsKit - WordPress Editor Toolkit - Page Building Toolkit for the Gutenberg Block Editor. | Product Hunt Embed

Onwards

As promised, EditorsKit will provide more Gutenberg Toolkit aside from visibility management. These new formats and features are only few of those toolkits. I already have a lot of upcoming features development plans that you can follow on Github or download EditorsKit on WordPress.org . I’ll really appreciate the stars on the repository, too! 😇 If you have any suggestions, feel free to let me know via comment below. Happy building!

Leave a Reply

Your email address will not be published. Required fields are marked *

Up Next:

How to Create Custom Text Formats for Gutenberg Block Editor

How to Create Custom Text Formats for Gutenberg Block Editor