By default the tag-cloud block in the (Gutenberg) block-editor renders a root element as follows:

<p class="wp-block-tag-cloud">...</p>

This is the corresponding code what is renders the block: https://github.com/WordPress/WordPress/blob/master/wp-includes/blocks/tag-cloud.php#L44

Filtering with pre_render_block doesn't work.

Any idea how to filter this root element of this block?

1 Answer 1


Figured it out myself after all.

Instead of using the pre_render_block filter, use the render_block filter to do something like this:

add_filter('render_block', function($html, $block) {
    if ($block['blockName'] !== 'core/tag-cloud') {
        return $html;

    $ps = iterator_to_array($doc->getElementsByTagName('p'));
    $p = empty($ps) ? new \DOMElement('p') : current($ps);

    return replaceChild($doc, $p, 'div', ['class' => 'tags'])->saveHTML();
}, 10, 2);

function replaceChild(\DOMDocument $doc, \DOMElement $target, string $tag, array $attrs = []) {
    $replacement = $doc->createElement($tag);

    if (!empty($attrs)) {
        foreach ($attrs as $key => $value) {
            $replacement->setAttribute($key, $value);

    if ($target->hasChildNodes()) {
        $children = iterator_to_array($target->childNodes);
        foreach ($children as $child) {

    $target->parentNode->replaceChild($replacement, $target);

    return $doc;

This should yield something like <div class="tags">...</div>.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.