Block Lab

Description

IMPORTANT!

The Block Lab team has moved its custom block efforts over to Genesis Custom Blocks. To take advantage of all the great things about Block Lab as well as gain access to all new features as they are released, we recommend that you install Genesis Custom Blocks.

If you’re an existing Block Lab user and would like to learn more about what this means for you, including how to easily and automatically migrate to the new plugin, you can find more details here.

Gutenberg, the new WordPress editor, opens up a whole new world for the way we build pages, posts, and websites with WordPress. Block Lab makes it easy to harness Gutenberg and build custom blocks the way you want them to be built. Whether you want to implement a custom design, deliver unique functionality, or even remove your dependence on other plugins, Block Lab equips you with the tools you need to hit “Publish” sooner.

Features

A Familiar Experience

Work within the WordPress admin with an interface you already know.

Block Fields

Add from a growing list of available fields to your custom blocks.

Simple Templating

Let the plugin do the heavy lifting so you can use familiar WordPress development practices to build block templates.

Developer Friendly Functions

Simple to use functions, ready to render and work with the values stored through your custom block fields.

Links

  • WordPress.org
  • Github
  • Documentation
  • Support

Contributing

See Contributing to Genesis Custom Blocks.

Screenshots

  • screenshot-1-3

Installation

From Within WordPress

  • Visit Plugins > Add New
  • Search for “Block Lab”
  • Install the Block Lab plugin
  • Activate Block Lab from your Plugins page.

Manually

  • Clone Block Lab into a working directory with https://github.com/getblocklab/block-lab.git
  • cd into the block-lab directory, and run npm install && composer install
  • Next, build the scripts and styles with npm build
  • Move the block-lab folder to your /wp-content/plugins/ directory
  • Activate the Block Lab plugin through the Plugins menu in WordPress

FAQ

Q: Do I need to write code to use this plugin?

A: Although the plugin handles the majority of the work in building a custom block, you will need to build HTML templates to display the content of the block. You can learn how in the developer documentation.

Q: I have an idea for the plugin

A: This plugin is open source and can only be better through community contribution. The GitHub repo is here.

Q: Where can I find documentation for this plugin?

A: Here

Reviews

A nice tool for quick but simple Blocks

pattihis
August 14, 2020
I have been using it for quite some time and it does the job very well. It is a great tool it saves a lot of time but it needs a few more features to become excellent. For example:

There is no multisite support. Any changes must be done on every site (and I have 35). At least I can export and import the Blocks but still, a centralized management would be preferred.
Documentation says that Posts field supports CPT’s but this is not the case. It only supports either Posts or Pages. And those two can not be combined. It would have been nice to work with both Posts and Pages (and CPT), like the Link field of WordPress.
Checkboxes can not be grouped, for a nicer backend layout
No 33% column width option
No custom text/html can be added without a field. We might want to give instructions to our users or divide/group fields in the backend with titles/subtitles etc.
Pasting in Number fields is not possible. Gutenberg gets the pasted number and creates it as a paragraph block, outside of the custom Block. I am using text fields for numbers just to be able to paste id’s.
Duplicating Blocks keeps them connected. This might have some use, but it would be better if duplicating blocks would create an identical but stand alone block.

I know the team is working on future updates and I would be happy to reconsider my rating when time comes. Keep up the good work!

Super easy to use

computerwhiz
July 5, 2020
Admittedly, I never used blocks on my website. I would always just use custom HTML for every post because I have a few advanced elements that I needed to use HTML for.

Just started experimenting with blocks last week to try and improve the workflow of making posts and this plugin works really well to help me create and maintain the custom blocks that I need.

Awesome

Loosie94
June 11, 2020
Didn’t know about this plugin, but it makes it really easy to use custom Gutenberg Blocks. If you have to make then yourself, it quite hard to setup. Hope the pro version comes out soon though. Thanks!

Very useful plugin

Mladen Gradev
March 5, 2020
Thanks,
Gutenberg is now easier to work with.

Brilliant plugin – makes blocks a breeze

Martin Taylor
February 13, 2020
I found this plugin after struggling for a while with the custom approach, which mostly relies on JavaScript. Suddenly I’m able to progress and (importantly) use PHP instead of JS.
I really like that I can generate blocks programmatically, which allows (e.g.) select controls to be populated with values from the WP database rather than hard-coded.
It’s also good to see that I can use the block values to generate a shortcode, which helps to make them easier for users to manage.
The templating system for output is neat, and like I said, it means that I can use my PHP/WP skills instead of having to rely on complex JS.
Thanks to the authors, and I look forward to seeing how the plugin develops.

Awesome

pankaj.sakaria
February 7, 2020
Really great plugin and easy to use. Nice plugin to create custom gutenberg blocks.