web-dev-qa-db-ja.com

twigのURIからスタイルurlの画像を取得します

4k4 のおかげで、フィールドテンプレートで get my original image URI を最終的に管理できました

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

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

元のファイルのURLを取得します。

私は画像スタイル情報を持っています

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

その「媒体」が要求されている

A PHPソリューションはすでに利用可能です こちら ですが、TWIGでこれを行うにはどうすればよいですか?

8.1用のフィルターを作成するいくつかの試みがあります here -しかし、それは現在私を助けません。

8
Jannis Hell

フィールドテンプレートの前処理関数にphpコードを配置できます。あなたはあなたの質問に必要なすべての情報を持っています。

しかし、あなたはコーディングをするでしょう、それはすでにドルパにあります。画像レンダー要素で#image-styleを設定している場合は、後で画像フォーマッタおよび画像スタイルテンプレートに含まれる前処理関数用に画像フィールドを設定して、_image-style.html.twig_。したがって、このテンプレートをオーバーライドすることで、すでに存在するコードを使用できます。

/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

私もこれを行う必要がありました。ここでの正しいアプローチは、スタイル付き画像の画像URLを(前処理関数を介して)変数に格納し、その変数をtwigファイルで使用できるようにすることです。

任意のfield_imageファイルを取得して元のファイル名を返す関数を記述しました。または、スタイル名を指定した場合は、スタイル付き画像のURLを返します。

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

今私のtwigファイル(node.html.twig、私はpreprocess_node関数を使用したため))で:

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

この関数_var_image_url()は、最初の_$vars_引数で特定の設定が想定されているため、THEME_preprocess_node()関数から呼び出す必要があります。 _preprocess_page_から呼び出す場合は、変更する必要があります。

1
wheelercreek