Wordpress Gutenberg custom block
I try made custom block in wordpress gutenberg. I need create block like gallery but on output i need other html structur.
I write this code
var el = wp.element.createElement;
wp.blocks.registerBlockType('zlapchwile-gutenberg/custom-gallery-block', {
title: 'Custom gallery', // Block name visible to user
icon: 'images-alt2', // Toolbar icon can be either using WP Dashicons or custom SVG
category: 'media', // Under which category the block would appear
attributes: {
imgURL:{
type: 'string',
source: 'attribute',
attribute: 'src',
selector: 'img'
},
imgID:{
type: 'number'
}
},
edit: function() {
return (
); // End return
}, // End edit()
save: function(props) {
// How our block renders on the frontend
return el( 'section', { className: 'gallery-block grid-gallery' },
el( 'div', { className: 'mygallery' },
el( 'div', { className: 'item' },
el( 'a', { className: 'lightbox' },
el( 'img',
{
className: 'img-fluid image scale-on-hover'
},
)
)
)
)
); // End return
} // End save()
});
Topic block-editor gallery plugins Wordpress
Category Web