cache - ¿Cómo usar un estilo de imagen en una plantilla de rama Drupal 8?

metatag drupal

Question

Intento imprimir una imagen usando un estilo de imagen que he creado en mi tema drupal 8.

Puedo imprimir una imagen en una plantilla haciendo {{content.banner}}, pero ¿cómo aplico el estilo de imagen a esa imagen? Traté de buscar documentación, pero no parece haber ninguna por ahí.

Answer 1

Resuelvo esto creando mi propio Filtro Twig .

Puede hacer lo mismo creando su propio módulo exponiendo este Filtro .

Siéntase libre de reutilizarlo.

Código

namespace Drupal/twig_extender/TwigExtension;
use Drupal/node/Entity/Node;
use Drupal/Core/Link;
use Drupal/Core/Url;
use Drupal/file/Entity/File;
use Drupal/image/Entity/ImageStyle;
class Images extends /Twig_Extension {
/**
* Generates a list of all Twig functions that this extension defines.
*/
public function getFunctions(){
return array(
new /Twig_SimpleFunction(''image_style'', array($this, ''imageStyle''), array(''is_safe'' => array(''html''))),
);
}
/**
* Gets a unique identifier for this Twig extension.
*/
public function getName() {
return ''twig_extender.twig.images'';
}
/**
* Generate images styles for given image
*/
public static function imageStyle($file_id, $styles) {
$file = File::load($file_id);
$transform = array();
if (isset($file->uri->value)) {
$transform[''source''] = $file->url();
foreach ($styles as $style) {
$transform[$style] = ImageStyle::load($style)->buildUrl($file->uri->value);
}
}
return $transform;
}
}

Uso

{% set transform = image_style(image.entity.fid.value, [''thumbnail'', ''large'']) %}

Luego tienes acceso a la imagen y estilos de origen

{{ transform.source }}
{{ transform.thumbnail }}
{{ transform.large }}

Espero que te ayude chico!

Answer 2

Actualmente drupal 8 no tiene un filtro especial para aplicar el estilo de imagen. En su lugar, puede establecer un nuevo atributo para su imagen de esta manera:

{% set image = image|merge({''#image_style'': ''thumbnail''}) %}

Luego simplemente muestre su imagen actualizada:

{{ image }}

PD. Puedes hacer {{ dump(image) }} para ver qué atributos puedes actualizar