Dapatkan gambar dengan url gaya dari URI di ranting

8

Jadi berkat 4k4 akhirnya saya berhasil mendapatkan URI gambar asli saya melalui templat bidang

item.content['#item'].entity.uri.value

dan dengan

{{ file_url(item.content['#item'].entity.uri.value) }}

Saya akan mendapatkan url dari file asli.

Saya memiliki informasi gaya gambar melalui

item.content['#item']['#image-style']

'media' itu diminta

Solusi PHP sudah tersedia di sini , tetapi bagaimana saya melakukan ini di TWIG?

Ada beberapa upaya membuat filter untuk 8.1 di sini - tetapi itu tidak membantu saya saat ini.

Jannis Hell
sumber
Di mana Anda ingin menggunakan gambar sebagai latar belakang, tepatnya, simpul atau halaman?
kiamlaluno

Jawaban:

3

Anda bisa meletakkan kode php dalam fungsi preprocess dari templat bidang. Anda memiliki semua informasi yang Anda butuhkan dalam pertanyaan Anda.

Tetapi kemudian Anda akan melakukan pengkodean, itu sudah dalam drupal. Jika Anda memiliki # gaya gambar yang diatur dalam elemen render gambar, maka bidang gambar harus dikonfigurasikan untuk fungsi preprocess yang datang kemudian dalam formatter gambar dan template gaya gambar untuk meletakkan atribut src kanan dalam variabel untuk image-style.html.twig. Jadi, Anda dapat menggunakan kode yang sudah ada di sana dengan mengganti template ini.

Lihat kode di /core/module/image/image.module:

function template_preprocess_image_style(&$variables) {
  $style = ImageStyle::load($variables['style_name']);

  // Determine the dimensions of the styled image.
  $dimensions = array(
    'width' => $variables['width'],
    'height' => $variables['height'],
  );

  $style->transformDimensions($dimensions, $variables['uri']);

  $variables['image'] = array(
    '#theme' => 'image',
    '#width' => $dimensions['width'],
    '#height' => $dimensions['height'],
    '#attributes' => $variables['attributes'],
    '#uri' => $style->buildUrl($variables['uri']),
    '#style_name' => $variables['style_name'],
  );
4k4
sumber
1
Yah masalahnya adalah, bahwa saya tidak ingin gambar untuk membuat <img>tetapi sebagai gambar latar inline-style. Saat ini saya mendapatkan gambar yang benar dengan gaya sebagai <img>atau jalur file asli yang terlalu besar untuk digunakan pada koneksi non-broadband - jadi saya hanya ingin mendapatkan jalur ke yang sampel-down. Dan saya tidak ingin menimpa semua render gambar, hanya satu bidang. Tentu saya bisa memasang hardwire jalur ke gaya, karena saya tahu nama aslinya - tapi itu akan buruk.
Jannis Hell
Anda tidak perlu mengganti semua gambar. Anda dapat menargetkan yang Anda inginkan dengan saran nama tema atau Anda memasang syarat di ranting. Saya akan memilih yang kedua, karena ranting debug tidak membuat saran untuk template ini. Jadi akan lebih mudah tanpa perlu menyelidiki saran yang tepat dari template ini. Retasan hardwire tidak disarankan. Anda tidak tahu apakah ukuran gaya gambar yang tepat ada di cache.
4k4
1

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 .themefile 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 $varsargumen pertama . Jika Anda mencoba memanggilnya preprocess_page, Anda harus memodifikasinya.

wheelercreek
sumber