Instantly share code, notes, and snippets.
Created
March 1, 2022 09:57
We needed the yoast-seo breadcrumbs block to have alignwide. This is how we did it.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
/** | |
* Add our action to modify the registered yoast seo breadcrum block. | |
* Note the priority. Yoast registeres their blocks at priority 11, so we need to be | |
* higher than that. | |
*/ | |
add_action( 'init', array( $this, 'modify_yoast_breadcrumbs_block' ), 12 ); | |
/** | |
* Modify the output of the Yoast Breadcrumbs block. | |
*/ | |
add_filter( 'render_block_yoast-seo/breadcrumbs', array( $this, 'modify_yoast_breadcrumbs_block_output' ), 10, 2 ); | |
/** | |
* Modify the Yoast Breadcrumbs block to use the custom template. | |
* | |
* @return void | |
*/ | |
function modify_yoast_breadcrumbs_block() { | |
/** | |
* Get the block type registry. | |
*/ | |
$registry = WP_Block_Type_Registry::get_instance(); | |
/** | |
* Get the yoast-seo breadcrumbs block. | |
*/ | |
$breadcrumbs_block = $registry->get_registered( 'yoast-seo/breadcrumbs' ); | |
/** | |
* Modify the block supports. | |
*/ | |
$breadcrumbs_block->supports['align'] = array( 'wide' ); | |
} | |
/** | |
* Modify the Yoast Breadcrumbs block output to use the custom template. | |
* This is a filter for the `render_block` hook. | |
* | |
* @param string $block_content The block content. | |
* @param array $block The block. | |
*/ | |
function modify_yoast_breadcrumbs_block_output( $block_content, $block ) { | |
/** | |
* Initialize the DOMDocument. | |
*/ | |
$doc = new DOMDocument(); | |
/** | |
* Load the block content into a DOMDocument. | |
* We cannot just load the block content as is, as it will be cast as ISO-8859-1. We need to | |
* tell the DOMDocument to use UTF-8. | |
*/ | |
$doc->loadHTML( '<?xml encoding="utf-8" ?>' . $block_content ); | |
/** | |
* The DOMElement for the breadcrumbs block. | |
* | |
* @var \DOMNode|\DOMElement $breadcrumbs_block | |
*/ | |
$breadcrumbs_block = $doc->getElementsByTagName( 'div' )->item( 0 ); | |
/** | |
* The class attribute. | |
* | |
* @var string $class_names | |
*/ | |
$class_names = $breadcrumbs_block->getAttribute( 'class' ); | |
/** | |
* The alignment for this block. | |
* | |
* @var string|null $align | |
*/ | |
$align = $block['attrs']['align'] ?? null; | |
/** | |
* Add needed classes. | |
*/ | |
$class_names = classNames( | |
$class_names, | |
array( | |
'align' . $align => ! empty( $align ), | |
) | |
); | |
/** | |
* Set the new class attribute. | |
*/ | |
$breadcrumbs_block->setAttribute( 'class', $class_names ); | |
/** | |
* Get the breadcrumbs block content. | |
* | |
* @var string $block_content | |
*/ | |
$block_content = $doc->saveHTML( $breadcrumbs_block ); | |
return $block_content; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment