Получить изображение с URL-адресом стиля из URI в ветке


8

Так что благодаря 4k4 мне наконец удалось получить исходный URI изображения в шаблоне поля через

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

и с

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

Я бы получил URL оригинального файла.

У меня есть информация о стиле изображения через

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

этот «средний» запрашивается

Решение PHP уже доступно здесь , но как мне сделать это в TWIG?

Есть несколько попыток создания фильтра для 8.1 здесь - но это мне не помогает в настоящее время.


Где вы хотите использовать изображение в качестве фона, а именно, узел или страницу?
kiamlaluno

Ответы:


3

Вы можете поместить код php в функцию предварительной обработки шаблона поля. У вас есть вся необходимая информация в вашем вопросе.

Но тогда вы бы занялись кодированием, это уже в друпале. Если вы установили # image-style в элементе рендеринга изображения, то поле изображения должно быть сконфигурировано для функций предварительной обработки, которые появятся позже в шаблонах форматирования изображения и стиля изображения, чтобы в атрибутах для них был установлен правильный атрибут src 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'],
  );

1
Дело в том, что я не хочу, чтобы изображение отображалось как <img>встроенный стиль фона. В настоящее время я получаю правильное изображение со стилем как <img>или исходный путь к файлу, который слишком велик для использования в неширокополосном соединении - так что я просто хочу получить путь к уменьшенной выборке. И я не хочу отменять все рендеры изображений, только одно поле. Конечно, я мог бы взломать путь к стилю, так как я знаю оригинальное имя файла - но это было бы плохо.
Яннис Ад

Вам не нужно переопределять все изображения. Вы можете выбрать нужную тему, предложив название темы, или поставить условие в веточку. Я бы выбрал второе, потому что отладка ветки не делает никаких предложений для этого шаблона. Так что было бы легче без необходимости исследовать правильное предложение этого шаблона. Хард проволочный хак не рекомендуется. Вы не знаете, правильный ли размер стиля изображения находится в кеше.
4k4

1

Мне просто нужно было это сделать. Правильный подход заключается в том, чтобы сохранить URL-адрес изображения стилизованного изображения в переменной (с помощью функции предварительной обработки), и тогда эта переменная будет доступна в вашем файле ветки.

Я написал функцию, которая получит любой файл 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;
}

Теперь в моем файле ветки (node.html.twig, так как я использовал функцию preprocess_node):

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

Эта функция _var_image_url()должна вызываться из THEME_preprocess_node()функции, потому что она ожидает определенной установки в первом $varsаргументе. Если вы попытаетесь позвонить с него preprocess_page, вам нужно будет изменить его.

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.