Nicht danach. Nicht im nächsten Tab. Direkt neben deiner Arbeit – live. Contao Live Preview zeigt dir deine Website als direkte Vorschau in einer iFrame-Sidebar, immer passend zu dem was du gerade bearbeitest.
Kompatibel mit Contao 5.3 LTS und neuer
Mit Contao Design+ zur perfekten Website.
Element Übersicht →Artikel-Wrapper
Installieren Sie Contao, importieren das Theme…
Farben, Elemente, Layout.
Perfekt abgestimmte Elemente.
Demos als Basis.
Beste Usability auf Smartphone.
Contao Live Preview weiß immer, was du gerade bearbeitest – und zeigt es dir sofort als live Vorschau im iFrame daneben.
Öffnest du eine Seite, einen Artikel oder ein Inhaltselement im Backend, lädt der iFrame in der Sidebar automatisch die passende Seite auf deiner Website. Ganz ohne Konfiguration.
Sobald du auf Speichern klickst, aktualisiert sich die live Vorschau im iFrame – ohne dass die Backend-Seite neu lädt. Nur der Bereich der sich geändert hat wird neu geladen. Deine Arbeit läuft weiter.
Die direkte Vorschau im iFrame springt automatisch zu dem Element, das du gerade bearbeitest, und hebt es mit einer farbigen Markierung hervor. Kein Suchen mehr wo deine Änderung auf der Seite landet.
Fahr mit der Maus über ein Element im iFrame – es wird sofort mit einem Edit-Button markiert. Ein Klick öffnet es direkt im Backend zur Bearbeitung. Vom Sehen zum Ändern mit einem einzigen Klick.
Fährst du mit der Maus über Bereiche im iFrame, erscheinen farbige Markierungen mit dem Namen des Elements. Du siehst sofort, welches Inhaltselement im Backend für welchen Bereich auf der Seite zuständig ist.
Egal ob Standard-Inhaltselemente, RSCE-Elemente oder moderne Twig-Elemente – die direkte Vorschau erkennt alle und zeigt sie korrekt an. Auch eigene Extensions werden unterstützt.
Das Bundle schaut sich die aktuelle Backend-URL an und löst den Zusammenhang auf: Bearbeitest du ein Inhaltselement, findet es automatisch den zugehörigen Artikel und die Seite auf der er liegt.
Über Contao wird die passende URL der Seite ermittelt – inklusive Sprachpfad und Seitenalias. Der iFrame zeigt direkt die richtige Seite, sofort und ohne dass du etwas tun musst.
Backend und iFrame sind direkt verbunden. Das aktive Element wird angezeigt, angesprungen und markiert. Nach dem Speichern wird nur der veränderte Bereich der Seite neu geladen – natives Gefühl, kein Ruckeln.
Contao Live Preview funktioniert mit jeder Contao-Installation. Aber in Kombination mit Contao Design+ läuft es auf einem anderen Level.
Contao Design+ liefert alle nötigen Markierungen bereits im Template mit – der iFrame erkennt jedes Element sofort, ohne zusätzliche Konfiguration und mit minimalem Overhead.
Durch die saubere Struktur von Contao Design+ trifft die Markierung im iFrame immer genau das richtige Element – auch bei verschachtelten Layouts und Grid-Bereichen.
Alle RSCE- und Twig-Elemente von Contao Design+ sind vollständig kompatibel und werden im iFrame korrekt erkannt und angezeigt.
Ein Composer-Befehl. Fertig. Kein Build-Step, kein Plugin-Setup, kein Framework-Overhead.
# Bundle installieren composer require vendor/contao-live-preview-bundle # Assets installieren & Cache leeren bin/console assets:install --symlink bin/console cache:clear && bin/console cache:warmup
Contao 5.3 LTS+ · PHP 8.2+ · Keine zusätzliche Konfiguration erforderlich