I am trying to create a custom block for Gutenberg. So I tried something simple as this:
JS File:
var el = wp.element.createElement;
wp.blocks.registerBlockType('test/blocks', {
title: 'Test Blocks',
icon: 'smiley',
category: 'common',
attributes: {
content: {type: 'string'}
}
},
edit: function(props) {
return
el( 'div', {},
el( 'p', {}, window.wp.i18n.__( 'Hello World!!!' ) )
);
},
save: function(props) {
return
el( 'div', {},
el( 'p', {}, window.wp.i18n.__( 'Hello World!!!' ) )
);
})
The js file is part of a plugin I made and it gets loaded by the .php file. The problem is it doesn't even appear as a block option inside the Gutenberg editor. So my questions are:
- What's wrong with my current code?
- How can I add some fields? TextEdit, Button, etc?
- Is it possible to have multiple fields like a repeater?
- Why everyone makes a plugin for this? Why not just load the js file from functions.php?