it-swarm.com.de

Holen Sie sich ein Bild mit einer Stil-URL von einer URI in twig

Also dank 4k4 habe ich es endlich geschafft meine Originalbild-URI zu bekommen in einer Feldvorlage über

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

und mit

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

Ich würde die URL der Originaldatei erhalten.

Ich habe die Bildstilinformationen über

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

dieses 'Medium' wird angefordert

Eine PHP Lösung ist bereits verfügbar hier , aber wie mache ich das in TWIG?

Es gibt einige Versuche, einen Filter für 8.1 zu erstellen hier - aber das hilft mir derzeit nicht.

8
Jannis Hell

Sie können den PHP-Code in die Vorverarbeitungsfunktion der Feldvorlage einfügen. Sie haben alle Informationen, die Sie in Ihrer Frage benötigen.

Aber dann würden Sie Codierung machen, das ist schon in Drupal. Wenn Sie im Bildrenderelement den # Bildstil festgelegt haben, sollte das Bildfeld für die Vorverarbeitungsfunktionen konfiguriert werden, die später in den Bildformatierungs- und Bildstilvorlagen enthalten sind, um das richtige src-Attribut in die Variablen für _image-style.html.twig_. Sie können also den bereits vorhandenen Code verwenden, indem Sie diese Vorlage überschreiben.

Siehe den Code in /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

Ich musste das einfach auch tun. Der richtige Ansatz besteht darin, die Bild-URL des gestalteten Bildes in einer Variablen zu speichern (über eine Vorverarbeitungsfunktion). Diese Variable ist dann in Ihrer Datei twig) verfügbar.

Ich habe eine Funktion geschrieben, die jede field_image-Datei abruft und den ursprünglichen Dateinamen zurückgibt. Wenn Sie einen Stilnamen angeben, wird die URL des gestalteten Bildes zurückgegeben.

In meiner .theme Datei:

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

Jetzt in meiner twig-Datei (node.html.twig, da ich die Funktion preprocess_node verwendet habe):

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

Diese Funktion _var_image_url() muss von der Funktion THEME_preprocess_node() aufgerufen werden, da sie eine bestimmte Einstellung im ersten $vars - Argument erwartet. Wenn Sie versuchen, es von preprocess_page Aufzurufen, müssen Sie es ändern.

1
wheelercreek