Laurent
Laurent

Reputation: 1048

Alter rendering of core Gutenberg-block in WordPress

I came across this answer to modify core block rendering by using the getSaveElement filter. The code is as follow:

function modifyGetSaveContentExtraProps( element, blockType, attributes ) {
    return (
        <div className = 'heading-wrapper' >
            { element }
        </div>
    );
}


wp.hooks.addFilter(
    'blocks.getSaveElement',
    'slug/modify-get-save-content-extra-props',
    modifyGetSaveContentExtraProps
);

That works in the frontend, the rendering is altered, but in the block editor it still uses the default block rendering.

How can I have the block editor also reflect/refresh the changes ?

Upvotes: 0

Views: 770

Answers (1)

AmintaCode
AmintaCode

Reputation: 364

    function modifyBlockEdit( editComponent ) {
         return (
            <div className = 'heading-wrapper' >
              { editComponent }
           </div>
     );
   }

     wp.hooks.addFilter(
       'blocks.blockEdit',
       'slug/modify-blockEdit',
       modifyBlockEdit
      );

Upvotes: 1

Related Questions