Block registration in Wordpress - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to register a new block in WordPress.

Wordpress

register_block_type([1]);

Drag options to blanks, or click blank then click option'

AblockType

Bmy-plugin/my-block

CregisterBlockType

D'my-plugin/my-block'

Attempts:

3 left

💡 Hint

Common Mistakes

Forgetting to put quotes around the block name.

Using camelCase function names instead of the correct PHP function.

The register_block_type function requires the block name as a string, including the namespace and block name separated by a slash.

2fill in blank

medium

Complete the code to enqueue the block's editor script during block registration.

Wordpress

register_block_type('my-plugin/my-block', { 'editor_script': [1] });

Drag options to blanks, or click blank then click option'

Amy-block-editor-script

B'my-block-editor-script'

Cenqueue_script

DeditorScript

Attempts:

3 left

💡 Hint

Common Mistakes

Using the script handle without quotes.

Passing a function or variable instead of a string handle.

The editor_script property expects the handle of the registered script as a string, so it must be quoted.

3fill in blank

hard

Fix the error in the block registration code by completing the missing property.

Wordpress

register_block_type('my-plugin/my-block', { 'render_callback': [1] });

Drag options to blanks, or click blank then click option'

A'render_block_function'

Brender_block_function

C'renderCallback'

DrenderCallback

Attempts:

3 left

💡 Hint

Common Mistakes

Passing the function name without quotes, causing a PHP syntax error.

Using camelCase property names instead of snake_case.

The render_callback property expects a string containing the name of the function (callable by name) to render the block on the server side.

4fill in blank

hard

Fill both blanks to register a block with a style and script.

Wordpress

register_block_type('my-plugin/my-block', { 'style': [1], 'script': [2] });

Drag options to blanks, or click blank then click option'

A'my-block-style'

B'my-block-script'

Cmy-block-style

Dmy-block-script

Attempts:

3 left

💡 Hint

Common Mistakes

Passing handles without quotes.

Mixing up style and script handles.

The style and script properties expect the handles of the registered style and script as strings.

5fill in blank

hard

Fill all three blanks to register a block with editor style, editor script, and render callback.

Wordpress

register_block_type('my-plugin/my-block', { 'editor_style': [1], 'editor_script': [2], 'render_callback': [3] });

Drag options to blanks, or click blank then click option'

A'my-block-editor-style'

B'my-block-editor-script'

C'render_my_block'

DrenderBlock

Attempts:

3 left

💡 Hint

Common Mistakes

Not quoting the render callback function name.

Using incorrect handles or missing quotes for style and script.

The editor_style and editor_script properties require string handles of registered assets, while render_callback requires a string with the function name (callable).