3

Usually find what I need from here without asking but seem to have run into something new, apologies if this has been answered elsewhere. I am building a site in wordpress which isn't my usual CMS but seems straight forward enough. I'm trying to get the post data using the API accessing the data at /wp-json/wp/v2/pages/24 which is great until we get to the actual content itself. The block/page content comes only as fully rendered with html. I tried using different context but this seems to either do nothing or throw a permissions error.

What I'm looking for is something along the lines of the below but cant seem to find that anywhere. Is this just not what's available or am I missing the point of this API all together? Any help would be great!

"content": {
"blocks": {
  "cover": {
    "classes": "wp-block-cover has-background-dim",
    "background-image": "https:\/\/localhost.local:8890\/wp-content\/uploads\/2020\/07\/92977310_Preview.jpeg",
    "content": "Our Range Title"
  },
  "image": {
    "classes": "wp-block-image",
    "image": "https:\/\/localhost.local:8890\/wp-content\/uploads\/2020\/07\/976545678.jpeg",
    "alt": "This is the alt for the image"
  },
  "layout": {
    "classes":  "background-green",
    "columns": 2,
    "content": [
      {
        "image": {
          "classes": "wp-block-image",
          "image": "https:\/\/localhost.local:8890\/wp-content\/uploads\/2020\/07\/976545678.jpeg",
          "alt": "This is the alt for the image"
        },
        "paragraph": {
          "classes": "",
          "content": "This is the <strong>paragraph for</strong> the left column."
        }
      },
      {
        "image": {
          "classes": "wp-block-image",
          "image": "https:\/\/localhost.local:8890\/wp-content\/uploads\/2020\/07\/976545678.jpeg",
          "alt": "This is the alt for the image"
        },
        "paragraph": {
          "classes": "",
          "content": "This is the <strong>paragraph for</strong> the right column."
        }
      }
    ]
  }
},
"protected": false

}

1 Answer 1

1

Very old question, but if anyone is stumbling around the Wordpress Rest API like I am, here's a quick snippet you can add to the functions.php file on your theme to add a blocks field on the return post/page data.

add_action(
    'rest_api_init',
    function () {

        if ( ! function_exists( 'use_block_editor_for_post_type' ) ) {
            require ABSPATH . 'wp-admin/includes/post.php';
        }

        // Surface all Gutenberg blocks in the WordPress REST API
        $post_types = get_post_types_by_support( [ 'editor' ] );
        foreach ( $post_types as $post_type ) {
            if ( use_block_editor_for_post_type( $post_type ) ) {
                register_rest_field(
                    $post_type,
                    'blocks',
                    [
                        'get_callback' => function ( array $post ) {
                            return parse_blocks( $post['content']['raw'] );
                        },
                    ]
                );
            }
        }
    }
);

Resulting in the following JSON being returned from fetching a single post:

"blocks": [
        {
            "blockName": "core\/paragraph",
            "attrs": [],
            "innerBlocks": [],
            "innerHTML": "\n<p>Here is the story content for section 1.<\/p>\n",
            "innerContent": [
                "\n<p>Here is the story content for section 1.<\/p>\n"
            ]
        },...

Your Answer

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

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