drupal 8 – Representar un campo de imagen en page.html.twig con un estilo de imagen personalizado

Pregunta:

Estoy intentando configurar una presentación de diapositivas que sea única para cada página. El código para esto debe estar en page.html.twig . La presentación de diapositivas funciona principalmente, pero solo puedo llamar a la URL de la imagen completa, no a un estilo de imagen personalizado de un tamaño específico. ¿Cómo puedo modificar este código para llamar a un tamaño de imagen específico?

{% for key, item in node.field_slides %}
{% if node.field_slides[key].entity %}
<figure class="swiper-slide">
    <img class="swiper-image" src="{{ file_url(node.field_slides[key].entity.uri.value) }}" alt="{{ node.field_slides[key].alt  }}" />

    {% if node.field_slides[key].title %}
    <figcaption class="swiper-caption">
        <div class="swiper-user-content user-content">
            {{ node.field_slides[key].title|striptags("<a>,<h1>,<h2>,<h3>,<h4>,<h5>,<h6>,<ol>,<p>,<table>,<ul>")|raw }}
        </div><!--/.swiper-user-content.user-content-->
    </figcaption><!--/.swiper-caption-->
    {% endif %}
</figure><!--/.swiper-slide-->
{% endif %}
{% endfor %}

El bit donde llamo a la URL es:

{{ file_url(node.field_slides[key].entity.uri.value) }}

Intenté hacer {{ dump(node.field_slides[key]) }} para ver si había algún dato que pudiera usar, pero cada vez que lo hago, obtengo un error 500.

Cualquier ayuda será muy apreciada; Soy muy nuevo en Drupal, vengo de WordPress. Creo que este es el último gran obstáculo antes de que pueda terminar este tema para mi cliente.

Respuesta:

Reemplazar la etiqueta de la imagen

<img class="swiper-image" src="{{ file_url(node.field_slides[key].entity.uri.value) }}" alt="{{ node.field_slides[key].alt  }}" />

con una matriz de renderizado para el estilo de imagen:

{% set imagestyle = {
  '#theme':      'image_style',
  '#style_name': 'medium',
  '#uri':        node.field_slides[key].entity.uri.value,
  '#alt':        node.field_slides[key].alt,
  '#attributes': { class: 'swiper-image' },
} %}

{{ imagestyle }}

Editar:

Hay un nuevo filtro en el módulo Twig Tweak . Ahora puede generar la URL de estilo de imagen en twig directamente desde una URL o URL:

{{ node.field_slides[key].entity.uri.value | image_style('thumbnail') }} 

Leave a Comment

Your email address will not be published.

Scroll to Top

istanbul avukat

-

web tasarım