The Gutenberg-Editor of wordpress works with blocks that are marked by HTML comments, i.e. <!-- wp:heading --><h2>My Heading block</h2><!-- /wp:heading -->.
I can inject such a block using the API into an article and it works. But for some reason, I don't see the comments in to DOM, even that I activated the display comments section in Chrome. Is there a way how to see the full blocks including the HTML comments that mark those blocks?
For context: I write a python library to create content programmatically, but the sparse documentation makes it hard to find the right syntax. So I am also interested in comments that provide good Links to better documentation or content to understand how those blocks have to look like in detail. The best I found right now is this tutorial.
The HTML comments in question are the blocks' save markup which is created from the static block content when a post/page is saved from the Editor.
The easiest way to see the actual markup saved (if you want to copy/paste block code) is to create a new post/page in the Editor and add the blocks you need, then change the Editor mode to Code Editor (
Ctrl+Shift+Alt+M). Note: this method works best for static blocks - dynamic blocks usually just store attributes or sometimes nothing as they are dynamically rendered.To better understand the process of how the blocks are rendered on the front end, read through the function do_blocks() and how it uses parse_blocks() and render_block() (although its in PHP, still may be helpful to you).
Given your programming in Python, I'd recommend using the REST API for Block Types to get all the required blocks attributes to programmatically construct valid blocks, eg:
Addition arguments and examples can be found in the Documentation.