Whitelist a single SVG for use in post_content

The question changed somewhat to what was asked – however thought this might be useful if some other mug gets carried away with react in their save functions.

So – this was solved as @Tom J Nowell suggested and a PHP callback was made instead to allow the save instead. I deprecated the block and removed the SVG from the save function so that the save function inside the deprecation included the SVG and the new one didn’t.

So old blocks would not show the SVG twice, but new blocks could get migrated I ended up forcing an attribute set in the migration of the block – under the block deprecation function remembering to declare the new blockVersion attribute in the new version of the block registration – I set the default value as null for both PHP and JS side of block registration.

migrate( attributes ) {
    attributes.blockVersion = '2.0.0';
return { ...attributes }

Under the render_callback function I only rendered the SVG server side if a version attribute of ‘2.0.0’ was picked up. Like below:

/**
 * Callback function to render the block on the front end
 *
 * @since 2.0.0
 * @param Array  $attributes  Array of block attributes
 * @param String $content     Block content
 *
 * @return String HTML
 */
function render_block( $attributes, $content ) {
    if ( ! empty( $attributes['blockVersion'] ) && version_compare( $attributes['blockVersion'], '2.0.0', '>=' ) ) {
        $arrow_colour = esc_attr( $attributes['svgColor'] );
        $position     = esc_attr( $attributes['position'] );
    
        $svg = "<svg aria-hidden='true' role="img" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox='0 0 20 20' style="color:$arrow_colour;fill:$arrow_colour" class="dashicon dashicons-arrow-down-alt2 arrow-side-$position"><path d='M5 6l5 5 5-5 2 1-7 7-7-7z'></path></svg>";
    
        return "
        <div class="wp-block-namespace-blockname">
            $svg
            $content
        </div>";

    } else {
        return $content;
    }
}

Finally in the edit function of the block – I used setAttribute() to set the attribute to ‘2.0.0’ so new blocks would always have a non-default value of the block version in the content. This allows PHP to pick up the different version.

Related Posts: