Saya hanya perlu melakukan ini juga. Pendekatan yang tepat di sini adalah untuk menyimpan URL gambar dari gambar gaya ke dalam variabel (melalui fungsi preproses), dan kemudian variabel itu akan tersedia di file ranting Anda.
Saya telah menulis sebuah fungsi yang akan mendapatkan file field_image dan mengembalikan nama file asli, atau jika Anda menentukan nama gaya, itu akan mengembalikan URL dari gambar gaya.
Di dalam .theme
file saya :
function MYTHEME_preprocess_node(&$vars) {
//get thumbnail images from field_image
$vars['field_image_url'] = _var_image_url($vars, 'field_image', 'thumbnail');
}
//pull image field URL (original or styled)
function _var_image_url($vars, $field, $style_name = '') {
if (!empty($vars['elements'][$field]['#object'])) {
$fields = $vars['elements'][$field]['#object']->getFields();
$image = $fields[$field]->getValue();
if (!empty($image[0]['target_id'])) {
$file = \Drupal\file\Entity\File::load($image[0]['target_id']);
$uri = $file->getFileUri();
if(!empty($style_name)) {
$url = \Drupal\image\Entity\ImageStyle::load($style_name)->buildUrl($uri);
return $url; //the styled URL
} else {
return file_create_url($uri); //original
}
}
}
return false;
}
Sekarang di file ranting saya (node.html.twig, karena saya menggunakan fungsi preprocess_node):
<div class="banner" style="background-image:url({{ field_image_url }}"></div>
Fungsi _var_image_url()
ini harus dipanggil dari THEME_preprocess_node()
fungsi karena mengharapkan pengaturan tertentu dalam $vars
argumen pertama . Jika Anda mencoba memanggilnya preprocess_page
, Anda harus memodifikasinya.