Drupal Canvas: Eine neue Ära der visuellen Seitenerstellung

Drupal Canvas macht die Seitenerstellung visuell und intuitiv und bietet sowohl Content-Teams als auch Entwicklern eine zugänglichere und effizientere Arbeitsumgebung.

WhatsApp

Yasemin Karstarlı
Yasemin Karstarlı Content-Spezialist
4 minuten lesen
canvas

Drupal ist seit vielen Jahren ein leistungsstarkes Content-Management-System, das von großen Organisationen bevorzugt wird. Die Erstellung und Bearbeitung von Seiten erforderte jedoch häufig ein gewisses Maß an technischem Know-how. Drupal Canvas verändert dies, indem es die Seitenerstellung in ein visuelles und intuitives Erlebnis verwandelt. Dadurch entsteht eine zugänglichere und effizientere Arbeitsumgebung für sowohl Content-Teams als auch Entwickler.

In diesem Abschnitt werden wir die Benutzeroberfläche von Canvas, seine grundlegenden Funktionen sowie seinen Beitrag zur Benutzererfahrung betrachten. Außerdem gehen wir auf die Zukunftschancen ein, die Canvas innerhalb des Drupal-Ökosystems bietet.

Was ist Drupal Canvas und warum ist es wichtig?

Drupal Canvas ist ein Werkzeug im Drupal-Ökosystem, das die Seitenerstellung und das Content-Management sowohl visuell als auch funktional verbessert. Content-Manager mit begrenzten Programmierkenntnissen können dank der Drag-and-Drop-Oberfläche ihre Seiten eigenständig gestalten und sie mithilfe von Vorschau- und Rückgängig-Funktionen sicher veröffentlichen. Entwickler können technische Anpassungen weiterhin über modulare Komponenten und Drupal-APIs umsetzen. Auf diese Weise bewahrt Canvas die leistungsstarke und flexible Struktur von Drupal und macht den Prozess der Seitenerstellung für alle schneller, zugänglicher und stärker nutzerorientiert. Darüber hinaus verfolgt Canvas einen community-orientierten Ansatz und entwickelt sich durch kontinuierliches Feedback und Verbesserungen stetig weiter.

Intuitive Seitenstruktur für Content-Manager

Drupal Canvas bietet eine intuitive Benutzeroberfläche, mit der Content-Manager das Seitendesign ohne technisches Vorwissen steuern können. Komponenten lassen sich per Drag-and-Drop einfach hinzufügen, anpassen und die Änderungen sofort in der Vorschau anzeigen. Wie in der untenstehenden Abbildung zu sehen ist, zeigt das linke Panel (Ebenen) die Struktur der Seite, während der Vorschaubereich die vorgenommenen Anpassungen in Echtzeit darstellt. Dank dieser intuitiven Struktur können sich Content-Manager vollständig auf das Design konzentrieren.

Drupal Canvas Werkzeugleiste und Panels

canvas

A – Add (Hinzufügen)

Wenn Sie auf dieses Symbol klicken, öffnet Drupal Canvas das Bibliothek-Panel in der linken Seitenleiste. Von hier aus können Sie auf seitenspezifische Elemente zugreifen, die Sie Ihrer Seite hinzufügen können.

  • Bereiche des Bibliothek-Panels:
  • Patterns (Muster): Vorkonfigurierte Sets von Komponenten (Hero-Bereiche, mehrspaltige Layouts usw.).
  • Components (Komponenten): Spezifische Bausteine, die auf der Seite verwendet werden können.
  • Code: Komponenten, die nicht in der Bibliothek enthalten sind; entweder noch nicht fertig oder zur Erstellung anderer Komponenten gedacht.
  • Overrides (Anpassungen): Optionen zur Personalisierung des Erscheinungsbildes dynamischer Komponenten, die vom CMS bereitgestellt werden.

 B – Linkes Seitenleisten-Panel
Zeigt das zum ausgewählten Werkzeug gehörende Panel in der linken Seitenleiste an.

C – Exit (Beenden)

Wird verwendet, um die Benutzeroberfläche von Drupal Canvas zu schließen.

D – Vorschaubereich

Zeigt eine Vorschau der Seite an. Mit dem Mausrad können Sie durch die Seite scrollen; auf dem Mac mit ⌘ Command oder unter Windows mit Ctrl in Kombination mit dem Mausrad können Sie hinein- oder herauszoomen.

E – Seitentitel

Zeigt den Titel der aktuellen Seite an. Durch Klicken auf den Titel können Sie den Navigator öffnen, zu anderen Seiten wechseln oder neue Inhalte erstellen.

F – Veröffentlichungsstatus

  • Zeigt den Veröffentlichungsstatus der Seite an:
  • Draft (Entwurf): Die Seite ist nicht veröffentlicht.
  • Published (Veröffentlicht): Die Seite ist veröffentlicht und unverändert.
  • Changed (Geändert): Die Seite ist veröffentlicht und wurde geändert.

G – New (Neu)

Wird verwendet, um neue Inhalte zu erstellen.

H – Navigator

Hilft bei der Navigation zu anderen Seiten innerhalb der Website.

I – Rechte Seitenleiste

Ermöglicht die Konfiguration der Seiteneinstellungen.

J – Preview (Vorschau)

Dient dazu zu überprüfen, wie die Seite nach der Veröffentlichung aussehen wird.

K – Review Changes (Änderungen überprüfen)

Ermöglicht es, die zu veröffentlichenden Änderungen zu überprüfen. Nach Bestätigung der Änderungen können Sie die Seite veröffentlichen.

Flexible und modulare Struktur für Entwickler

Drupal Canvas ermöglicht Entwicklern eine nahtlose Zusammenarbeit mit der bestehenden Drupal-Infrastruktur. Dank der modularen Komponentenarchitektur können technisch versierte Nutzer Seitenelemente anpassen, wiederverwendbare Komponenten erstellen und über API-Integrationen komplexere Funktionen hinzufügen. Diese Struktur erlaubt es Entwicklern, Seiten sowohl schnell als auch nachhaltig zu verwalten und zu individualisieren, während sie gleichzeitig die unabhängige Arbeit der Content-Teams unterstützt.

Vorteile für Benutzererlebnis und Vorschau

Canvas bietet Content-Managern und Entwicklern die Möglichkeit, den finalen Zustand einer Seite in Echtzeit zu sehen.
Änderungen werden sofort angezeigt, und dank der mehrstufigen Rückgängig-Funktion lassen sich Fehler leicht korrigieren.
Dieser Ansatz beschleunigt den Prozess der Inhaltserstellung und verbessert das Nutzererlebnis.
Die Vorschau vor der Veröffentlichung stellt sicher, dass Qualität und Korrektheit gewährleistet sind.

Überblick über die Drupal-Canvas-Benutzeroberfläche

Diese Demo-Abbildung zeigt die Benutzeroberfläche von Drupal Canvas. Über das linke Panel können Komponenten ausgewählt und der Seite hinzugefügt werden, während Änderungen im Vorschaubereich in Echtzeit sichtbar sind. Über das rechte Panel lassen sich die Seiteneinstellungen einfach konfigurieren. Die Oberfläche ist sowohl für Content-Manager als auch für Entwickler intuitiv und benutzerfreundlich gestaltet – selbst mit begrenzten technischen Kenntnissen verläuft die Seitenerstellung und -bearbeitung schnell und effizient.

canvas

Drupal Canvas 1.0 Funktionen

  • Drag-and-Drop-Benutzeroberfläche: Seitenelemente lassen sich schnell und intuitiv hinzufügen und anordnen.
  • Komponentenbibliothek: Vorgefertigte Komponenten, Muster und Module beschleunigen den Seitendesign-Prozess.
  • Vorschaubereich: Änderungen können sofort angezeigt und die finale Version der Seite vor der Veröffentlichung überprüft werden.
  • Rückgängig-Funktion und mehrstufige Bearbeitung: Fehler lassen sich einfach rückgängig machen, sodass mehrere Änderungen sicher bearbeitet werden können.
  • Modulare und flexible Struktur: Entwickler können Seiten mithilfe von APIs und individuellen Komponenten frei anpassen.
  • Verwaltung des Veröffentlichungsstatus: Entwurfs-, veröffentlichte oder geänderte Seitenzustände lassen sich einsehen und verwalten.
  • Community-orientierte Weiterentwicklung: Eine Open-Source-Plattform, die sich durch Community-Feedback kontinuierlich weiterentwickelt.

Die Zukunft mit Drupal Canvas

Drupal Canvas verbessert nicht nur die heutige Erfahrung bei der Seitenerstellung, sondern bietet auch eine zukunftsorientierte Vision für das Drupal-Ökosystem. Mit intuitiveren Benutzeroberflächen, modularen Komponenten und einer community-getriebenen Entwicklung werden Content-Management und Seitendesign zunehmend zugänglicher, schneller und benutzerfreundlicher.

 

Son Güncelleme: 18/12/2025

Unsere Buros

Frankfurt

Bleichstr. 26 64283 Darmstadt
Deutschland

+49 (0) 6151 – 492 70 23 

[email protected]

 İstanbul

GOSB Teknopark Hi-Tech Bina 3.Kat
B3 Gebze - KOCAELİ

+90 262 678 8872 

[email protected]

Dublin

20 Harcourt Street, Dublin 2, D02 H364

+353 (87) 198 6950 

[email protected]