-
Notifications
You must be signed in to change notification settings - Fork 13
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Allow previewing InnerBlocks
in the block editor
#114
Conversation
@@ -135,6 +125,10 @@ const Edit = ( { block, blockProps } ) => { | |||
attributes={ blockProps.attributes } | |||
className="genesis-custom-blocks-editor__ssr" | |||
httpMethod="POST" | |||
urlQueryArgs={ { inner_blocks: innerBlocks |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
<ServerSideRender />
has no native way to pass it the InnerBlocks HTML.
So it used to not render the InnerBlocks.
As a workaround, we pass the InnerBlocks to the urlQueryArgs
prop.
Then, we look for that query arg in InnerBlocks::validate()
with filter_input()
.
InnerBlocks
in the block editorInnerBlocks
in the block editor
Hi @mikemcalister, |
|
||
return empty( $content ) | ||
? urldecode( filter_input( INPUT_GET, 'inner_blocks', FILTER_SANITIZE_STRING ) ) | ||
: $content; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There will still be escaping in block_field()
if they call that.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks great Ryan! Thanks for the detailed testing instructions. 👏
@mikemcalister, thanks a lot for reviewing and approving this! |
Here's a |
Fixes #96 and GF-3302
Changes
InnerBlocks
in the block editor, where there was no preview before. This is an often-mentioned bug.InnerBlocks
Testing Instructions
composer i && npm i && npm run dev
/wp-admin
> Custom Blocks > Add New{{new-field}}
: