Gutenberg Blocks

Last Updated on April 18, 2020 by Neil Murray

We are starting to see several plugins creating Blocks for Gutenberg.

Google Maps

Ninja Forms

Many so far are simple replacement for existing Shortcodes that can be still be used concurrently with the Classic Editor.

Some are however are providing significant JS based controls within the Block.

Please add any Gutenberg Blocks you find and your Comments to this post.

Notes:

Update

WordPress theme developer Danny Cooper has built a centralized library of Gutenberg blocks that are currently available to extend the new editor.

CF7 Skins

This could be significant for CF7 Skins – how could we provide similar interaction with CF7 forms directly within the Gutenberg Editor.

Neil Murray

Adding Visual for users

Last Updated on October 21, 2018 by Neil Murray

I’ve been thinking about what will happen to existing CF7 Skins users, when we add CF7 Skins Visual to the plugin they have been using – either free or pro with add-ons.

Contact Form 7 Skins (free version) currently has 20,000+ active installs.

When we add CF7 Skins Visual to this free version, 20,000+ existing users will get the CF7 Skins Visual interface added to Contact Form 7, whenever they update Contact Form 7 Skins.

These existing users will then see the extra Form Tab, added in the Skins metabox (with the Visual interface), for the first time, whenever they create or edit a CF7 form.

That’s 20,000+ people who are going to have a new experience at some time.

The Contact Form 7 user interface (UI), with the free version CF7 Skins installed, will go from this:

to this:

I expect these users will ask at least some of the following questions:

  • what is this?
  • what does it do?
  • should I use this?
  • can this help me?
  • how do I use this?

We need to provide a mechanism to answer these questions quickly & easily in a way that provides both assurance & encouragement to  existing users.

While some users will have read or heard about our adding a drag&drop visual interface to CF7 Skins ( & thus to Contact Form 7 ), we can’t count on that.

What you you think? How should we do this? Please add your Comments to this post.

Update

Version 1 – 2018-06-19



create-guten-block – a developer toolkit for building Gutenberg block plugins

Last Updated on September 20, 2018 by Neil Murray

I recommend we follow/watch create-guten-block.

Neil Murray Feb. 13 2018

create-guten-block – a zero-configuration #0CJS developer toolkit for building WordPress Gutenberg block plugins

Some articles on using create-guten-block:

Other useful articles:

Why create-guten-block?

Well, it’s really hard to configure things like Webpack, React, ES 6/7/8/Next, ESLint, Babel, etc. before you even start writing a Hello World gutenberg block. Then there’s the fact that you have to maintain and constantly update your configuration with all the new tools and growth in the JavaScript community.

create-guten-block hides all this configuration away in an optimized package that we call cgb-scripts. This package is the only dependency in your projects. We keep cgb-scripts up to date while you go ahead and create the next best WordPress themes and plugins.

Use kb-dev.cf7skins.com for most initial documentation work

Last Updated on October 21, 2018 by Neil Murray

I think we should avoid using cf7skins-test.project.buzztoned.com for initially creating blog posts. Rather we should just use kb-dev.cf7skins.com as we do for most other changes to pages, posts & faq.

I originally did this so we were using the same theme as the live blog. I’ve found we can easily make any necessary changes when we schedule the post on the live site.

All blog posts eventually also get published on kb.cf7skins.com so they need to look OK on both the themes we currently use.

What you you think? Please add your Comments to this post.

Update

  • we no longer use cf7skins-test.project.buzztoned.com at all
  • we use blog.cf7skins.com & blog-dev.cf7skins.com when creating new blog posts
  • blog posts no longer get published on kb.cf7skins.com