Live show - Display Builder & UI Suite DaisyUI by WebWash !
Author
G4MBINI
Tags
drupal-planet
display building
webwash
design system
Reading time
3min
Comments
https://git…

It was fantastic to see Ivan Zugec diving deep into our ecosystem! We actually popped into the chat during the stream (he jokingly referred to us as the "End Boss"), and it was great to see him exploring the capabilities of Display Builder alongside UI Suite DaisyUI.

Here is our recap of his session available on WebWash youtube channel:

The Setup: UI Suite DaisyUI & Display Builder

Ivan started by demonstrating how to get up and running with our tools. He highlighted a crucial tip for early adopters: as of his recording, you currently need the dev version of UI Patterns to run the latest Display Builder successfully—a detail we are working on fixing soon.

  • Theme Generation: He used our starter kit to generate a sub-theme and showed how to compile the Tailwind assets using Vite.
  • Visual Interface: He showcased the "canvas-like" experience of Display Builder, walking through the Libraries (components), Layers, and Props/Slots configuration.

Key Demos & "Aha!" Moments

Ivan moved beyond basic installation to show how Display Builder acts as a true site-building tool, not just a page builder.

  • Global Layouts & Conditions: He replaced the standard Drupal block placement with a Display Builder layout. He showed how to use visibility conditions to create distinct layouts for specific paths (like a different navbar color on User pages) or to show specific alerts only on the Login page.
  • Entity Displays (SDC Integration): This was a highlight. He customized the Full Content view using a "Hero" component and the Teaser view using "Card" components. He demonstrated how easily Drupal fields map to SDC slots (e.g., mapping an image field to a card's image slot).
  • Views Integration: He used UI Patterns Views to turn a standard list into a responsive grid layout without writing custom CSS, simply by configuring the View format to use a component.

The "Magic" Moment: Real-Time Collaboration

We were holding our breath, but the demo gods were kind! Ivan tested our Real-Time Collaboration feature. He opened two separate browser windows and successfully demonstrated dragging and dropping components in one window while watching them update instantly in the other. He noted that this is powered by HTMX in the backend.

The Verdict: Display Builder vs. Canvas

Ivan offered a very thoughtful distinction between Display Builder and other tools like Drupal Canvas:

  • Drupal Canvas: He sees this as excellent for specific landing pages and marketing content.
  • Display Builder: He positioned our tool as a Site Builder's tool. It provides systemic control over layouts, entity displays, and view modes, offering more functionality for the structural parts of a Drupal site compared to a pure landing page builder.

Community Shoutout

We really appreciated Ivan mentioning our monthly community meetings. As he noted, we are a friendly bunch, and anyone is welcome to join us on Google Meet to ask questions or just say hello.

It was a long session, but a massive win for the SDC (Single Directory Components) and UI Suite ecosystem! Thanks for the coverage, Ivan!