Wie verwende ich einen Bildstil in einer Drupal 8-Zweigvorlage?

Question

Ich versuche ein Bild mit einem Bildstil zu drucken, den ich in meinem drupal 8 Theme erstellt habe.

Ich kann ein Bild in einer Vorlage drucken, indem ich {{content.banner}} mache, aber wie wende ich den Bildstil auf dieses Bild an? Ich habe versucht, nach Dokumenten zu suchen, aber es scheint keine da draußen zu geben.

Answer 1

Momentan hat drupal 8 keinen speziellen Filter zum Anwenden des Bildstils. Stattdessen können Sie neues Attribut für das Bild wie folgt festgelegt:

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

Dann einfach Ausgang Ihr aktualisiertes Bild:

{{ image }} 

P. S. Sie können {{ dump(image) }} tun, um zu sehen, welche Attribute Sie aktualisieren können

Answer 2

Ich löse dies durch die Erstellung meiner eigenen Twig Filter.

Sie können dasselbe tun, indem Sie Ihr eigenes Modul erstellen, das diesen Filter ausstellt.

Fühlen Sie sich frei, es wieder zu verwenden.

-Code

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

Nutzungs

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

Dann haben Sie Zugriff auf das Quellbild & Arten

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

es Hoffnung wird helfen, yo Du Typ!