NCA Social Media
Aktualisiert:
Autor:
Roland Golla
Grüne Twig Hooks Neonschrift mit Puzzleteilen auf dunklem Hintergrund

Was sind Twig Hooks?

Twig Hooks sind ein konfigurierbares Layoutsystem für Symfony und Sylius, das Template Overrides durch deklarative Hook Punkte ersetzt. Statt ganze Templates zu kopieren und in templates/bundles/ zu überschreiben, definieren Entwickler benannte Einfügepunkte direkt in Twig Templates und registrieren Inhalte per YAML Konfiguration. Das Ergebnis sind modulare, wartbare und update sichere Layouts.

Das Paket sylius/twig-hooks gehört zum Sylius Stack und funktioniert als eigenständige Symfony Komponente. Es unterstützt drei Arten von Hookables: klassische Twig Templates, Twig Components aus dem Symfony UX Ökosystem und Symfony Live Components für interaktive Elemente. Damit löst es die älteren Systeme wie Sonata Block Events und Sylius Template Events vollständig ab.

Für PHP Entwickler, die komplexe Symfony Anwendungen oder Sylius Shops betreiben, bieten Twig Hooks entscheidende Vorteile: Plugin Kompatibilität bleibt bei Updates erhalten, mehrere Plugins können dieselbe Stelle erweitern ohne Konflikte, und die Reihenfolge der Inhalte lässt sich über ein Priority System flexibel steuern. Wer seine Template Architektur modernisieren möchte, findet in Twig Hooks den aktuellen Standard für 2026.

CYPRESS.IO Ambassador und IT Consultant für QA Engenieering und Qualität in PHP Projekten.

Erreichen Sie unsere PHP Consultant Spezialisten

Wir sind Experten für PHP und helfen Ihnen, Ihre digitalen Herausforderungen zu meistern. Unser erfahrenes Team unterstützt Sie bei PHP Updates, PHP Refactoring und berät Sie remote zu allen Fragen rund um PHP. Mit unseren vollautomatischen CI/CD Deployments und einer robusten Docker-Infrastruktur bringen wir Ihre PHP-Projekte auf das nächste Level. Vertrauen Sie auf unsere Expertise für zuverlässige und skalierbare PHP-Lösungen.

Demo Team Workshop Anrufen

Wie funktionieren Twig Hooks?

Das Grundprinzip von Twig Hooks basiert auf zwei Konzepten: Hooks und Hookables. Ein Hook ist ein benannter Einfügepunkt innerhalb eines Twig Templates. Er wird mit dem Tag {% hook 'hook_name' %} definiert und markiert eine Stelle, an der externe Inhalte eingefügt werden können. Ein Hookable ist der konkrete Inhalt, der in einen Hook geladen wird, also ein Template, eine Twig Component oder eine Live Component.

Die Zuordnung zwischen Hooks und Hookables erfolgt über eine YAML Konfiguration unter config/packages/twig_hooks.yaml. Jeder Hookable erhält einen eindeutigen Namen, einen Template Pfad oder Component Key, und optional eine Priority, die die Reihenfolge innerhalb des Hooks bestimmt. Je höher die Priority, desto früher wird der Hookable gerendert. Standardmäßig ist die Priority 0.

Hooks sind hierarchisch organisiert und bilden eine Baumstruktur. Das bedeutet: ein Hookable kann selbst wieder einen Hook enthalten, sodass verschachtelte Layouts entstehen. Dieses System ermöglicht eine klare Trennung zwischen Struktur (Hooks) und Inhalt (Hookables), was die Wartbarkeit großer Symfony Projekte deutlich verbessert.

Installation und Konfiguration

Twig Hooks lässt sich als eigenständiges Composer Paket installieren. Es setzt PHP 8.2 oder höher sowie Symfony 6.4 oder 7.x voraus. Die Installation erfolgt über Composer:

Code: 
          
composer require sylius/twig-hooks

Nach der Installation wird die Konfiguration in einer YAML Datei unter config/packages/ angelegt. Der grundlegende Aufbau folgt immer dem gleichen Muster: unter dem Schlüssel sylius_twig_hooks.hooks werden Hook Namen definiert, darunter die zugehörigen Hookables mit ihren Eigenschaften.

Code: 
          
# config/packages/twig_hooks.yaml
sylius_twig_hooks:
  hooks:
    'app.layout.header':
      logo:
        template: 'header/logo.html.twig'
        priority: 100
      navigation:
        template: 'header/navigation.html.twig'
        priority: 50

Im Twig Template wird der Hook dann mit einem einzigen Tag eingefügt. Alle registrierten Hookables werden automatisch gerendert, sortiert nach Priority:

Code: 
          
{# templates/layout.html.twig #}
<header>
  {% hook 'app.layout.header' %}
</header>

Hookables: Templates, Components und Live Components

Twig Hooks unterstützen drei verschiedene Typen von Hookables, die jeweils unterschiedliche Anforderungen abdecken:

Template Hookables sind die einfachste Variante. Sie verweisen auf eine Twig Datei, die an der Hook Position gerendert wird. Context Daten werden über die context Eigenschaft in der YAML Konfiguration oder über das with Keyword im Hook Tag übergeben. Im Template stehen sie über hookable_metadata.context oder die Funktion get_hookable_context() zur Verfügung.

Component Hookables nutzen Twig Components aus dem Symfony UX Ökosystem. Statt eines Template Pfads wird ein Component Key angegeben, und Props werden direkt in der Konfiguration definiert. Das ist ideal für Hookables mit komplexer Logik, weil die Business Logik in einer PHP Klasse liegt und nicht im Template.

Code: 
          
# Component Hookable Konfiguration
sylius_twig_hooks:
  hooks:
    'app.product.sidebar':
      featured_products:
        component: 'app:featured_products'
        props:
          limit: 5
          category: 'new'
        priority: 100

Live Component Hookables erweitern das Konzept um interaktive Elemente mit Symfony UX Live Components. Sie reagieren auf Benutzeraktionen ohne vollständige Seitenneulads. Das ist besonders relevant für E Commerce Szenarien wie dynamische Filter, Warenkörbe oder Echtzeit Suchfelder in Sylius Shops.

Autoprefixing und Composable Layouts

Twig Hooks bieten ein Autoprefixing Feature, das bei der Entwicklung größerer Projekte oder Bundles für Struktur sorgt. Wenn ein Hookable selbst einen Hook enthält, wird der Name des übergeordneten Hooks automatisch als Präfix vorangestellt. Aus einem Hook {% hook 'form' %} innerhalb eines Hookables unter app.product.create wird automatisch app.product.create.form.

Dieses Verhalten ermöglicht Composable Layouts mit vorhersagbarer Struktur. Entwickler können generische Layouts definieren, etwa für alle Create Formulare, und diese dann für spezifische Entitäten gezielt überschreiben. Dabei nutzt das System ein Multi Hook Feature: ein einzelner Hook kann mehrere Namen tragen, wobei die früheren Namen eine höhere Priorität haben.

Code: 
          
{# Generisches Layout mit Fallback #}
{% hook ['app.course.create', 'app.common.create'] %}

{# Konfiguration: course spezifisch ueberschreibt common #}
sylius_twig_hooks:
  hooks:
    'app.common.create':
      header:
        template: 'common/create/header.html.twig'
    'app.course.create':
      header:
        template: 'course/create/header.html.twig'

In der Praxis bedeutet das: eine einzige Template Basis für wiederkehrende UI Muster, mit gezielten Anpassungen pro Seite. Das reduziert Codeduplizierung erheblich und macht Layouts auch in großen Sylius Projekten mit vielen Entitäten beherrschbar. Für Teams, die mit mehreren Entwicklern an einem Projekt arbeiten, ist diese Vorhersagbarkeit ein entscheidender Vorteil.

Twig Hooks vs. Template Overrides

Der klassische Weg zur Template Anpassung in Symfony besteht darin, die Original Datei nach templates/bundles/ zu kopieren und dort zu modifizieren. Dieser Ansatz hat mehrere Nachteile: bei jedem Update des Bundles müssen die kopierten Templates manuell abgeglichen werden. Wenn mehrere Plugins dasselbe Template überschreiben, entstehen Konflikte, die nur schwer aufzulösen sind.

Twig Hooks lösen diese Probleme grundlegend. Statt das gesamte Template zu ersetzen, fügen Entwickler Inhalte an definierten Stellen ein, entfernen bestehende Hookables durch enabled: false oder ändern die Reihenfolge über die Priority. Mehrere Plugins können denselben Hook erweitern, ohne sich gegenseitig zu beeinflussen. Updates des Core Templates bleiben wirksam, weil die Struktur unangetastet bleibt.

Für Sylius Projekte ist dieser Unterschied besonders relevant: In Sylius 2.0 ersetzen Twig Hooks die bisherigen Template Events vollständig. Wer von Sylius 1.x auf 2.0 migriert, muss bestehende Template Overrides in die neue Hook basierte Architektur überführen. NCA unterstützt bei dieser Migration mit Erfahrung aus zahlreichen Rector gestützten Refactoring Projekten.

NCA Expertise: Symfony Template Architektur modernisieren

Never Code Alone begleitet PHP Teams bei der Migration von Legacy Template Overrides zu modernen Hook basierten Architekturen. Ob Sylius 2.0 Upgrade, Symfony UX Integration oder die Entwicklung eigener Bundle Plugins mit Twig Hooks: unsere Consultants bringen die praktische Erfahrung mit, die den Unterschied zwischen einem sauberen Refactoring und monatelangem Debugging macht.

Gerade bei gewachsenen Sylius Shops mit vielen individuellen Anpassungen ist der Umstieg auf Twig Hooks eine strategische Investition. Die alte Methode über templates/bundles/ erzeugt technische Schulden, die mit jedem Core Update wachsen. Twig Hooks eliminieren diese Abhängigkeit und machen Projekte langfristig wartbar. Für eine kostenlose Erstberatung zur Template Modernisierung erreichen Sie uns unter roland@nevercodealone.de oder telefonisch unter +49 176 24747727.

Lass uns sprechen

Finde das passende Angebot für dein Projekt

Anfrage-Konfiguration

Starten Sie Ihre Anfrage

Projektart
Infos
Nachricht

Eliminierung technischer Schulden mit PHPStan, Rector PHP und PHPUnit. Über 20 Jahre Praxiserfahrung in skalierbaren Backends.

CORE EXPERTISE

Gesetzliche Konformität & Inklusion. Optimierung von Performance und Conversion durch radikal nutzerzentriertes, universelles Design.

BFSG COMPLIANT

Skalierbare KI-Systeme mit echtem Code Ownership. CI/CD, Backup-Strategien und Infrastruktur, die mit deinem Team wächst.

ENTERPRISE READY

Häufige Fragen zu Twig Hooks

Die wichtigsten Fragen und Antworten rund um Twig Hooks, Installation, Konfiguration und den Einsatz in Symfony und Sylius Projekten.

Was sind Twig Hooks 2026?

Twig Hooks sind ein konfigurierbares Layoutsystem aus dem Sylius Stack, das benannte Einfügepunkte in Twig Templates definiert. Statt ganzer Templates zu überschreiben, registrieren Entwickler Inhalte per YAML Konfiguration an definierten Hook Positionen. Das System unterstützt Twig Templates, Twig Components und Live Components.

Wie installiert man Twig Hooks 2026?

Die Installation erfolgt über Composer mit dem Befehl composer require sylius/twig-hooks. Das Paket benötigt PHP 8.1 oder höher sowie Symfony 6.4 oder 7.x. Die Konfiguration wird in einer YAML Datei unter config/packages/ angelegt.

Welche Vorteile bieten Twig Hooks gegenüber Template Overrides 2026?

Twig Hooks vermeiden das Kopieren ganzer Templates nach templates/bundles/. Mehrere Plugins können denselben Hook erweitern ohne Konflikte. Updates des Core Templates bleiben wirksam, weil die Struktur unangetastet bleibt. Die Reihenfolge wird über ein Priority System gesteuert.

Sind Twig Hooks mit Symfony 7 kompatibel 2026?

Ja, Twig Hooks unterstützen sowohl Symfony 6.4 als auch Symfony 7.x. In Sylius 2.0, das auf Symfony 7 basiert, sind Twig Hooks das offizielle System für Template Anpassungen und ersetzen die früheren Sylius Template Events vollständig.

Was ist der Unterschied zwischen Hook und Hookable 2026?

Ein Hook ist ein benannter Einfügepunkt im Twig Template, definiert mit dem Tag hook. Ein Hookable ist der konkrete Inhalt, der an dieser Stelle gerendert wird, also ein Template, eine Component oder eine Live Component. Die Zuordnung erfolgt über YAML Konfiguration.

Wie funktioniert das Priority System bei Twig Hooks?

Jeder Hookable erhält eine Priority als Ganzzahl. Je höher der Wert, desto früher wird der Hookable innerhalb seines Hooks gerendert. Standard ist 0. In Sylius werden Priorities typischerweise in Hunderter Schritten vergeben, um Platz für spätere Einfügungen zu lassen.

Was ist Autoprefixing bei Twig Hooks?

Autoprefixing fügt den Namen des übergeordneten Hooks automatisch als Präfix an untergeordnete Hooks an. Aus einem Hook namens form innerhalb von app.product.create wird automatisch app.product.create.form. Das sorgt für vorhersagbare, hierarchische Hook Namen ohne manuelle Pflege.

Können Twig Hooks mit Twig Components kombiniert werden?

Ja, Twig Hooks unterstützen drei Hookable Typen: einfache Templates, Twig Components aus Symfony UX und Live Components für interaktive Elemente. Bei Component Hookables werden Props direkt in der YAML Konfiguration definiert und an die PHP Klasse übergeben.

Wie übergibt man Daten an Hookables?

Daten werden über zwei Wege an Hookables übergeben: über das with Keyword im Hook Tag oder über die context Eigenschaft in der YAML Konfiguration. Im Template stehen die Daten über hookable_metadata.context oder die Funktion get_hookable_context() zur Verfügung.

Kann man einzelne Hookables deaktivieren?

Ja, jeder Hookable kann über die Eigenschaft enabled: false in der YAML Konfiguration deaktiviert werden. Das ist besonders nützlich, wenn ein Plugin einen bestimmten Block mitliefert, der im eigenen Projekt nicht benötigt wird, ohne dass der gesamte Hook entfernt werden muss.

Wie debuggt man Twig Hooks in Symfony?

Der Symfony Profiler bietet ein eigenes Twig Hooks Panel, das alle gerenderten Hooks und Hookables mit ihren Prioritäten anzeigt. Zusätzlich steht ein Debug Command zur Verfügung, der die komplette Hook Konfiguration auf der Kommandozeile ausgibt.

Wann sollte man Twig Hooks statt Twig Blocks verwenden?

Twig Blocks sind das native Vererbungssystem von Twig und eignen sich für einfache Template Hierarchien. Twig Hooks sind überlegen, wenn mehrere unabhängige Parteien, etwa Plugins oder Bundle Entwickler, dieselbe Stelle erweitern müssen, ohne sich gegenseitig zu überschreiben. Für Plugin Architekturen und E Commerce Plattformen sind Hooks die bessere Wahl.