web-dev-qa-db-fra.com

Obtenez une image avec une URL de style à partir d'un URI dans twig

Donc, grâce à 4k4 j'ai finalement réussi à obtenir mon URI d'image d'origine dans un modèle de champ via

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

et avec

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

J'obtiendrais l'url du fichier d'origine.

J'ai les informations de style d'image via

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

ce "moyen" est demandé

A PHP est déjà disponible ici , mais comment faire cela dans TWIG?

Il y a quelques tentatives de création d'un filtre pour 8.1 ici - mais cela ne m'aide pas pour le moment.

theming8urimedia
8
Jannis Hell

Vous pouvez mettre le code php dans la fonction de prétraitement du modèle de champ. Vous avez toutes les informations dont vous avez besoin dans votre question.

Mais alors vous feriez du codage, c'est déjà en drupal. Si vous avez défini # style d'image dans l'élément de rendu d'image, le champ image doit être configuré pour les fonctions de prétraitement qui viendront plus tard dans les modèles de formatage d'image et de style d'image pour placer l'attribut src approprié dans les variables pour image-style.html.twig. Vous pouvez donc utiliser le code qui existe déjà en remplaçant ce modèle.

Voir le code dans /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'],
  );
3
4k4

J'avais juste besoin de faire ça aussi. La bonne approche consiste ici à stocker l'URL de l'image de l'image stylisée dans une variable (via une fonction de prétraitement), puis cette variable sera disponible dans votre fichier twig.

J'ai écrit une fonction qui obtiendra n'importe quel fichier field_image et renverra le nom de fichier d'origine, ou si vous spécifiez un nom de style, il renverra l'URL de l'image stylisée.

Dans mon fichier .theme:

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;
}

Maintenant dans mon fichier twig (node.html.twig, puisque j'ai utilisé la fonction preprocess_node):

<div class="banner" style="background-image:url({{ field_image_url }}"></div>

Cette fonction _var_image_url() doit être appelée à partir de la fonction THEME_preprocess_node() car elle attend une certaine configuration dans le premier argument $vars. Si vous essayez de l'appeler à partir de preprocess_page, Vous devrez le modifier.

1
wheelercreek