Ask any question about WordPress here... and get an instant response.

How can I create a custom Gutenberg block without using a plugin?

Asked on Oct 16, 2025

Answer

Creating a custom Gutenberg block without using a plugin involves adding code directly to your theme's files. This requires a combination of PHP and JavaScript to register and define the block. Here's a basic overview of how to achieve this.

<!-- BEGIN COPY / PASTE -->
    // Add this to your theme's functions.php
    function my_custom_block() {
      wp_register_script(
        'my-block-script',
        get_template_directory_uri() . '/js/my-block.js',
        array('wp-blocks', 'wp-element', 'wp-editor'),
        filemtime(get_template_directory() . '/js/my-block.js')
      );

      register_block_type('mytheme/my-custom-block', array(
        'editor_script' => 'my-block-script',
      ));
    }
    add_action('init', 'my_custom_block');
    <!-- END COPY / PASTE -->

Additional Comment:

Create a JavaScript file (e.g., my-block.js) in your theme's js directory to define the block's behavior and appearance.
Ensure your JavaScript file uses the WordPress block editor's APIs to register the block.
Use enqueue functions to load scripts and styles only when needed.
Test the block thoroughly to ensure it works as expected in the Gutenberg editor.

✅ Answered with WordPress best practices.

Ask any question about WordPress here... and get an instant response.

How can I create a custom Gutenberg block without using a plugin?

Asked on Oct 16, 2025

Answer

The Q&A Network