Displaying images from a relationship field

• roberthindle

• January 21, 2021 at 3:55 am

Hello.

My objective is to create a link that includes imagery for another page (a ‘teaser’).

Whereas I can obtain the post object data for the other page, I cannot obtain any of the imagery that exists on that page. This imagery exists in ACF blocks on that page.

So… For example.
On my Homepage I want to add a block containing a relationship field that I use to select Post1.

On the homepage I want to show the first image displayed on Post1, along with it’s page title and a link to it.

The images on Post1 are in ACF Blocks using an ACF image field.

I cannot seem to get this information.

In Block template:

$featured_page = get_field('featured_page'); //returns ID
$post = get_post(featured_page); 
$post_content = esc_html($post->post_content) ;
print_r($post_content);

Returns:

<!– wp:paragraph –> <p>Hello I am a wordpress paragraph.</p> <!– /wp:paragraph –> <!– wp:acf/text { “id”: “block_6006dfd2c7bd0”, “name”: “acf\/text”, “data”: { “block_size”: “1”, “_block_size”: “field_600598976d172”, “block_height”: “1”, “_block_height”: “field_6006dcd9995c5”, “text”: “i am text”, “_text”: “field_60059ea8de6d3” }, “align”: “”, “mode”: “preview” } /–> <!– wp:acf/html5-video { “id”: “block_6001be864c2b1”, “name”: “acf\/html5-video”, “data”: { “block_size”: “2”, “_block_size”: “field_600598976d172”, “block_height”: “2”, “_block_height”: “field_6006dcd9995c5”, “html5_video”: “https:\/\/vimeo.com\/472312157”, “_html5_video”: “field_6001bfb1e7116” }, “align”: “”, “mode”: “preview” } /–> <!– wp:acf/page { “id”: “block_600851c8dd8aa”, “name”: “acf\/page”, “data”: { “block_size”: “1”, “_block_size”: “field_600598976d172”, “featured_page”: [ “1” ], “_featured_page”: “field_60019ecd10af8” }, “align”: “”, “mode”: “preview” } /–> <!– wp:acf/text { “id”: “block_6005a7735a261”, “name”: “acf\/text”, “data”: { “block_size”: “1”, “_block_size”: “field_600598976d172”, “text”: “Thats the way we like to do it always. And i am rext\r\n\r\n “, “_text”: “field_60059ea8de6d3” }, “align”: “”, “mode”: “edit” } /–> <!– wp:acf/image { “id”: “block_6005bdd415fa0”, “name”: “acf\/image”, “data”: { “block_size”: “1”, “_block_size”: “field_600598976d172”, “image”: 89, “_image”: “field_60059e91e4284” }, “align”: “”, “mode”: “preview” } /–> <!– wp:acf/image { “id”: “block_60059ee53d2a2”, “name”: “acf\/image”, “data”: { “block_size”: “2”, “_block_size”: “field_600598976d172”, “block_height”: “1”, “_block_height”: “field_6006dcd9995c5”, “image”: 91, “_image”: “field_60059e91e4284” }, “align”: “”, “mode”: “preview” } /–> <!– wp:acf/image { “id”: “block_6005a5b57118c”, “name”: “acf\/image”, “data”: { “block_size”: “1”, “_block_size”: “field_600598976d172”, “image”: 90, “_image”: “field_60059e91e4284” }, “align”: “”, “mode”: “preview” } /–> <!– wp:acf/image { “id”: “block_6005e16015fa1”, “name”: “acf\/image”, “data”: { “block_size”: “3”, “_block_size”: “field_600598976d172”, “block_height”: “1”, “_block_height”: “field_6006dcd9995c5”, “image”: 92, “_image”: “field_60059e91e4284” }, “align”: “”, “mode”: “preview” } /–> <!– wp:acf/image { “id”: “block_6006e67cc7bd1”, “name”: “acf\/image”, “data”: { “block_size”: “1”, “_block_size”: “field_600598976d172”, “block_height”: “1”, “_block_height”: “field_6006dcd9995c5”, “image”: 89, “_image”: “field_60059e91e4284” }, “align”: “”, “mode”: “preview” } /–>

How do I obtain the imagery from say, the first block on that page that contains an image; or say from the first three?

Thanks!
Rob