Better Live Preview
Verbessert die Live-Vorschau in Payload CMS mit Synchronisation zwischen Admin- und Vorschauansicht sowie Hover-Hervorhebung.
Installation
pnpm add payload-better-preview Über
Das Plugin verbessert die Live-Bearbeitungsfunktionen in Payload CMS. Nutzer erhalten durch beeindruckende Funktionen wie Hover-Hervorhebung zur Blockidentifikation und bi-direktionale Synchronisation zwischen Admin- und Vorschauansicht Echtzeit-Updates. Wird ein Block im Admin angeklickt, wird dieser in der Vorschau hervorgehoben und es scrollt automatisch dorthin, und umgekehrt. Diese Funktionalität vereinfacht den Bearbeitungsprozess, indem sie sofortige Rückmeldung zu Änderungen liefert. Für die Integration muss das Plugin in der Payload-Konfiguration registriert werden, wobei anpassbare Optionen wie Akzentfarbe und Scroll-Ausrichtung zur Verfügung stehen. Das Plugin unterstützt geschachtelte Blöcke und benötigt korrekte Datenattribute, um eine präzise Synchronisation zwischen der Admin-Oberfläche und der Vorschau zu gewährleisten. Zudem arbeitet es mit Lexical für die Synchronisation von reichhaltigen Textbearbeitungen und bietet zusätzliche Synchronisationsmöglichkeiten für eingebettete Blöcke in reichhaltigen Textfeldern. Es ist eine Installation von Payload Version 3.0.0 oder höher erforderlich.
Paketinformationen
- Paketname
payload-better-preview- Neueste Version
2.1.3- Entpackte Größe
- 99 kB
- Lizenz
- MIT
- Wöchentliche Downloads
- 65
- Zuletzt veröffentlicht
- 4. Juni 2026
Mehr von scorpio-99
Profil ansehenÄhnliche Plugins
Mehr in ContentSitemap
Erzeugt sitemap.xml aus Payload-Collections und statischen URLs und legt die Dateien im Storage-Adapter des Projekts ab.
Structured Markdown
Bietet strukturiertes Markdown-Editing für Payload CMS mit erweiterten Bearbeitungsfunktionen.
AI Plugin
Integriert KI-Funktionen zur Inhaltserstellung in Payload CMS.
onpage for TanStack Start
Fügt TanStack-Start-Seiten, die Inhalte aus Payload lesen, Inline-Bearbeitung und Draft-Vorschauen hinzu.
On-Page Editing
Ergänzt Payload-Collections und Globals um Inline-Bearbeitung direkt auf der Next.js-Seite, mit Draft-Speicherung und Preview-Links.
Lexical Inline Rich Text Editor
Bearbeitet Payload-richText-Felder direkt auf der gerenderten Seite per Klick, ohne das Admin-Formular zu öffnen.