tdesero

<p>Use the function <code>add_fast_block</code> to add a block to your theme in PHP. The Plugin automatically creates an interface for your block inside the editor.<br />
Unlike the default block behaviour all blocks are rendered dynamically. This means changes inside the template are shown immediately without resaving the post or page.</p>
<h3>Example Usage</h3>
<p>Register your block:</p>
<pre><code>$options = [
  'name'      => 'some-slug/block-name',
  // template from theme-directory
  'template'  => '/blocks/test.php',
  'settings'  => [
    // same settings as the original "wp.registerBlockType" without attributes.
    'title'   => 'Plugin Block',
  ],
  'fields'    => [
    // define attributes and inputs/labels etc. that are needed.
    'headline'  => [
      'label'    => 'My Label',
      'type'     => 'string',
      'input'      => 'text',
      'default'  => 'default string',
      'width' => 0.5, // optional for all fields except repeater
      // optional selector: useful fallback if dynamic rendering does not work. Also good for WP SEO PLugins.
      'selector' => 'h2',
    ],
    'text'  => [
      'label'    => 'Some Text',
      'type'     => 'string',
      'input'      => 'richText',
      'default'  => 'default string',
    ],
    'image'   => [
      'label'   => 'Label for the Upload Button',
      'type'    => 'object',
      'input'   => 'image',
      'default' => [
        'url'   => 'image.jpeg',
        'alt'   => 'Alternative Text',
        'sizes' => []
      ]
    ],
    'bgColor' => [
      'label'   => 'Background',
      'type'    => 'string',
      'default' => 'light',
      'input'     => 'select',
      'options' => [
        ['label' => 'light', 'value' => 'light'],
        ['label' => 'dark', 'value' => 'dark'],
      ]
    ],
    'someBool' => [
      // ...
      'type'    => 'boolean',
      'input'   => 'checkbox',
    ],
    'someArray' => [
      // ...
      'type' => 'array',
      'default' => [],
      'input' => 'repeater',
      'query' => [
        'subField1' => [
          'type' => 'string',
          'input' => 'text',
          'default' => 'default list item',
        ],
        'subField2' => [
          'type' => 'boolean',
          'input' => 'checkbox',
          'default' => true,
        ],
      ]
    ]
  ]
];

add_fast_block( $options );
</code></pre>
<p>Available inputs: <code>text</code>, <code>richText</code>, <code>checkbox</code>, <code>toggle</code>, <code>select</code>, <code>image</code>, <code>url</code>, <code>email</code>, <code>date</code>.<br />
At the moment default values are mandatory.</p>
<p>Example usage inside template:</p>
<pre><code><div>
  <h2><?php $block->field('headline'); ?></h2>
  <img src="<?php echo $block->field_value('image')['url']; ?>">
</div>
</code></pre>
<p>For <code>$block->field</code> function sanitizing is done with <code>wp_kses_post</code>. If you need more complex sanitizing, use <code>$block->field_value</code>, sanitize on your own and <code>echo</code> the value afterwards.</p>


Fast Blocks

Create Custom Blocks fast and easy with PHP only.

Ataur R

XpeedStudio

Emran

Roxnor

Mainul Kabir Aion

GutenKit – Page Builder Blocks, Patterns, and Templates for Gutenberg Block Editor

GutenKit – Ultimate no-code Gutenberg blocks to design stunning web pages and visually stunning posts in WordPress block editor.

Fast Blocks vs GutenKit – Page Builder Blocks, Patterns, and Templates for Gutenberg Block Editor