I build a small TOC plugin with a ServerSideRender component. It's an open-source hobby project to understand Gutenberg better: https://wordpress.org/plugins/simpletoc/ Now I would like to add attributes to the block to toggle options like "disable title". A few months ago with your help here I managed to make the plugin work, but it sends "fake attributes". In my case, this is only a date.
My understanding of ServerSideRender is that the plugin get its contents from the php part via ajax. But attributes are saved in the markup. Source: https://developer.wordpress.org/block-editor/tutorials/block-tutorial/introducing-attributes-and-editable-fields/ But since my plugin does not generate the markup via js but via php is it still possible to add custom attributes?
Here is the block part with the "send fake attributes" function that works:
function sendfakeAttribute(props) {
// this acuallty triggers the ServerSideRender again ¯\_(ツ)_/¯
props.setAttributes({ updated: Date.now()});
}
registerBlockType('simpletoc/toc', {
title: __('SimpleTOC', 'simpletoc'),
icon: simpletocicon,
category: 'layout',
edit: function(props) {
return [
el(
BlockControls, { key: 'controls' },
el( Toolbar, null,
el(
IconButton, {
className: 'components-icon-button components-toolbar__control',
label: __('Update table of contents', 'simpletoc'),
onClick: function() {
sendfakeAttribute(props)
},
icon: 'update'
}
)
)
),
el(
'p', { className: props.className },
el(
ServerSideRender, {
block: props.name,
attributes: props.attributes
}
)
)
];
},
save: props => {
return null;
},
});
But when I add this below registerBlockType how does it save the values? Am I stuck by using SSR? Or is the selector something like <serversiderender>
in the attributes section here.
registerBlockType('simpletoc/toc', {
title: __('SimpleTOC', 'simpletoc'),
icon: simpletocicon,
attributes: {
disabletitle: {
type: 'boolean',
source: 'children',
selector: 'serversiderender'
}
},
category: 'layout',
edit: function(props) {