Access Node image within Page template I need to access a Node's image field within the page.twig.html template in order to display it in relation to certain page-level elements such as primary/secondary menus and the page title.

In node.html.twig, I'm able to access it like so:

{{ content.field_responsive_hero_image.0 }}


but in page.html.twig if I try

{{ node.field_responsive_hero_image.0 }}


I get the following error:

Exception: Object of type Drupal\image\Plugin\Field\FieldType\ImageItem cannot be printed


I'm familiar with the workaround of loading the image with

&lt;img src="{{file_url(node.field_responsive_hero_image.entity.fileuri)}}" /&gt;


However, I then lose the title and alt attributes (bad for 508 compliance) as well as the automatic resizing of the image served based on screen size (bad for SEO rankings).

How do I access the Node's image at a page-level?
In a preprocess hook (preferred):

/**
 * Implements hook_preprocess_HOOK() for page.html.twig.
 */
function MYTHEME_preprocess_page(&amp;$variables) {
  if (isset($variables['node'])) {
    $variables['image'] = $variables['node']-&gt;get('field_image')-&gt;first()-&gt;view('full');
  } 
}


Or in Twig:

{{ node.field_image.0|view('full') }}


To use |view install the module https://www.drupal.org/project/twig_tweak