Öffentliches Block-Render-Markup

Diese Datei beantwortet die praktische Frage beim Seitenaufbau: "Welches öffentliche HTML und welche WebBlocks-UI-Klassen werden gerendert, wenn ich diesen CMS-Block hinzufüge?" Verwenden Sie sie beim manuellen Zusammenstellen von Seiten, beim Prüfen der Page-Converter-Ausgabe oder wenn Sie einen KI-Assistenten bitten, eine CMS-Seite aus strukturierten Blöcken zu erstellen.

Root-besitzende Blöcke rendern ihre eigene semantische öffentliche Wurzel und setzen data-wb-public-block-type auf diese Wurzel. Beispiele sind Section, Container, Grid, Card, Hero, Gallery und Navbar. Nicht root-besitzende Blöcke rendern ihr inneres Markup und werden normalerweise vom Slot-Renderer in .wb-public-block mit data-wb-public-block-type eingefasst. Beispiele sind Plain Text, Rich Text, Button Link, Alert und die meisten Navigations-Hilfsblöcke.

Diese Datei wurde aus den echten öffentlichen Renderer-Blade-Quellen erstellt. Das Beispiel-HTML ist repräsentativ, muss aber mit dem Renderer-Vertrag kompatibel bleiben. Die primäre Paket-Renderer-Quelle ist packages/webblocks-cms/resources/views/pages/partials/blocks/.blade.php; Root-Kompatibilitätsdateien unter resources/views/pages/partials/blocks/.blade.php delegieren in der Regel zurück an den Paket-Namespace. Block::publicRenderView() löst zuerst Paket-Block-Partials auf, dann Root-Kompatibilitäts-Partials und zuletzt das sichere Fallback-/Missing-Renderer-Partial.

Empfohlene Block-Komposition für neue Seiten

Bevorzugen Sie für neue, manuell erstellte CMS-Seiten diese Blöcke:

Layout und Rhythmus: section, container, grid, cluster.
Seiten- und Abschnittstexte: content_header, header, plain_text, rich-text, button_link, button, wenn es sich um eine verwaltete Hero-/CTA-Aktion handelt.
Marketing und strukturierte Inhalte: hero, cta, columns mit column_item, card mit card_header, card_body und card_footer, accordion mit FAQ-artigen Kindzeilen, gallery, image.
Navigation und gemeinsames Seitengerüst: sticky-navbar, navbar-brand, navbar-navigation, header-actions, search-form, dazu Sidebar-Blöcke für Doku-/Sidebar-Layouts.

Bevorzugen Sie diese Blöcke für neue, manuell erstellte Seiten nicht, es sei denn, Sie bewahren Legacy-Inhalte, Converter-Ausgaben oder Kompatibilitätsverhalten: feature-grid, feature-item, card-grid, contact-info, faq-list, menu, metric-card, showcase-list, slider, stats, tabs, testimonial, text, callout sowie reine Fallback-Renderer-Pfade.

Verwenden Sie Safe HTML (html) und Fallback-Renderer nur als geprüfte Rückfalloption, wenn der Inhalt noch nicht durch strukturierte CMS-Blöcke abgebildet werden kann. Sie sollten nicht die Standardausgabe für migrierte oder KI-erstellte Seiten sein.

Typische Seitenbäume

Marketing-Seite:

Page
└── main slot
    └── Section
        └── Container
            ├── Content Header or Hero
            ├── Grid or Columns
            └── CTA

Kartenraster:

Section
└── Container
    └── Grid
        └── Card
            ├── Card Header
            ├── Card Body
            └── Card Footer

Navbar / gemeinsamer Header:

Navbar
└── Container
    └── Cluster
        ├── Navbar Brand
        └── Cluster
            ├── Navbar Navigation
            └── Header Actions

FAQ:

Section
└── Container
    └── Accordion
        ├── FAQ child row
        ├── FAQ child row
        └── FAQ child row

Der aktuelle Accordion-Renderer verwendet veröffentlichte Kindzeilen mit Titel und Inhalt als aufklappbare Elemente. Der Page Converter schreibt benachbarte <details>-Gruppen in faq-Kindzeilen, wenn sowohl der accordion- als auch der faq-Vertrag verfügbar ist.

Der Standard-Wrapper des Haupt-Slots rendert nicht root-besitzende Blöcke innerhalb von:

<div class="wb-public-block" data-wb-public-block-type="plain-text">
  ...
</div>

Root-besitzende Blöcke setzen data-wb-public-block-type stattdessen auf ihr eigenes öffentliches Wurzelelement.

Section (`section`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/section.blade.php

Gerendertes HTML

<section class="wb-section wb-section-lg wb-stack" data-wb-public-block-type="section">
  <!-- child blocks -->
</section>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-section, Abstandsklasse aus sectionSpacingClass(), wb-stack.

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.spacing	sm	sectionSpacingClass() fügt wb-section-sm hinzu.
settings.spacing	lg	sectionSpacingClass() fügt wb-section-lg hinzu.
settings.spacing	Standard/leer	Verwendet nur wb-section wb-stack.
status	unpublished	Der Block wird von normalen öffentlichen Block-Baum-Abfragen nicht einbezogen.

Geeignet für / Nicht geeignet für

Geeignet für: große Seitenabschnitte und die Gruppierung von Blöcken.

Nicht geeignet für: sichtbaren Text direkt in den Section-Einstellungen; verwenden Sie untergeordnete Textblöcke.

Hinweise

Der Block besitzt seine Wurzel <section>. Er rendert alle Kindblöcke über das normale Block-Partial. Er hat keinen übersetzbaren Textvertrag; sichtbarer Inhalt sollte aus Kindblöcken bestehen.

Container (`container`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/container.blade.php

Gerendertes HTML

<div class="wb-container wb-container-lg wb-stack" data-wb-public-block-type="container">
  <!-- child blocks -->
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-container, Breitenklasse aus containerWidthClass(), Flow-Klasse aus containerFlowClass().

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.width	sm/md/lg/xl/full	containerWidthClass() fügt wb-container-sm, wb-container-md, wb-container-lg, wb-container-xl oder wb-container-full hinzu.
settings.width	Standard/leer	Verwendet das Basis-wb-container.
settings.flow	stack/Standard	containerFlowClass() fügt wb-stack hinzu.
settings.flow	none	Es wird keine Flow-Klasse hinzugefügt.

Geeignet für / Nicht geeignet für

Geeignet für: Breitensteuerung innerhalb von Abschnitten, Navbars und Seitenrahmen.

Nicht geeignet für: Container als visuelle Karte oder Inhaltsfläche.

Hinweise

Der Block besitzt seine Wurzel <div>. Er rendert Kindblöcke direkt. Breiten- und Flow-Einstellungen ändern die Klassen.

Grid (`grid`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/grid.blade.php

Gerendertes HTML

<div class="wb-grid wb-grid-3 wb-gap-4" data-wb-public-block-type="grid">
  <!-- child blocks -->
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-grid, Spaltenklasse aus gridColumnsClass(), Abstandsklasse aus gridGapClass().

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.columns	2	gridColumnsClass() fügt wb-grid-2 hinzu.
settings.columns	4	gridColumnsClass() fügt wb-grid-4 hinzu.
settings.columns	Standard/3/sonstige	gridColumnsClass() fügt wb-grid-3 hinzu.
settings.gap	3/4/6	gridGapClass() fügt wb-gap-3, wb-gap-4 oder wb-gap-6 hinzu.
settings.gap	Standard/leer	Über wb-grid hinaus wird keine Abstandsklasse hinzugefügt.

Geeignet für / Nicht geeignet für

Geeignet für: mehrspaltige Karten-, Medien- oder Inhaltslayouts.

Nicht geeignet für: einfache Button-Reihen oder Navbar-Interna; verwenden Sie Cluster.

Hinweise

Der Block besitzt seine Wurzel <div>. Er rendert Kindblöcke direkt. Spalten- und Abstandseinstellungen ändern die Klassen.

Cluster (`cluster`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/cluster.blade.php

Gerendertes HTML

<div class="wb-cluster wb-cluster-2 wb-cluster-between wb-cluster-center" data-wb-public-block-type="cluster">
  <!-- child blocks -->
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-cluster, plus Klassen aus den Gap-, Justify-, Align-, Wrap- und Width-Helfern.

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.gap	none	clusterGapClass() fügt wb-cms-cluster-gap-none hinzu.
settings.gap	xs	clusterGapClass() fügt wb-gap-1 hinzu.
settings.gap	sm oder 2	clusterGapClass() fügt wb-cluster-2 hinzu.
settings.gap	md oder 4	clusterGapClass() fügt wb-cluster-4 hinzu.
settings.gap	lg oder 6	clusterGapClass() fügt wb-cluster-6 hinzu.
settings.alignment	center/end/between	clusterAlignmentClass() fügt wb-cluster-center, wb-cluster-end oder wb-cluster-between hinzu.
settings.items_alignment	start/end/stretch	clusterAlignClass() fügt wb-items-start, wb-items-end oder wb-cms-items-stretch hinzu; center fügt keine Klasse hinzu.
settings.wrap	nowrap	clusterWrapClass() fügt wb-flex-nowrap hinzu.
settings.width	full	clusterWidthClass() fügt wb-w-full hinzu.

Geeignet für / Nicht geeignet für

Geeignet für: horizontale Komposition, Aktionsreihen und Navbar-Interna.

Nicht geeignet für: Grid für eine einzelne horizontale Reihe kleiner Bedienelemente.

Hinweise

Der Block besitzt seine Wurzel <div>. Er rendert Kindblöcke direkt. Dies ist das normale horizontale Kompositionsprimitiv für Buttons und Navbar-Interna.

Content Header (`content_header`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/content_header.blade.php

Gerendertes HTML

<header class="wb-content-header wb-text-center" data-wb-public-block-type="content-header">
  <h1 class="wb-content-title">Page title</h1>
  <p class="wb-content-subtitle">Intro text</p>
  <div class="wb-content-meta">
    <span>Meta item</span>
    <span class="wb-content-meta-divider"></span>
    <span>Another item</span>
  </div>
</header>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-content-header, optionale Ausrichtungsklasse, wb-content-title, wb-content-subtitle, wb-content-meta, wb-content-meta-divider.

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.alignment	left/center/right	contentHeaderAlignmentClass() fügt wb-text-left, wb-text-center oder wb-text-right hinzu.
title	beliebiger Text	Wird als gerendert.
subtitle	beliebiger Text	Rendert , sofern vorhanden.
meta	Liste	Rendert .wb-content-meta-Spans, getrennt durch .wb-content-meta-divider.

Geeignet für / Nicht geeignet für

Geeignet für: Seiten- oder große Abschnittseinleitungen mit Titel, Einleitung und Metadaten.

Nicht geeignet für: verschachtelte Karteninhalte oder Stellen, an denen die Überschrift kein H1 sein sollte.

Hinweise

Der Block besitzt seine Wurzel <header>. Er rendert den Titel immer als <h1>. Er ist kein Container.

Hero (`hero`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/hero.blade.php

Gerendertes HTML

<section class="wb-card wb-promo wb-card-accent" data-wb-public-block-type="hero">
  <div class="wb-card-body wb-promo-copy wb-stack wb-gap-3 wb-text-center">
    <p class="wb-eyebrow">Eyebrow</p>
    <h1 class="wb-promo-title">Hero title</h1>
    <p class="wb-promo-text">Hero copy.</p>
    <div class="wb-promo-actions wb-cluster wb-cluster-2">
      <a href="/start" class="wb-btn wb-btn-primary">Start</a>
    </div>
  </div>
</section>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-card, wb-promo, optional wb-card-muted oder wb-card-accent, wb-card-body, wb-promo-copy, wb-stack, wb-gap-3, optional wb-text-center, wb-eyebrow, wb-promo-title, wb-promo-text, wb-promo-actions, wb-cluster, wb-btn.

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
variant	muted oder soft	Fügt der Promo-Karte wb-card-muted hinzu.
variant	accent	Fügt der Promo-Karte wb-card-accent hinzu.
variant	Standard/sonstige	Verwendet wb-card wb-promo ohne Muted-/Accent-Modifikator.
settings.layout	centered	Fügt .wb-promo-copy wb-text-center hinzu.
settings.title_tag	h1/h2/h3	Hero erlaubt h1, h2 oder h3; CTA rendert seinen Titel als h2.
untergeordnete button-Blöcke	veröffentlicht mit Label und URL	Rendert über _actions bis zu zwei verwaltete .wb-btn-Aktionen.

Geeignet für / Nicht geeignet für

Geeignet für: Marketing-Einleitungen am Seitenanfang mit verwalteten CTA-Buttons.

Nicht geeignet für: allgemeine Abschnittsgruppierung oder beliebige verschachtelte Inhalte.

Hinweise

Der Block besitzt seine Promo-Wurzel <section>. Er akzeptiert nur button-Kindblöcke für verwaltete Aktionen und rendert höchstens zwei veröffentlichte Kinder mit URL und Label. settings.title_tag kann das Überschriftselement auf h1, h2 oder h3 ändern.

CTA (`cta`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/cta.blade.php

Gerendertes HTML

<section class="wb-card wb-promo wb-card-muted" data-wb-public-block-type="cta">
  <div class="wb-card-body wb-promo-copy wb-stack wb-gap-3">
    <p class="wb-eyebrow">Ready</p>
    <h2 class="wb-promo-title">Start now</h2>
    <p class="wb-promo-text">CTA body.</p>
    <div class="wb-promo-actions wb-cluster wb-cluster-2">
      <a href="/contact" class="wb-btn wb-btn-primary">Contact</a>
    </div>
  </div>
</section>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-card, wb-promo, optional wb-card-muted oder wb-card-accent, wb-card-body, wb-promo-copy, wb-stack, wb-gap-3, wb-eyebrow, wb-promo-title, wb-promo-text, wb-promo-actions, wb-cluster, wb-btn.

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
variant	muted oder soft	Fügt der Promo-Karte wb-card-muted hinzu.
variant	accent	Fügt der Promo-Karte wb-card-accent hinzu.
variant	Standard/sonstige	Verwendet wb-card wb-promo ohne Muted-/Accent-Modifikator.
settings.layout	centered	Fügt .wb-promo-copy wb-text-center hinzu.
settings.title_tag	im Renderer fest auf h2	Hero erlaubt h1, h2 oder h3; CTA rendert seinen Titel als h2.
untergeordnete button-Blöcke	veröffentlicht mit Label und URL	Rendert über _actions bis zu zwei verwaltete .wb-btn-Aktionen.

Geeignet für / Nicht geeignet für

Geeignet für: fokussierte Conversion-Abschnitte mit einer kurzen Aktionsreihe.

Nicht geeignet für: vollständige Seiteneinleitungen; verwenden Sie Hero oder Content Header.

Hinweise

Der Block besitzt seine Promo-Wurzel <section>. Er akzeptiert nur button-Kindblöcke für verwaltete Aktionen und rendert höchstens zwei veröffentlichte Kinder mit URL und Label.

Card (`card`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/card.blade.php

Gerendertes HTML

<article class="wb-card" data-wb-public-block-type="card">
  <div class="wb-card-header">...</div>
  <div class="wb-card-body">...</div>
  <div class="wb-card-footer">...</div>
</article>

Legacy-Fallback ohne Regionen:

<article class="wb-card" data-wb-public-block-type="card">
  <div class="wb-card-header">Subtitle</div>
  <div class="wb-card-body wb-stack wb-gap-2">
    <strong>Title</strong>
    <p class="wb-m-0">Description</p>
  </div>
  <div class="wb-card-footer">
    <a href="/target" class="wb-btn wb-btn-secondary">Action</a>
  </div>
</article>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-card, wb-card-header, wb-card-body, wb-card-footer, optional wb-stack, wb-gap-2, wb-m-0, wb-btn, wb-btn-secondary.

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.layout_name	beliebiger gespeicherter Wert	Nur Admin-/Layout-Metadaten; keine Auswirkung auf öffentliche Klassen im aktuellen Renderer.
Kindblöcke	veröffentlichte Kinder	Werden innerhalb der Karte oder der Regionswurzel gerendert.
Legacy-Card-Felder	ältere Card-Zeilen ohne Regionskinder	Der Card-Elternblock kann einen minimalen Legacy-Header/Body/Footer-Fallback rendern.

Geeignet für / Nicht geeignet für

Geeignet für: gerahmte, wiederholte Elemente mit expliziten Header-, Body- und Footer-Kindern.

Nicht geeignet für: das Umschließen ganzer Seitenabschnitte oder das Verschachteln von Cards in Cards.

Hinweise

Der Block besitzt sein Wurzelelement <article>. Die normale Struktur besteht aus untergeordneten card_header-, card_body- und card_footer-Regionsblöcken. Der Fallback-Pfad gilt nur für ältere gespeicherte Card-Zeilen ohne untergeordnete Regionen.

Card-Header (`card_header`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/card_header.blade.php

Gerendertes HTML

<div class="wb-card-header" data-wb-public-block-type="card-header">
  <!-- child blocks -->
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-card-header.

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.layout_name	beliebiger gespeicherter Wert	Nur Admin-/Layout-Metadaten; keine Auswirkung auf öffentliche Klassen im aktuellen Renderer.
untergeordnete Blöcke	veröffentlichte untergeordnete Elemente	Werden innerhalb der Card oder der Regionswurzel gerendert.
Legacy-Card-Felder	ältere Card-Zeilen ohne untergeordnete Regionen	Das übergeordnete Card-Element kann einen minimalen Legacy-Fallback für Header/Body/Footer rendern.

Geeignet für / Nicht geeignet für

Geeignet für: die Header-Region innerhalb von Card.

Nicht geeignet für: die Platzierung außerhalb von Card.

Hinweise

Der Block besitzt seine Card-Regionswurzel und rendert untergeordnete Blöcke. Er ist ausschließlich für die Verwendung unter card vorgesehen.

Card-Body (`card_body`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/card_body.blade.php

Gerendertes HTML

<div class="wb-card-body" data-wb-public-block-type="card-body">
  <!-- child blocks -->
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-card-body.

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.layout_name	beliebiger gespeicherter Wert	Nur Admin-/Layout-Metadaten; keine Auswirkung auf öffentliche Klassen im aktuellen Renderer.
untergeordnete Blöcke	veröffentlichte untergeordnete Elemente	Werden innerhalb der Card oder der Regionswurzel gerendert.
Legacy-Card-Felder	ältere Card-Zeilen ohne untergeordnete Regionen	Das übergeordnete Card-Element kann einen minimalen Legacy-Fallback für Header/Body/Footer rendern.

Geeignet für / Nicht geeignet für

Geeignet für: die Hauptinhaltsregion innerhalb von Card.

Nicht geeignet für: die Platzierung außerhalb von Card.

Hinweise

Der Block besitzt seine Card-Regionswurzel und rendert untergeordnete Blöcke. Er ist ausschließlich für die Verwendung unter card vorgesehen.

Card-Footer (`card_footer`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/card_footer.blade.php

Gerendertes HTML

<div class="wb-card-footer" data-wb-public-block-type="card-footer">
  <!-- child blocks -->
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-card-footer.

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.layout_name	beliebiger gespeicherter Wert	Nur Admin-/Layout-Metadaten; keine Auswirkung auf öffentliche Klassen im aktuellen Renderer.
untergeordnete Blöcke	veröffentlichte untergeordnete Elemente	Werden innerhalb der Card oder der Regionswurzel gerendert.
Legacy-Card-Felder	ältere Card-Zeilen ohne untergeordnete Regionen	Das übergeordnete Card-Element kann einen minimalen Legacy-Fallback für Header/Body/Footer rendern.

Geeignet für / Nicht geeignet für

Geeignet für: Aktionen oder ergänzende Footer-Inhalte innerhalb von Card.

Nicht geeignet für: die Platzierung außerhalb von Card.

Hinweise

Der Block besitzt seine Card-Regionswurzel und rendert untergeordnete Blöcke. Er ist ausschließlich für die Verwendung unter card vorgesehen.

Header (`header`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/header.blade.php

Gerendertes HTML

<h2 class="wb-text-center" id="section-anchor" data-wb-public-block-type="header">Heading</h2>

Wichtigste CSS- / WebBlocks-UI-Klassen

Optionale Ausrichtungsklasse aus headerAlignmentClass().

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
variant	h1-h6	Steuert das Überschriftenelement.
variant	leer/sonstiges	Standard ist .
settings.alignment	left/center/right	headerAlignmentClass() fügt wb-text-left, wb-text-center oder wb-text-right hinzu.
settings.anchor oder Legacy-URL-Fallback	sicherer Anker-String	Fügt ein id-Attribut für seiteninterne Links und das Inhaltsverzeichnis hinzu.

Geeignet für / Nicht geeignet für

Geeignet für: semantische Überschriften innerhalb des Seiteninhalts.

Nicht geeignet für: Seiteneinleitungen, die Untertitel/Meta benötigen; verwenden Sie Content Header.

Hinweise

Der Block besitzt das eigentliche Überschriftenelement (h1 bis h6). variant steuert die Überschriftenebene, Standard ist h2. settings.anchor oder der Legacy-URL-Fallback kann ein id-Attribut hinzufügen.

Plain Text (`plain_text`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/plain_text.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="plain-text">
  <p class="wb-text-center">Plain copy.</p>
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

Optionale Ausrichtungsklasse aus plainTextAlignmentClass(). Der generische Wrapper verwendet wb-public-block.

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.alignment	left/center/right	plainTextAlignmentClass() fügt wb-text-left, wb-text-center oder wb-text-right zu hinzu.
content	Text	Wird maskiert in einen einzelnen Absatz ausgegeben.
status	unveröffentlicht	Der Block wird von normalen öffentlichen Blockbaum-Abfragen nicht einbezogen.

Geeignet für / Nicht geeignet für

Geeignet für: kurze, unformatierte Texte.

Nicht geeignet für: formatierte Absätze, Listen, Links oder Überschriften; verwenden Sie Rich Text/Header.

Hinweise

Der Block besitzt laut Block::ownsPublicRoot() keine eigene öffentliche Wurzel, daher wird er vom normalen Slot-Rendering umschlossen. Der Renderer selbst gibt nur <p> aus.

Rich Text (`rich-text`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/rich-text.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="rich-text">
  <div class="wb-rich-text wb-rich-text-readable">
    <p>Safe <strong>formatted</strong> copy.</p>
  </div>
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-rich-text, wb-rich-text-readable sowie das generische wb-public-block.

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
content	sicheres Rich-HTML	SafeRichTextRenderer gibt bereinigten Inhalt innerhalb von wb-rich-text wb-rich-text-readable aus.
content	nach der Bereinigung leer	Der Renderer gibt nichts aus.
nicht unterstützte HTML-Elemente/Klassen	im Inhalt vorhanden	Werden vom sicheren Renderer entfernt, statt auf öffentliche Klassen abgebildet zu werden.

Geeignet für / Nicht geeignet für

Geeignet für: Fließtext mit sicherer Inline-Formatierung, Links und einfachen Listen.

Nicht geeignet für: Überschriften, Medien, Tabellen, Buttons oder rohes Layout-Markup.

Hinweise

Der Renderer gibt nichts aus, wenn der bereinigte Inhalt leer ist. Er besitzt nicht die Wurzel auf Slot-Ebene. Der Inhalt wird über SafeRichTextRenderer gerendert.

Button-Link (`button_link`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/button_link.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="button-link">
  <a href="/start" class="wb-btn wb-btn-primary">Start</a>
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

Klasse aus buttonLinkVariantClass(), üblicherweise wb-btn plus eine Variantenklasse.

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
variant	secondary	buttonLinkVariantClass() gibt wb-btn wb-btn-secondary aus.
variant	Standard/sonstiges	buttonLinkVariantClass() gibt wb-btn wb-btn-primary aus.
settings.url	sichere URL	Rendert das href des Ankers; eine unsichere/leere URL rendert nichts.
settings.target	_blank	Fügt target="_blank" rel="noopener noreferrer" hinzu.

Geeignet für / Nicht geeignet für

Geeignet für: eigenständige redaktionelle Links im Button-Stil.

Nicht geeignet für: verwaltete Hero-/CTA-Aktionen, bei denen der button-Child-Vertrag erwartet wird.

Hinweise

Der Renderer gibt ohne eine sichere URL nichts aus. Das Ziel _blank fügt target="_blank" und rel="noopener noreferrer" hinzu. Er erhält normalerweise den generischen öffentlichen Block-Wrapper, sofern er nicht in einem wurzelbesitzenden Elternelement verschachtelt ist.

Bild (`image`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/image.blade.php

Gerendertes HTML

<figure class="wb-stack wb-gap-2" data-wb-public-block-type="image">
  <a href="/target">
    <img src="/media/photo.jpg" alt="Alt text" width="1200" height="800">
  </a>
  <figcaption>Caption</figcaption>
</figure>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-stack, wb-gap-2.

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
media_id	ausgewähltes Medium	Rendert mit unter Verwendung von Medien-URL und -Abmessungen.
url	sichere URL	Umschließt nur das Bild mit einem Anker.
caption	übersetzter Text	Rendert , falls vorhanden.
Alt-Text	übersetzt oder Medien-Fallback	Rendert das alt-Attribut des Bildes.

Geeignet für / Nicht geeignet für

Geeignet für: einzelne semantische Bilder mit optionaler Bildunterschrift/optionalem Link.

Nicht geeignet für: Bildersammlungen; verwenden Sie Galerie.

Hinweise

Der Block besitzt seine <figure>-Wurzel und gibt ohne Medium nichts aus. Der optionale Link umschließt nur das Bild, wenn die URL sicher ist (http, https, /, #, mailto oder tel).

Galerie (`gallery`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/gallery.blade.php

Gerendertes HTML

<div class="wb-gallery wb-gallery--grid wb-gallery--cols-3 wb-gallery--gap-4 wb-gallery--aspect-16-9"
  data-wb-public-block-type="gallery"
  data-wb-gallery-variant="grid"
  data-wb-gallery-captions="below"
  aria-label="Gallery">
  <div class="wb-gallery-grid">
    <figure class="wb-gallery-item">
      <a href="/media/full.jpg" class="wb-gallery-trigger" data-wb-gallery-target="#wb-gallery-viewer-10">
        <img src="/media/thumb.jpg" alt="Alt" class="wb-gallery-media">
      </a>
      <figcaption class="wb-gallery-caption">Caption</figcaption>
    </figure>
  </div>
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-gallery, wb-gallery--{variant}, wb-gallery--cols-{n}, wb-gallery--gap-{n}, wb-gallery--aspect-{ratio}, wb-gallery-grid, wb-gallery-item, wb-gallery-trigger oder wb-gallery-link, wb-gallery-media, wb-gallery-caption, wb-gallery-caption-title, wb-gallery-caption-meta.

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.variant	grid/masonry/masonary/collage	galleryVariant() fügt wb-gallery--grid, wb-gallery--masonry oder wb-gallery--collage hinzu; masonary wird zu masonry normalisiert.
settings.columns	2/3/4/5	galleryColumns() fügt wb-gallery--cols-{n} hinzu; Standard ist 3.
settings.gap	none/sm/md/lg	galleryGap() fügt wb-gallery--gap-{value} hinzu; Standard ist md.
settings.aspect_ratio	auto/square/4:3/16:9/portrait	galleryAspectRatio() fügt wb-gallery--aspect-{value} hinzu, wobei : als - ausgegeben wird.
settings.captions_mode	hidden/below/overlay/on-hover	Steuert das Markup für Bildunterschriften unterhalb oder als Overlay; Standard ist below.
settings.overlay_mode	none/gradient/solid	Steuert den Overlay-Beschriftungsmodifikator; Standard ist gradient.
settings.lightbox_enabled	true/Standard	Verwendet .wb-gallery-trigger und registriert gallery-viewer in PublicOverlayRegistry.
settings.lightbox_enabled	false	Verwendet .wb-gallery-link und kein Viewer-Modal.

Geeignet für / Nicht geeignet für

Geeignet für: strukturierte Bildersammlungen mit Bildunterschriften und optionaler Lightbox.

Nicht geeignet für: Einleitungstexte von Abschnitten; platzieren Sie Content Header/Rich Text vor der Galerie.

Hinweise

Der Block besitzt seine Galerie-Wurzel und registriert gallery-viewer-HTML in PublicOverlayRegistry, wenn die Lightbox aktiviert ist. Varianten-, Spalten-, Abstands-, Seitenverhältnis-, Beschriftungs-, Overlay- und Lightbox-Einstellungen ändern Attribute/Klassen. Ältere, einstellungsbasierte Elemente bleiben lesbar.

Spalten (`columns`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/columns.blade.php

Gerendertes HTML

<section class="wb-stack wb-gap-4" data-wb-public-block-type="columns">
  <div class="wb-stack wb-gap-1">
    <h2>Columns title</h2>
    <p class="wb-text-muted">Subtitle</p>
  </div>
  <div class="wb-stack wb-gap-2">
    <p class="wb-m-0">Intro copy.</p>
  </div>
  <div class="wb-grid wb-grid-3">
    <!-- column_item or feature-item output -->
  </div>
</section>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-stack, wb-gap-4, wb-gap-1, wb-text-muted, wb-gap-2, wb-m-0, wb-grid, wb-grid-2, wb-grid-3, wb-grid-4.

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
variant	cards	Untergeordnete Elemente werden im Card-Stil gerendert.
variant	stats	Untergeordnete Elemente werden im Statistik-Stil gerendert.
variant	plain/Standard	Untergeordnete Elemente werden im einfachen Stack-Stil gerendert.
Anzahl der Kinder	1	Verwendet wb-stack wb-gap-3 für das Element-Layout.
Anzahl der Kinder	2/3/4+	Verwendet wb-grid wb-grid-2, wb-grid-3 oder wb-grid-4.

Geeignet für / Nicht geeignet für

Geeignet für: strukturierte Feature-, Statistik- oder einfache Spaltengruppen.

Nicht geeignet für: beliebige Layout-Raster, bei denen Grid + Card klarer ist.

Hinweise

Der Block besitzt sein Wurzelelement <section>. Die Anzahl der Kinder steuert die Grid-Klasse: ein Kind verwendet wb-stack wb-gap-3, zwei verwenden wb-grid wb-grid-2, drei verwenden wb-grid wb-grid-3, andernfalls wb-grid wb-grid-4. variant wird an die untergeordneten column_item-/feature-item-Renderer weitergegeben.

Spaltenelement (`column_item`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/column_item.blade.php

Gerendertes HTML

Cards-Variante:

<div class="wb-card">
  <div class="wb-card-body wb-stack wb-gap-2">
    <a href="/item" class="wb-no-decoration">
      <div class="wb-stack wb-gap-2">
        <strong>Title</strong>
        <p class="wb-m-0">Copy.</p>
      </div>
    </a>
  </div>
</div>

Plain-Variante:

<div class="wb-stack wb-gap-2">
  <strong>Title</strong>
  <p class="wb-m-0">Copy.</p>
</div>

Stats-Variante:

<div class="wb-stat">
  <div class="wb-stat-label">Label</div>
  <div class="wb-stat-value">Value</div>
  <div class="wb-stat-delta">Detail</div>
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-card, wb-card-body, wb-stack, wb-gap-2, wb-no-decoration, wb-m-0, wb-stat, wb-stat-label, wb-stat-value, wb-stat-delta.

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
übergeordnete columns-Variante	cards	Rendert .wb-card > .wb-card-body.
übergeordnete columns-Variante	stats	Rendert .wb-stat mit Label/Wert/Detail.
übergeordnete columns-Variante	plain/Standard	Rendert .wb-stack wb-gap-2.
url	sichere URL	Die Varianten cards/plain umschließen den Inhalt mit a.wb-no-decoration; stats rendert im aktuellen Renderer keinen Link.

Geeignet für / Nicht geeignet für

Geeignet für: untergeordnete Elemente von Spalten.

Nicht geeignet für: eigenständigen Seiteninhalt; verwenden Sie Card oder Stat Card, wenn das Element unabhängig steht.

Hinweise

Dieser Renderer ändert sich erheblich je nach Variante des übergeordneten columns-Blocks. Er besitzt keine Wurzel auf Slot-Ebene und wird normalerweise vom Elternelement gerendert.

Feature-Grid (`feature-grid`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/feature-grid.blade.php

Gerendertes HTML

<section class="wb-stack wb-gap-4" data-wb-public-block-type="feature-grid">
  <div class="wb-grid wb-grid-3">
    <div class="wb-card">...</div>
  </div>
</section>

Wichtigste CSS- / WebBlocks-UI-Klassen

Delegiert an Spalten: wb-stack, wb-gap-4, wb-grid, wb-card sowie zugehörige column_item-Klassen.

Einstellungen -> Klassen- / Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
Renderer-Verhalten	delegierter Alias	Delegiert an einen bestehenden Renderer-Pfad; die genaue Einstellungszuordnung folgt, wo sichtbar, dem Delegat.
bevorzugt für neue Seiten	n. z.	Verwenden Sie statt dieses Alias-/Kompatibilitätsblocks bevorzugt den unter Hinweise genannten kanonischen Block.

Geeignet für / Nicht geeignet für

Geeignet für: bereits vorhandene Legacy-Inhalte vom Typ feature-grid.

Nicht geeignet für: neue, manuell aufgebaute Seiten; verwenden Sie Columns mit Column Item oder Grid mit Card.

Hinweise

Der Renderer repliziert den Block, filtert die Kind-Blöcke auf feature-item und das legacy-kompatible column_item, erzwingt variant = cards und bindet den Columns-Renderer ein. Laut Helper besitzt er nicht das öffentliche Root-Element, daher kann das Rendering auf oberster Ebene wb-public-block hinzufügen.

Feature Item (`feature-item`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/feature-item.blade.php

Gerendertes HTML

<div class="wb-card">
  <div class="wb-card-body wb-stack wb-gap-2">
    <strong>Feature title</strong>
    <p class="wb-m-0">Feature copy.</p>
  </div>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

Delegiert an die Cards-Variante von Column Item: wb-card, wb-card-body, wb-stack, wb-gap-2, wb-m-0.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
Renderer-Verhalten	delegierter Alias	Delegiert an einen bestehenden Renderer-Pfad; die genaue Einstellungszuordnung folgt, wo sichtbar, dem Delegat.
bevorzugt für neue Seiten	n. z.	Verwenden Sie statt dieses Alias-/Kompatibilitätsblocks bevorzugt den unter Hinweise genannten kanonischen Block.

Geeignet für / Nicht geeignet für

Geeignet für: Kind-Blöcke eines Legacy Feature Grid.

Nicht geeignet für: neue eigenständige Feature-Karten; verwenden Sie Card-Bereiche oder Column Item.

Hinweise

Dieser Renderer bindet column_item mit columnsVariant = cards ein. Er ist als Kind von feature-grid vorgesehen.

Accordion (`accordion`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/accordion.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="accordion">
  <div class="wb-stack wb-gap-3">
    <div class="wb-stack wb-gap-1">
      <h3>Questions</h3>
      <p>Intro copy.</p>
    </div>
    <div class="wb-stack-2">
      <details>
        <summary>Question?</summary>
        <div>Answer.</div>
      </details>
    </div>
  </div>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-stack, wb-gap-3, wb-gap-1, wb-stack-2, zusätzlich das generische wb-public-block.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
title/subtitle	vorhanden	Rendert Einleitungsüberschrift/-text oberhalb der Einträge.
Kind-Zeilen	veröffentlicht mit Titel und Inhalt	Rendert jede Zeile als ...-Aufklappelement.
Kind-Zeilen	Titel oder Inhalt fehlt	Wird von der aktuellen Eintragssammlung übersprungen.
Wrapper	Top-Level-Block ohne eigenes Root	Erhält den generischen .wb-public-block-Wrapper vom Slot-Renderer.

Geeignet für / Nicht geeignet für

Geeignet für: FAQ-/Aufklappgruppen.

Nicht geeignet für: einzelne Frage-Antwort-Karten; verwenden Sie FAQ nur für Kompatibilitäts-Kind-Zeilen.

Hinweise

Der Block rendert Kind-Zeilen als Akkordeon-Einträge, wenn jedes Kind über Titel und Inhalt verfügt. Er besitzt nicht das Root-Element auf Slot-Ebene. Der Page Converter schreibt Details-Einträge in faq-Zeilen, wenn der Contract verfügbar ist, und accordion übernimmt Titel/Inhalt der Kinder.

FAQ (`faq`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/faq.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="faq">
  <section class="wb-card wb-card-muted">
    <div class="wb-card-body wb-stack wb-gap-2">
      <strong>Question?</strong>
      <p class="wb-m-0">Answer.</p>
    </div>
  </section>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-card, wb-card-muted, wb-card-body, wb-stack, wb-gap-2, wb-m-0, zusätzlich das generische wb-public-block.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
title/content	vorhanden	Rendert eine einzelne gedämpfte Karte mit Frage und Antwort.
Kinder	veröffentlichte Kinder	Rendert einen zusätzlichen wb-stack wb-gap-4-Kind-Block-Bereich.
Verwendung als Akkordeon-Kind	innerhalb von Accordion	Accordion übernimmt Titel/Inhalt der FAQ-Zeile als Inhalt des Aufklappelements.

Geeignet für / Nicht geeignet für

Geeignet für: Kind-Zeilen von Akkordeon-Einträgen und einzelne Legacy-Frage-Antwort-Karten.

Nicht geeignet für: neue eigenständige FAQ-Bereiche; verwenden Sie Accordion als Eltern-Block.

Hinweise

FAQ ist ein Renderer für einzelne Frage-Antwort-Karten. Sind Kinder vorhanden, rendert er diese zusätzlich in einem wb-stack wb-gap-4-Block.

Navbar (`sticky-navbar`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/sticky-navbar.blade.php

Gerendertes HTML

<nav class="wb-navbar wb-navbar--static" data-wb-public-block-type="sticky-navbar">
  <!-- navbar child blocks -->
</nav>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-navbar, optional eine Klasse aus navbarPositionClass() wie wb-navbar--static.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.sticky_mode	sticky/Standard	Verwendet für das Sticky-Verhalten nur das Basis-wb-navbar.
settings.sticky_mode	static	navbarPositionClass() fügt wb-navbar--static hinzu.
settings.sticky_mode	fixed	navbarPositionClass() fügt wb-fixed hinzu.
Kind-Blöcke	veröffentlichte zulässige Kinder	Werden direkt innerhalb von gerendert.

Geeignet für / Nicht geeignet für

Geeignet für: gemeinsam genutzte öffentliche Header-/Navigations-Blockbäume.

Nicht geeignet für: das Erstellen einer separaten benutzerdefinierten Header-Hülle um das Navbar-Markup.

Hinweise

Die Bezeichnung des Blocks lautet Navbar, der persistierte Slug und die Renderer-Datei sind jedoch sticky-navbar. Er besitzt sein äußeres <nav>-Root und rendert Kind-Blöcke. Zu den zulässigen Kind-Typen gehören container, cluster, header, plain_text, rich-text, button_link, navbar-brand, navbar-navigation, header-actions und search-form.

Navbar Brand (`navbar-brand`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/navbar-brand.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="navbar-brand">
  <a href="/" class="wb-navbar-brand">
    <img src="/media/logo.svg" alt="Site name">
    <span class="wb-navbar-identity">
      <span>Site name</span>
      <span class="wb-navbar-brand-note">Tagline</span>
    </span>
  </a>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-navbar-brand, wb-navbar-identity, wb-navbar-brand-note, zusätzlich das generische wb-public-block, sofern der Block nicht in einem Root-besitzenden Eltern-Block verschachtelt ist.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.url	sichere URL	Die gespeicherte URL hat beim Marken-Link Vorrang.
settings.url	leer	Fällt auf den Startseitenpfad der Site zurück, danach auf /.
settings.target	_blank	Fügt target="_blank" rel="noopener noreferrer" hinzu.
settings.aria_label	Text	Wird als barrierefreie Beschriftung verwendet, wenn kein sichtbarer Text gerendert wird.
media_id	Logo-Medium	Rendert das Markenbild innerhalb von wb-navbar-brand.

Geeignet für / Nicht geeignet für

Geeignet für: Site-Identität innerhalb der Navbar.

Nicht geeignet für: vollständige Header-Layouts; kombinieren Sie stattdessen Navbar/Container/Cluster.

Hinweise

Der Block besitzt nicht die äußere Navbar-Hülle. Zuerst gilt die gespeicherte URL, dann der Startseitenpfad der Site, zuletzt /. Eine reine Logo-Ausgabe verwendet aria-label, wenn kein Text gerendert wird.

Navbar Navigation (`navbar-navigation`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/navbar-navigation.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="navbar-navigation">
  <div class="wb-cms-navbar-navigation">
    <div class="wb-dropdown wb-dropdown-end wb-cms-navbar-mobile-toggle">
      <button class="wb-navbar-toggle wb-cms-navbar-mobile-toggle-button" data-wb-toggle="dropdown">
        <i class="wb-icon wb-icon-menu" aria-hidden="true"></i>
      </button>
      <div class="wb-dropdown-menu wb-cms-navbar-mobile-menu">
        <ul class="wb-navbar-nav wb-cms-navbar-mobile-nav">...</ul>
      </div>
    </div>
    <div class="wb-navbar-links">
      <ul class="wb-navbar-nav">
        <li class="wb-navbar-nav-item">
          <a href="/" class="wb-navbar-link is-active" aria-current="page">Home</a>
        </li>
      </ul>
    </div>
  </div>
</div>

Dropdown-Gruppen-Variante:

<li class="wb-navbar-nav-item wb-dropdown">
  <button class="wb-navbar-link" data-wb-toggle="dropdown" data-wb-target="#navbar-navigation-group-1-2">
    Group <i class="wb-icon wb-icon-chevron-down" aria-hidden="true"></i>
  </button>
  <div class="wb-dropdown-menu" id="navbar-navigation-group-1-2">
    <a class="wb-dropdown-item" href="/child">Child</a>
  </div>
</li>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-cms-navbar-navigation, wb-dropdown, wb-dropdown-end, wb-cms-navbar-mobile-toggle, wb-navbar-toggle, wb-cms-navbar-mobile-toggle-button, wb-icon, wb-icon-menu, wb-dropdown-menu, wb-cms-navbar-mobile-menu, wb-navbar-nav, wb-cms-navbar-mobile-nav, wb-navbar-links, wb-navbar-nav-item, wb-navbar-link, wb-dropdown-item, is-active.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.menu_key	bekannter NavigationItem-Menüschlüssel	Wählt den zu rendernden CMS-Navigationsbaum aus.
title	Text	Wird, falls vorhanden, als gemeinsames ARIA-Label verwendet.
Navigationsgruppen-Eintrag	Gruppe mit Kindern	Rendert den WebBlocks-UI-Dropdown-Trigger und .wb-dropdown-menu.
aktiver Eintrag	Übereinstimmung mit der aktuellen Seite	Fügt is-active und aria-current="page" hinzu.

Geeignet für / Nicht geeignet für

Geeignet für: CMS-verwaltete Menülinks innerhalb der Navbar.

Nicht geeignet für: manuelle Button-Reihen; verwenden Sie Button Link oder Cluster.

Hinweise

Der eigentliche Core-Slug lautet navbar-navigation. Er rendert CMS-NavigationItem-Bäume aus dem ausgewählten Menüschlüssel. Er besitzt nicht die äußere Navbar-Hülle. Für Gruppenmenüs und das mobile Menü verwendet er die WebBlocks-UI-Dropdown-Hooks.

Header Actions (`header-actions`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/header-actions.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="header-actions">
  <div class="wb-cluster wb-cluster-2 wb-cluster-end" data-wb-header-actions>
    <div class="wb-topbar-actions">
      <a class="wb-topbar-action" data-wb-public-search-open>
        <i class="wb-icon wb-icon-search" aria-hidden="true"></i>
      </a>
      <button class="wb-topbar-action" data-wb-mode-cycle>
        <i class="wb-icon wb-icon-sun-moon" aria-hidden="true"></i>
      </button>
      <div class="wb-dropdown wb-dropdown-end">
        <button class="wb-topbar-action" data-wb-toggle="dropdown">
          <i class="wb-icon wb-icon-palette" aria-hidden="true"></i>
        </button>
        <div class="wb-dropdown-menu">...</div>
      </div>
    </div>
  </div>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-cluster, wb-cluster-2, wb-cluster-end, wb-topbar-actions, wb-topbar-action, wb-icon, wb-icon-search, wb-icon-sun-moon, wb-icon-palette, wb-dropdown, wb-dropdown-end, wb-dropdown-menu, wb-dropdown-item, wb-dropdown-label, wb-dropdown-divider.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.show_search	false	Blendet die öffentliche Suchaktion aus.
settings.show_mode_toggle	false	Blendet die Aktion zum Umschalten des Modus aus.
settings.show_accent_toggle	false	Blendet das Akzent-/Theme-Dropdown aus.
Standardeinstellungen	leer/true	Rendert alle Aktionen.

Geeignet für / Nicht geeignet für

Geeignet für: Standard-Such-/Theme-Utilities in Headern.

Nicht geeignet für: individuelle geschäftliche CTAs; verwenden Sie Button Link/Button.

Hinweise

Über die Einstellungen lassen sich die Suche, der Modus-Umschalter oder das Akzent-/Theme-Menü ausblenden. Dieser Block besitzt kein Root-Element auf Slot-Ebene. Er verwendet die WebBlocks-UI-Dropdown-Hooks und die öffentlichen Such-Hooks des CMS.

Search Form (`search-form`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/search-form.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="search-form">
  <form action="/search" method="GET" role="search" class="wb-cluster wb-cluster-2">
    <div class="wb-stack wb-gap-1 wb-flex-1">
      <label for="search-form-1">Search</label>
      <input id="search-form-1" type="search" name="q" class="wb-input" placeholder="Search this site">
    </div>
    <button type="submit" class="wb-btn wb-btn-primary">Search</button>
  </form>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-cluster, wb-cluster-2, wb-stack, wb-gap-1, wb-flex-1, wb-input, wb-btn, wb-btn-primary oder wb-btn-secondary.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
variant	secondary	Der Absenden-Button verwendet wb-btn wb-btn-secondary.
variant	primary/Standard	Der Absenden-Button verwendet wb-btn wb-btn-primary.
settings.show_button	false	Lässt den Absenden-Button weg.
Suchroute nicht verfügbar	n. z.	Der Renderer gibt nichts aus.

Geeignet für / Nicht geeignet für

Geeignet für: Site-Suchformulare.

Nicht geeignet für: Filterformulare oder individuelle externe Suchintegrationen.

Hinweise

Der Renderer gibt nichts aus, wenn der Routen-Resolver keinen Suchpfad erzeugen kann. settings.show_button steuert, ob der Absenden-Button gerendert wird.

Stat Card (`stat-card`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/stat-card.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="stat-card">
  <div class="wb-stat">
    <div class="wb-stat-label">Label</div>
    <div class="wb-stat-value">Value</div>
    <div class="wb-stat-detail">Detail</div>
    <div class="wb-stat-detail"><a href="/more" class="wb-link">Learn more</a></div>
  </div>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-stat, wb-stat-label, wb-stat-value, wb-stat-detail, wb-link, zusätzlich das generische wb-public-block.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
subtitle	Text	Rendert .wb-stat-label.
title	Text	Rendert .wb-stat-value.
content	Text	Rendert .wb-stat-detail.
url	sichere URL	Fügt einen Learn more-Link mit .wb-link hinzu.

Geeignet für / Nicht geeignet für

Geeignet für: eigenständige Kennzahlkarten.

Nicht geeignet für: Gruppen mit mehreren Kennzahlen, bei denen die Stats-Variante von Columns kompakter ist.

Hinweise

Dies ist ein Inhaltsblock ohne eigenes Root-Element. Er verwendet subtitle als Beschriftung, title als Wert, content als Detail und die optionale kanonische URL für einen Learn more-Link.

Code (`code`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/code.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="code">
  <pre><code data-language="php">php artisan test</code></pre>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

Der Code-Renderer selbst gibt keine WebBlocks-UI-Klasse aus. Der generische Wrapper verwendet wb-public-block.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.language	Text	Wird bereinigt in data-language am -Element übernommen.
settings.lang	Text	Legacy-Fallback für data-language.
content	leer	Der Renderer gibt nichts aus.

Geeignet für / Nicht geeignet für

Geeignet für: Code-Schnipsel.

Nicht geeignet für: formatierten Fließtext oder Befehlslisten; verwenden Sie je nach Bedarf Rich Text/List.

Hinweise

Der Renderer bricht früh ab, wenn der Inhalt leer ist. settings.language oder settings.lang wird zu einem bereinigten data-language-Wert.

Download (`download`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/download.blade.php

Gerendertes HTML

<div class="wb-stack wb-gap-2" data-wb-public-block-type="download">
  <a href="/media/file.pdf" class="wb-btn wb-btn-secondary" download>Download file</a>
  <p>Helper copy.</p>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-stack, wb-gap-2, wb-btn, wb-btn-primary, wb-btn-secondary, wb-btn-ghost.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
variant	primary	Die Button-Klasse ist wb-btn wb-btn-primary.
variant	ghost	Die Button-Klasse ist wb-btn wb-btn-ghost.
variant	secondary/Standard/sonstige	Die Button-Klasse ist wb-btn wb-btn-secondary.
media_id	Download-Medium	Die Medien-URL wird verwendet; ohne Medium gibt der Renderer nichts aus.
subtitle	Text	Rendert einen Hilfs-.

Geeignet für / Nicht geeignet für

Geeignet für: medienbasierte Download-CTAs.

Nicht geeignet für: externe Dateikarten; verwenden Sie File, wenn kein Medien-Asset vorhanden ist.

Hinweise

Der Block besitzt sein Root-<div>. Er gibt nur dann etwas aus, wenn downloadAsset() eine URL liefert. variant ändert die Button-Klasse.

File (`file`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/file.blade.php

Gerendertes HTML

<div class="wb-card wb-card-muted" data-wb-public-block-type="file">
  <div class="wb-card-body wb-stack wb-gap-2">
    <strong>File title</strong>
    <p class="wb-m-0">Description.</p>
    <a href="/media/file.pdf" class="wb-btn wb-btn-secondary" download>Download</a>
    <span class="wb-text-sm wb-text-muted">file.pdf | application/pdf</span>
  </div>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-card, wb-card-muted, wb-card-body, wb-stack, wb-gap-2, wb-m-0, wb-btn, wb-btn-secondary, wb-text-sm, wb-text-muted.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
media_id	ausgewähltes Medium	Die Medien-URL hat Vorrang vor der externen URL.
url	sichere externe URL	Wird nur verwendet, wenn keine Medien-URL verfügbar ist.
title/content	Text	Wird, falls vorhanden, als sichtbarer Kartentext gerendert.
Quelle nicht verfügbar	n/a	Der Renderer gibt je nach Quellverfügbarkeit nichts oder kein abspielbares Steuerelement aus.

Geeignet für / Nicht geeignet für

Geeignet für: Dateikarten mit Medien oder geprüfter externer URL als Fallback.

Nicht geeignet für: einfache Medien-Downloads, bei denen Download ausreicht.

Hinweise

Der Block besitzt seine eigene Wurzelkarte. Die Medien-URL hat Vorrang vor einer sicheren externen http-, https- oder mailto-URL. Die Schaltflächenbeschriftung lautet Download für Medien und Open file für externe URLs.

Video (`video`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/video.blade.php

Gerendertes HTML

<div class="wb-card wb-card-muted" data-wb-public-block-type="video">
  <div class="wb-card-body wb-stack wb-gap-3">
    <div class="wb-stack wb-gap-1">
      <strong>Video title</strong>
      <p class="wb-m-0">Video copy.</p>
    </div>
    <video controls preload="metadata">
      <source src="/media/video.mp4">
    </video>
  </div>
</div>

Embed-Variante:

<iframe src="https://www.youtube.com/embed/abc123" title="Video title" loading="lazy" allowfullscreen></iframe>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-card, wb-card-muted, wb-card-body, wb-stack, wb-gap-3, wb-gap-1, wb-m-0, wb-btn, wb-btn-secondary.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
media_id	ausgewähltes Medium	Die Medien-URL hat Vorrang vor der externen URL.
url	sichere externe URL	Wird nur verwendet, wenn keine Medien-URL verfügbar ist.
title/content	Text	Wird, falls vorhanden, als sichtbarer Kartentext gerendert.
Quelle nicht verfügbar	n/a	Der Renderer gibt je nach Quellverfügbarkeit nichts oder kein abspielbares Steuerelement aus.

Geeignet für / Nicht geeignet für

Geeignet für: hochgeladene Videos oder sichere YouTube/Vimeo-Einbettungen.

Nicht geeignet für: beliebiges iframe-HTML; verwenden Sie Trusted HTML nur als geprüften Fallback.

Hinweise

Der Block besitzt seine eigene Wurzelkarte. Hochgeladene Medien werden als natives <video> gerendert. Sichere YouTube- und Vimeo-URLs werden als iframe-Einbettungen gerendert. Andere sichere HTTP-URLs rendern eine Open video-Schaltfläche.

Audio (`audio`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/audio.blade.php

Gerendertes HTML

<div class="wb-card wb-card-muted" data-wb-public-block-type="audio">
  <div class="wb-card-body wb-stack wb-gap-3">
    <div class="wb-stack wb-gap-1">
      <strong>Audio title</strong>
      <p class="wb-m-0">Audio copy.</p>
    </div>
    <audio controls preload="metadata">
      <source src="/media/audio.mp3">
    </audio>
  </div>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-card, wb-card-muted, wb-card-body, wb-stack, wb-gap-3, wb-gap-1, wb-m-0.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
media_id	ausgewähltes Medium	Die Medien-URL hat Vorrang vor der externen URL.
url	sichere externe URL	Wird nur verwendet, wenn keine Medien-URL verfügbar ist.
title/content	Text	Wird, falls vorhanden, als sichtbarer Kartentext gerendert.
Quelle nicht verfügbar	n/a	Der Renderer gibt je nach Quellverfügbarkeit nichts oder kein abspielbares Steuerelement aus.

Geeignet für / Nicht geeignet für

Geeignet für: hochgeladene oder sichere externe Audio-Medien.

Nicht geeignet für: Podcast-/Player-Einbettungen, die nicht unterstütztes Markup benötigen; prüfen Sie den Trusted-HTML-Fallback.

Hinweise

Der Block besitzt seine eigene Wurzelkarte. Die URL hochgeladener Medien hat Vorrang vor einer sicheren externen HTTP-URL.

Tabelle (`table`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/table.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="table">
  <div class="wb-stack wb-gap-2">
    <h3>Table title</h3>
    <div class="wb-table-wrap">
      <table class="wb-table">
        <thead>
          <tr><th>Name</th><th>Value</th></tr>
        </thead>
        <tbody>
          <tr><td>One</td><td>Two</td></tr>
        </tbody>
      </table>
    </div>
  </div>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-stack, wb-gap-2, wb-table-wrap, wb-table sowie das generische wb-public-block.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
variant	plain	Keine Kopfzeile; alle Zeilen werden im gerendert.
variant	default/sonstige	Die erste Zeile wird im gerendert.
settings.rows	Array	Die Legacy-Zeilenquelle hat Vorrang, wenn vorhanden.
content	durch Pipe-Zeichen getrennte Zeilen	Wird als Zeilenquelle verwendet, wenn settings.rows leer ist.

Geeignet für / Nicht geeignet für

Geeignet für: einfache strukturierte Tabellen.

Nicht geeignet für: Layout-Raster oder komplexe interaktive Datentabellen.

Hinweise

Zeilen stammen aus dem Legacy-Feld settings.rows, sofern vorhanden, andernfalls aus durch Pipe-Zeichen getrennten übersetzten Inhaltszeilen. variant = plain deaktiviert das Kopfzeilenverhalten.

Zitat (`quote`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/quote.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="quote">
  <blockquote class="wb-stack wb-gap-2">
    <p class="wb-m-0">Quote text.</p>
    <footer>Name | Role</footer>
  </blockquote>
</div>

Testimonial-Variante:

<div class="wb-card wb-card-muted">
  <div class="wb-card-body">
    <blockquote class="wb-stack wb-gap-2">...</blockquote>
  </div>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-stack, wb-gap-2, wb-m-0, optional wb-card, wb-card-muted, wb-card-body sowie das generische wb-public-block.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
variant	testimonial	Umschließt das Blockzitat mit wb-card wb-card-muted > .wb-card-body.
variant	default/sonstige	Rendert ein einfaches .
subtitle	Text	Wird im mit Titel-/Inhaltskontext gerendert.

Geeignet für / Nicht geeignet für

Geeignet für: Zitate und Testimonials.

Nicht geeignet für: allgemeine Hinweisboxen oder Karten.

Hinweise

Der Renderer selbst fügt kein data-wb-public-block-type hinzu; der generische Wrapper wird durch das Slot-Rendering auf oberster Ebene bereitgestellt.

Linkliste (`link-list`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/link-list.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="link-list">
  <div class="wb-stack wb-gap-3">
    <div class="wb-stack wb-gap-1">
      <div class="wb-link-list-meta">Meta</div>
      <h2>Links</h2>
      <p>Description.</p>
    </div>
    <div class="wb-link-list">
      <a href="/item" class="wb-link-list-item">...</a>
    </div>
  </div>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-stack, wb-gap-3, wb-gap-1, wb-link-list, wb-link-list-meta.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
title/subtitle/content	Text	Rendert einen optionalen Einleitungs-Stack über den Links.
Kind-Element link-list-item	veröffentlichte Kind-Blöcke	Rendert die Kind-Blöcke innerhalb von .wb-link-list.
keine Kind-Blöcke	n/a	Der Renderer hat keine Linkzeilen zum Anzeigen.

Geeignet für / Nicht geeignet für

Geeignet für: strukturierte Linklisten.

Nicht geeignet für: vollständige Navigationsmenüs; verwenden Sie je nach Bedarf Navbar/Navigation Auto.

Hinweise

Der Block rendert nur veröffentlichte link-list-item-Kind-Blöcke. Er besitzt nicht die Wurzel auf Slot-Ebene.

Linklisten-Eintrag (`link-list-item`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/link-list-item.blade.php

Gerendertes HTML

<a href="/item" class="wb-link-list-item">
  <div class="wb-link-list-main">
    <span class="wb-link-list-title">Title</span>
    <span class="wb-link-list-meta">Meta</span>
  </div>
  <div class="wb-link-list-desc">Description.</div>
</a>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-link-list-item, wb-link-list-main, wb-link-list-title, wb-link-list-meta, wb-link-list-desc.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
url	sichere URL	Für die Ausgabe erforderlich; wird zum href des Ankers.
title	Text	Für die Ausgabe erforderlich; rendert .wb-link-list-title.
subtitle	Text	Rendert .wb-link-list-meta.
content	Text	Rendert .wb-link-list-desc.

Geeignet für / Nicht geeignet für

Geeignet für: Kind-Blöcke einer Linkliste (Link List).

Nicht geeignet für: eigenständige Schaltflächen oder Navigationsmenü-Einträge.

Hinweise

Der Renderer gibt nur dann etwas aus, wenn sowohl eine sichere URL als auch ein Titel vorhanden sind. Er ist als Kind-Element von link-list gedacht.

Navigation Auto (`navigation-auto`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/navigation-auto.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="navigation-auto">
  <nav class="wb-stack wb-gap-2" aria-label="main navigation" data-wb-menu-key="main">
    <ul class="wb-cluster wb-cluster-2 wb-cluster-between">
      <li class="wb-stack wb-gap-1">
        <a href="/" class="wb-btn wb-btn-secondary">Home</a>
      </li>
    </ul>
  </nav>
</div>

Variante für Footer-/Rechtliches-Menü:

<ul class="wb-stack wb-gap-1">
  <li class="wb-stack wb-gap-1"><a href="/privacy" class="wb-link">Privacy</a></li>
</ul>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-stack, wb-gap-2, wb-gap-1, wb-cluster, wb-cluster-2, wb-cluster-between, wb-btn, wb-btn-secondary, wb-link, wb-text-sm.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.menu_key oder settings.location	bekannter Menüschlüssel	Wählt das CMS-Navigationsmenü aus; der Helper fällt basierend auf Slot/Subtitle auf primary/footer zurück.
Footer-/Rechtliches-Menü	footer- oder legal-Schlüssel	Rendert eine gestapelte .wb-link-Liste.
anderes Menü	primary/default	Rendert gruppierte Root-Links im Schaltflächenstil.
aktives Element	Übereinstimmung mit der aktuellen Seite	Fügt current-/active-Klassen hinzu, wo der Renderer sie auflöst.

Geeignet für / Nicht geeignet für

Geeignet für: Kompatibilitäts-Rendering von CMS-Menüs.

Nicht geeignet für: neue gemeinsame Header, bei denen Navbar Navigation das vorgesehene Kind-Element ist.

Hinweise

Der Renderer löst ein CMS-Navigationsmenü über seinen Schlüssel auf. Footer- und Rechtliches-Menüs werden als gestapelte Links gerendert; andere Menüs als gruppierte Root-Links im Schaltflächenstil.

Inhaltsverzeichnis (`toc`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/toc.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="toc">
  <div class="wb-stack wb-gap-2">
    <strong>Contents</strong>
    <div class="wb-link-list">
      <a class="wb-link-list-item" href="#intro">
        <div class="wb-link-list-main">
          <span class="wb-link-list-title">Intro</span>
        </div>
        <div class="wb-link-list-desc">Jump to section</div>
      </a>
    </div>
  </div>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-stack, wb-gap-2, wb-link-list, wb-link-list-item, wb-link-list-main, wb-link-list-title, wb-link-list-meta, wb-link-list-desc.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
title	Text	Rendert die Überschriftenbeschriftung; die sichtbare Standardbeschriftung entspricht dem aktuellen Renderer-Verhalten.
Header-Blöcke derselben Seite	veröffentlicht mit Ankern	Erzeugt .wb-link-list-item-Links.
Header-Variante	h3	Die Beschreibung lautet Jump to subsection; bei anderen lautet sie Jump to section.
keine geeigneten Überschriften	n/a	Der Renderer gibt nichts aus.

Geeignet für / Nicht geeignet für

Geeignet für: Inhaltslisten derselben Seite aus verankerten Header-Blöcken.

Nicht geeignet für: manuelle Linklisten; verwenden Sie Link List.

Hinweise

Der Renderer liest verankerte veröffentlichte Header-Blöcke aus demselben Seitenbaum. Er gibt nichts aus, wenn keine geeigneten Überschriften vorhanden sind.

Alert (`alert`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/alert.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="alert">
  <div class="wb-alert wb-alert-info">
    <h3 class="wb-alert-title">Notice</h3>
    <p>Message.</p>
  </div>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-alert, Varianten-Klasse aus alertVariantClass(), wb-alert-title sowie das generische wb-public-block.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.variant	success/warning/danger	alertVariantClass() fügt wb-alert-success, wb-alert-warning oder wb-alert-danger hinzu.
settings.variant	info/default/sonstige	Fügt wb-alert-info hinzu.
title	Text	Rendert .wb-alert-title.
content	Text	Rendert den Alert-Text.

Geeignet für / Nicht geeignet für

Geeignet für: benutzerorientierte Inline-Hinweise.

Nicht geeignet für: Marketing-Aktionen; verwenden Sie CTA/Hero.

Hinweise

Der Block besitzt nicht die Wurzel auf Slot-Ebene. Die gemeinsame Variante steuert die Tonklasse des Alerts.

Kontaktformular (`contact_form`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/contact_form.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="contact-form">
  <section class="wb-card wb-public-contact-form-card" id="contact-form-1">
    <div class="wb-card-body wb-stack wb-gap-4">
      <div class="wb-stack wb-gap-2">
        <h2>Contact</h2>
        <p>Intro copy.</p>
      </div>
      <form method="POST" action="/contact-messages" class="wb-stack wb-gap-3">
        <input type="hidden" name="_token" value="csrf-token">
        <input type="hidden" name="block_id" value="1">
        <input type="hidden" name="page_id" value="10">
        <input type="hidden" name="source_url" value="/contact">
        <input type="hidden" name="submitted_at" value="1770000000">
        <input type="hidden" name="_form_check_name" value="signed-generated-field-name">
        <div class="wb-form-check" inert aria-hidden="true">
          <label for="contact-form-check-1">Leave this field empty</label>
          <input id="contact-form-check-1" type="text" name="form_check_generatedtoken" tabindex="-1" autocomplete="off">
        </div>
        <div class="wb-grid wb-grid-2">
          <div class="wb-stack wb-gap-1">
            <label class="wb-label">Name</label>
            <input class="wb-input" required>
          </div>
          <div class="wb-stack wb-gap-1">
            <label class="wb-label">Email</label>
            <input class="wb-input" type="email" required>
          </div>
        </div>
        <textarea class="wb-textarea" rows="7" required></textarea>
        <div class="wb-cluster wb-cluster-between wb-cluster-2">
          <span class="wb-text-sm wb-text-muted">Your message is stored first...</span>
          <button class="wb-btn wb-btn-primary">Send message</button>
        </div>
      </form>
    </div>
  </section>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-card, wb-public-contact-form-card, wb-card-body, wb-stack, wb-gap-4, wb-gap-3, wb-gap-2, wb-gap-1, wb-alert, wb-alert-danger, wb-alert-title, wb-grid, wb-grid-2, wb-label, wb-input, wb-textarea, wb-cluster, wb-cluster-between, wb-cluster-2, wb-text-sm, wb-text-muted, wb-btn, wb-btn-primary.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
Kontaktempfänger der Site	konfiguriert	Das Formular sendet mit verstecktem Site-/Seitenkontext an contact-messages.store.
Validierungsfehler	vorhanden	Rendert wb-alert wb-alert-danger und Rückmeldungen auf Feldebene.
settings submit/success-Beschriftungen	übersetzte Legacy-Einstellungen	Wurden vom Übersetzungs-Resolver/-Writer ausgelagert; die sichtbare Ausgabe folgt den aktuellen übersetzten Blockfeldern.

Das öffentliche Formular ist native Blade-Ausgabe, kein Trusted-HTML-Inhalt. Browser-Übermittlungen erfordern CSRF, enthalten das vom CMS erzeugte versteckte Anti-Spam-Prüffeld, validieren Pflichtfelder serverseitig, speichern legitime Nachrichten zuerst und versuchen anschließend eine E-Mail-Benachrichtigung gemäß der dokumentierten Empfänger-Fallback-Reihenfolge. Das Prüffeld wird vom Renderer erzeugt und ist nicht Teil der normalen Besuchereingabe.

Geeignet für / Nicht geeignet für

Geeignet für: den produkteigenen Workflow für Kontaktnachrichten.

Nicht geeignet für: rohe HTML-Formulare oder Einbettungen von Drittanbietern, sofern sie nicht als Trusted HTML geprüft wurden.

Hinweise

Der Renderer umfasst versteckte Felder, CSRF, das .wb-form-check-Anti-Spam-Markup mit inert und aria-hidden="true" sowie gezielte Validierungsfehler und sendet an contact-messages.store. Das alte website-Feld ist nicht mehr Teil des öffentlichen Renderer-Vertrags.

Breadcrumb (`breadcrumb`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/breadcrumb.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="breadcrumb">
  <nav class="wb-breadcrumb" aria-label="Breadcrumb">
    <ol class="wb-breadcrumb-list">
      <li class="wb-breadcrumb-item">
        <a class="wb-breadcrumb-link" href="/">Home</a>
      </li>
      <li class="wb-breadcrumb-item">
        <span class="wb-breadcrumb-current" aria-current="page">Current page</span>
      </li>
    </ol>
  </nav>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-breadcrumb, wb-breadcrumb-list, wb-breadcrumb-item, wb-breadcrumb-link, wb-breadcrumb-current.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.home_label	Text	Überschreibt die Beschriftung des Home-Breadcrumbs.
settings.include_current	false	Lässt den Breadcrumb der aktuellen Seite weg.
settings.include_current	true/Standard	Schließt den Breadcrumb der aktuellen Seite ein.
Startseite	include_current true	Rendert nur den Breadcrumb der aktuellen Seite.

Geeignet für / Nicht geeignet für

Geeignet für: hierarchische Seitennavigation.

Nicht geeignet für: die primäre Site-Navigation.

Hinweise

Die Home-Beschriftung und die Einbeziehung der aktuellen Seite sind einstellungsgesteuert. Auf der Startseite wird nur der Breadcrumb der aktuellen Seite gerendert, wenn include_current auf true steht.

Sidebar-Brand (`sidebar-brand`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/sidebar-brand.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="sidebar-brand">
  <a href="/" class="wb-sidebar-brand">
    <img src="/media/logo.svg" alt="Docs" class="wb-sidebar-brand-logo">
    <span class="wb-sidebar-brand-copy">
      <span>Docs</span>
      <span class="wb-sidebar-brand-note">Guide</span>
    </span>
  </a>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-sidebar-brand, wb-sidebar-brand-logo, wb-sidebar-brand-copy, wb-sidebar-brand-note.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.url	sichere URL	Die gespeicherte URL hat Vorrang für den Brand-Link.
settings.url	leer	Fällt auf den Startseitenpfad der Site zurück, danach auf /.
settings.target	_blank	Fügt target="_blank" rel="noopener noreferrer" hinzu.
settings.aria_label	Text	Wird als barrierefreie Beschriftung verwendet, wenn kein sichtbarer Text gerendert wird.
media_id	Logo-Medium	Rendert das Markenbild innerhalb von wb-sidebar-brand.

Geeignet für / Nicht geeignet für

Geeignet für: Site-/Docs-Identität innerhalb von Sidebar-Layouts.

Nicht geeignet für: Navbar-Identität; verwenden Sie dort Navbar Brand.

Hinweise

Der Block besitzt nicht die Sidebar-Hülle. Die gespeicherte URL hat Vorrang, danach der Startseitenpfad der Site, danach /. Die Nur-Logo-Ausgabe verwendet aria-label.

Sidebar-Navigation (`sidebar-navigation`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/sidebar-navigation.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="sidebar-navigation">
  <nav class="wb-sidebar-nav" aria-label="Documentation navigation">
    <div class="wb-sidebar-section">
      <a href="/docs" class="wb-sidebar-link is-active" aria-current="page">
        <i class="wb-icon wb-icon-book wb-sidebar-icon" aria-hidden="true"></i>
        <span>Docs</span>
      </a>
    </div>
  </nav>
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-sidebar-nav, wb-sidebar-section, wb-sidebar-link, wb-nav-group, wb-nav-group-toggle, wb-nav-group-items, wb-nav-group-item, wb-icon, wb-sidebar-icon, is-active.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.menu_key	bekannter Menü-Schlüssel	Rendert den CMS-Navigation-Baum, wenn vorhanden.
manuelle Kind-Blöcke	sidebar-nav-item/sidebar-nav-group	Rendert manuelle Kind-Blöcke, wenn der Menümodus keine Einträge liefert.
settings.show_icons	boolesch	Die Auswirkung auf die Icon-Sichtbarkeit muss anhand des Quellcodes bestätigt werden.
settings.active_matching	Wert	Das Active-Matching-Verhalten wird per Helper gesteuert; die sichtbare Ausgabe ist bei Übereinstimmung is-active/aria-current.

Geeignet für / Nicht geeignet für

Geeignet für: Docs-/Sidebar-Navigationsblöcke.

Nicht geeignet für: gewöhnliche Marketing-Sidebars ohne Navigationssemantik.

Hinweise

Der Block kann ein CMS-Navigation-Menü oder manuelle Kind-Blöcke vom Typ sidebar-nav-item / sidebar-nav-group rendern. Er besitzt nicht die äußere Seiten-/Sidebar-Hülle.

Sidebar-Nav-Item (`sidebar-nav-item`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/sidebar-nav-item.blade.php

Gerendertes HTML

<a href="/docs/page" class="wb-sidebar-link is-active" aria-current="page">
  <i class="wb-icon wb-icon-file wb-sidebar-icon" aria-hidden="true"></i>
  <span>Page</span>
</a>

Verschachteltes Gruppenelement:

<a href="/docs/child" class="wb-nav-group-item">
  <span>Child</span>
</a>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-sidebar-link, wb-nav-group-item, wb-icon, wb-sidebar-icon, is-active.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.url	sichere URL	Für die Ausgabe erforderlich.
settings.target	_blank	Fügt externe target-/rel-Attribute hinzu.
settings.icon	Icon-Slug/-Klasse	Rendert wb-icon ... wb-sidebar-icon, wenn konfiguriert.
settings.active_mode	exact/current-page/manual/default	Steuert den Active-State-Helper; die sichtbare Ausgabe ist is-active und aria-current.
settings.manual_active	true	Kann die aktive Ausgabe erzwingen, wenn der Aktivmodus manual ist.

Geeignet für / Nicht geeignet für

Geeignet für: manuelle Sidebar-Links.

Nicht geeignet für: Navbar-Links oder generische Buttons.

Hinweise

Der Renderer delegiert an sidebar-nav-item-link.blade.php. Ohne URL und Beschriftung gibt er nichts aus.

Sidebar-Nav-Group (`sidebar-nav-group`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/sidebar-nav-group.blade.php

Gerendertes HTML

<div class="wb-nav-group is-open" data-wb-nav-group>
  <button type="button" class="wb-nav-group-toggle is-active" data-wb-nav-group-toggle>
    <span class="wb-nav-group-icon"><i class="wb-icon wb-icon-folder" aria-hidden="true"></i></span>
    <span class="wb-nav-group-label">Group</span>
    <span class="wb-nav-group-arrow" aria-hidden="true"></span>
  </button>
  <div class="wb-nav-group-items" id="wb-nav-group-items-1">
    <a href="/docs/child" class="wb-nav-group-item">...</a>
  </div>
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-nav-group, is-open, wb-nav-group-toggle, is-active, wb-nav-group-icon, wb-icon, wb-nav-group-label, wb-nav-group-arrow, wb-nav-group-items, wb-nav-group-item.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.icon	Icon-Slug/-Klasse	Rendert das Gruppen-Icon-Markup, wenn konfiguriert.
settings.initially_open	true/default	Fügt is-open hinzu.
settings.initially_open	false	Die Gruppe startet geschlossen.
Kind-sidebar-nav-item	veröffentlichte Kind-Blöcke	Wird innerhalb von .wb-nav-group-items gerendert.

Geeignet für / Nicht geeignet für

Geeignet für: einklappbare Gruppen innerhalb der Sidebar-Navigation.

Nicht geeignet für: allgemeine Akkordeons; verwenden Sie Accordion.

Hinweise

Die Gruppe wird nur gerendert, wenn sie eine Beschriftung und veröffentlichte sidebar-nav-item-Kinder hat. Sie verwendet die WebBlocks-UI-Nav-Group-Hooks.

Sidebar-Footer (`sidebar-footer`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/sidebar-footer.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="sidebar-footer">
  <div class="wb-sidebar-footer">
    <div class="wb-callout wb-callout-info">
      <div class="wb-callout-title">Title</div>
      <p>Copy.</p>
    </div>
    <p class="wb-text-xs wb-text-muted wb-mt-3 wb-mb-0">Footer note.</p>
  </div>
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-sidebar-footer, wb-callout, Variantenklasse aus sidebarFooterVariantClass(), wb-callout-title, wb-text-xs, wb-text-muted, wb-mt-3, wb-mb-0.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.variant	success/warning/danger	sidebarFooterVariantClass() fügt wb-callout-success, wb-callout-warning oder wb-callout-danger hinzu.
settings.variant	info/default/sonstige	Fügt wb-callout-info hinzu.
title/content/subtitle	alle leer	Der Renderer gibt nichts aus.
subtitle	Text	Rendert die Footer-Notiz mit wb-text-xs wb-text-muted wb-mt-3 wb-mb-0.

Geeignet für / Nicht geeignet für

Geeignet für: kleine Sidebar-Notizen oder Calls-to-Action.

Nicht geeignet für: Haupt-CTAs der Seite.

Hinweise

Der Block wird nur gerendert, wenn title/content/subtitle vorhanden ist. Er besitzt nicht die Sidebar-Hülle.

HTML (vertrauenswürdig) (`html`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/html.blade.php

Gerendertes HTML

<div class="wb-public-block" data-wb-public-block-type="html">
  <div>
    <!-- trusted HTML content -->
  </div>
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

Der Renderer selbst fügt keine feste WebBlocks-UI-Klasse hinzu. Der generische Wrapper verwendet wb-public-block.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
content	vertrauenswürdiges HTML	Wird in einem einfachen innerhalb des generischen öffentlichen Wrappers gerendert.
Overlay-/Body-End-Fragmente	vom Extractor erkannt	Können über TrustedHtmlOverlayExtractor, PublicOverlayRegistry und PublicBodyEndRegistry hochgezogen werden.
nicht vertrauenswürdiger Inhalt	n/a	Nicht verwenden; dieser Renderer setzt vertrauenswürdiges statisches Markup voraus.

Geeignet für / Nicht geeignet für

Geeignet für: geprüftes Fallback-Markup, das strukturierte Blöcke noch nicht abbilden können.

Nicht geeignet für: standardmäßige migrierte/KI-erstellte Seitenausgabe.

Hinweise

Vertrauenswürdiges HTML kann Overlay- und Body-End-Fragmente über TrustedHtmlOverlayExtractor, PublicOverlayRegistry und PublicBodyEndRegistry extrahieren. Verwenden Sie dies nur für vertrauenswürdiges statisches Markup.

Button (`button`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/button.blade.php

Gerendertes HTML

<a href="/start" class="wb-btn wb-btn-primary">Open link</a>

Variante ohne URL:

<button type="button" class="wb-btn wb-btn-primary">Open link</button>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-btn, wb-btn-primary, wb-btn-secondary, wb-btn-outline, wb-btn-ghost, wb-btn-danger, optionaler Kind-Wrapper wb-stack wb-gap-4.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
variant	primary/secondary/outline/ghost/danger	Wird auf wb-btn plus die entsprechende Variantenklasse abgebildet.
variant	leer/sonstige	Standard ist wb-btn wb-btn-primary.
Attachment-Medien-URL	vorhanden	Hat aus Kompatibilitätsgründen Vorrang vor der kanonischen URL.
url	vorhanden ohne Attachment	Rendert einen Anker.
url	leer	Rendert einen inaktiven .

Geeignet für / Nicht geeignet für

Geeignet für: verwaltete Kind-Aktionen in Hero/CTA.

Nicht geeignet für: eigenständige Seiten-Buttons; verwenden Sie Button Link.

Hinweise

Dies ist ein verwalteter Kind-Aktionsblock für Hero/CTA. Er ist nicht in der aktuellen veröffentlichten Katalogliste aus CoreBlockTypeCatalogSyncer enthalten, aber öffentliche Renderer und Konvertierungsunterstützung existieren. Die Attachment-URL hat aus Kompatibilitätsgründen Vorrang vor der kanonischen URL.

Callout (`callout`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/callout.blade.php

Gerendertes HTML

<div class="wb-alert wb-alert-info">
  <div>
    <div class="wb-alert-title">Title</div>
    <div>Content</div>
  </div>
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-alert, wb-alert-info, wb-alert-success, wb-alert-warning, wb-alert-danger, wb-alert-title, optionaler Kind-Wrapper wb-stack wb-gap-4.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
variant	success/warning/danger	Fügt die passende wb-alert-{tone}-Klasse hinzu.
variant	info/default/sonstige	Fügt wb-alert-info hinzu.
Kind-Blöcke	veröffentlichte Kind-Blöcke	Werden danach in wb-stack wb-gap-4 gerendert.
bevorzugte neue Seiten	n/a	Verwenden Sie Alert für erstklassige Hinweise auf neuen Seiten.

Geeignet für / Nicht geeignet für

Geeignet für: Legacy-/Konverter-kompatible, alarmähnliche Inhalte.

Nicht geeignet für: neue strukturierte Seiten; verwenden Sie Alert.

Hinweise

callout ist ein Legacy-/konvertierungskompatibler Renderer und entspricht visuell dem Alert-Muster. Er ist nicht als aktuelle veröffentlichte Core-Katalogzeile gelistet, alert hingegen schon.

Liste (`list`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/list.blade.php

Gerendertes HTML

<div class="wb-stack wb-gap-2">
  <h3>List title</h3>
  <ul class="wb-stack wb-gap-1">
    <li>Item</li>
  </ul>
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-stack, wb-gap-2, wb-gap-1, optionaler Kind-Wrapper wb-stack wb-gap-4.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
variant	ordered	Rendert .
variant	default/sonstige	Rendert .
settings.items/cards/entries	Array	Wird als Elementquelle verwendet, wenn verfügbar.
content	zeilengetrennter Text	Wird als Fallback-Elementquelle verwendet.
title	Text	Rendert eine Überschrift über der Liste.

Geeignet für / Nicht geeignet für

Geeignet für: einfache importierte oder manuell eingegebene Listen.

Nicht geeignet für: Navigationslisten oder umfangreichen Fließtext, der in Rich Text gehört.

Hinweise

Dieser Renderer existiert aus Kompatibilitäts- und Konvertierungsgründen. Die Elemente stammen aus den Einstellungen (items, cards, entries) oder aus zeilengetrenntem Inhalt. variant = ordered schaltet ul auf ol um.

Text (`text`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/text.blade.php

Gerendertes HTML

<div class="wb-stack wb-gap-2">
  <strong>Title</strong>
  <p>Content</p>
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-stack, wb-gap-2, optionaler Kind-Wrapper wb-stack wb-gap-4.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
title	Text	Rendert über dem Absatz, wenn vorhanden.
content	Text	Rendert einen Absatz innerhalb von wb-stack wb-gap-2.
Kind-Blöcke	veröffentlichte Kind-Blöcke	Rendert Kind-Blöcke danach innerhalb von wb-stack wb-gap-4.

Geeignet für / Nicht geeignet für

Geeignet für: Legacy- oder Konverter-kompatible Inhalte, die bereits von diesem Renderer abhängen.

Nicht geeignet für: neue, von Hand gebaute Seiten; verwenden Sie die weiter oben gelisteten kanonischen strukturierten Blöcke.

Hinweise

Dies ist ein Kompatibilitäts-Renderer. Der aktuelle kanonische Core-Block für einfachen Fließtext ist plain_text.

Internes Actions-Partial (`_actions`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/_actions.blade.php

Gerendertes HTML

<div class="wb-cluster wb-cluster-2">
  <a href="/start" class="wb-btn wb-btn-primary">Start</a>
</div>

Wichtigste CSS- / WebBlocks-UI-Klassen

Standard-Wrapper wb-cluster wb-cluster-2 oder eine vom Aufrufer bereitgestellte Wrapper-Klasse.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
buttons-Eingabe	Kind-Blöcke mit Typ button	Filtert auf Button-Kinder und rendert sie.
wrapperClass-Eingabe	übergebene Klassen-Zeichenkette	Verwendet die übergebene Wrapper-Klasse.
wrapperClass-Eingabe	leer	Standard ist wb-cluster wb-cluster-2.

Geeignet für / Nicht geeignet für

Geeignet für: Renderer-eigene Hero-/CTA-Aktionsausgabe.

Nicht geeignet für: direkte Seitenkomposition.

Hinweise

Dies ist ein internes Hilfs-Partial, kein eigenständiger veröffentlichter Block. Es filtert die übergebene Sammlung auf button-Kinder und rendert jedes Kind über das normale Block-Partial.

Card-Grid (`card-grid`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/card-grid.blade.php

Gerendertes HTML

<section class="wb-stack wb-gap-4">
  <div class="wb-stack wb-gap-1">
    <h2>Cards</h2>
    <p class="wb-text-muted">Intro</p>
  </div>
  <div class="wb-grid wb-grid-3">
    <div class="wb-card">
      <div class="wb-card-body wb-stack wb-gap-2">
        <img src="/media/card.jpg" alt="Card image">
        <strong>Card title</strong>
        <p class="wb-m-0">Card content.</p>
        <a href="/target" class="wb-link">Read more</a>
      </div>
    </div>
  </div>
</section>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-stack, wb-gap-4, wb-gap-1, wb-text-muted, wb-grid, wb-grid-2, wb-grid-3, wb-grid-4, wb-card, wb-card-body, wb-gap-2, wb-m-0, wb-link.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.items	Array	Steuert die Kartenausgabe; jedes Element kann asset_id, title, content, url und url_label enthalten.
Anzahl settings.items	0-1/2/3/4+	Verwendet wb-stack wb-gap-3, wb-grid wb-grid-2, wb-grid wb-grid-3 oder wb-grid wb-grid-4.
item.asset_id	Medien-ID	Rendert das Element-Bild, wenn eine Medien-URL existiert.
item.url + item.url_label	Text	Rendert a.wb-link.

Geeignet für / Nicht geeignet für

Geeignet für: Legacy- oder Konverter-kompatible Inhalte, die bereits von diesem Renderer abhängen.

Nicht geeignet für: neue, von Hand gebaute Seiten; verwenden Sie die weiter oben gelisteten kanonischen strukturierten Blöcke.

Hinweise

Dies ist ein Legacy-/Kompatibilitäts-Renderer auf Basis von settings.items. Die Grid-Klasse ändert sich je nach Elementanzahl.

Kontaktinformationen (`contact-info`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/contact-info.blade.php

Gerendertes HTML

<section class="wb-card wb-card-muted wb-public-contact-card">
  <div class="wb-card-body wb-stack wb-gap-3">
    <div class="wb-stack wb-gap-1">
      <h2>Contact</h2>
      <p>Reach us.</p>
    </div>
    <div class="wb-stack wb-gap-1 wb-public-contact-meta">
      <strong>Email</strong>
      <a href="mailto:hello@example.test" class="wb-link">hello@example.test</a>
    </div>
  </div>
</section>

Wichtigste CSS- / WebBlocks-UI-Klassen

wb-card, wb-card-muted, wb-card-body, wb-stack, wb-gap-3, wb-gap-1, wb-link, plus die CMS-spezifischen wb-public-contact-card und wb-public-contact-meta.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.items	Array	Rendert Kontaktzeilen innerhalb von wb-public-contact-meta.
item.url	sichere URL	Rendert den verlinkten Wert mit wb-link.
item.target	_blank	Fügt externe target-/rel-Attribute hinzu.
item.label/value	Text	Rendert Beschriftung und einfachen Wert, wenn keine sichere URL vorhanden ist.

Geeignet für / Nicht geeignet für

Geeignet für: Legacy- oder konverterkompatible Inhalte, die bereits von diesem Renderer abhängen.

Nicht geeignet für: neue, manuell erstellte Seiten; verwenden Sie die weiter oben aufgeführten kanonischen strukturierten Blöcke.

Hinweise

Dies ist ein Legacy-/Kompatibilitäts-Renderer, der auf settings.items basiert. Links werden durch Block::safePublicUrl() geleitet.

FAQ-Liste (`faq-list`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/faq-list.blade.php

Gerendertes HTML

<div class="wb-stack wb-gap-3">
  <details class="wb-card">
    <summary class="wb-card-header"><strong>Question?</strong></summary>
    <div class="wb-card-body">Answer.</div>
  </details>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

Verwendet die Klassen des accordion-Renderers.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
Renderer-Verhalten	delegiert	Bindet den Accordion-Renderer direkt ein.
untergeordnete Zeilen	Titel und Inhalt	Folgen dem Disclosure-Element-Vertrag des Accordions.
bevorzugt für neue Seiten	n/a	Verwenden Sie accordion als kanonischen übergeordneten Block.

Geeignet für / Nicht geeignet für

Geeignet für: Legacy- oder konverterkompatible Inhalte, die bereits von diesem Renderer abhängen.

Nicht geeignet für: neue, manuell erstellte Seiten; verwenden Sie die weiter oben aufgeführten kanonischen strukturierten Blöcke.

Hinweise

Dieses Kompatibilitäts-Partial delegiert direkt an accordion.blade.php.

Galerie-Viewer (`gallery-viewer`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/gallery-viewer.blade.php

Gerendertes HTML

<div class="wb-modal wb-modal-xl" id="wb-gallery-viewer-1" role="dialog" aria-modal="true">
  <div class="wb-modal-dialog">
    <div class="wb-modal-body">
      <div class="wb-gallery-viewer">
        <div class="wb-gallery-viewer-toolbar">
          <button class="wb-btn wb-btn-secondary wb-btn-icon wb-gallery-viewer-prev" type="button"></button>
          <div class="wb-gallery-viewer-counter" aria-live="polite">1 / 3</div>
        </div>
        <figure class="wb-gallery-viewer-media">
          <img class="wb-gallery-viewer-image" src="/media/full.jpg" alt="Image">
          <figcaption class="wb-gallery-viewer-caption">Caption</figcaption>
        </figure>
      </div>
    </div>
  </div>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-modal, wb-modal-xl, wb-modal-dialog, wb-modal-body, wb-gallery-viewer, wb-gallery-viewer-toolbar, wb-btn, wb-btn-secondary, wb-btn-icon, wb-icon, wb-gallery-viewer-counter, wb-gallery-viewer-media, wb-gallery-viewer-image, wb-gallery-viewer-caption, wb-gallery-viewer-meta, wb-text-sm, wb-text-muted, wb-m-0.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
viewerId-Eingabe	id-String	Legt die Modal-/Galerie-Ziel-id fest, die von Galerie-Triggern verwendet wird.
galleryItems-Eingabe	Sammlung	Rendert Viewer-Folien/-Elemente aus den von der Galerie vorbereiteten Elementdaten.
direkte Blockeinstellungen	n/a	Internes Partial; keine eigenständige Zuordnung von Blockeinstellungen.

Geeignet für / Nicht geeignet für

Geeignet für: von der Galerie registriertes Lightbox-Overlay-Markup.

Nicht geeignet für: manuelle Verwendung als Seitenblock.

Hinweise

Dies ist ein Overlay-Helfer, der von Galerie-/Showcase-Renderern über PublicOverlayRegistry verwendet wird, kein eigenständiger Block.

Karte (`map`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/map.blade.php

Gerendertes HTML

<div class="wb-card wb-card-muted">
  <div class="wb-card-body wb-stack wb-gap-2">
    <strong>Location</strong>
    <p class="wb-m-0">Address text</p>
    <a href="https://maps.google.com/?q=Address" class="wb-btn wb-btn-secondary" target="_blank" rel="noopener noreferrer">Open map</a>
  </div>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-card, wb-card-muted, wb-card-body, wb-stack, wb-gap-2, wb-m-0, wb-btn, wb-btn-secondary, optionaler untergeordneter Wrapper wb-stack wb-gap-4.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
url	http/https-URL	Wird als sichere Kartenquelle akzeptiert und angezeigt, wenn sie sich vom Inhalt unterscheidet.
content	Text oder Abfrage	Wird als Fallback für die Kartenabfrage verwendet.
title	Text	Rendert in der Karte.
children	veröffentlichte untergeordnete Blöcke	Rendert untergeordnete Blöcke anschließend innerhalb von wb-stack wb-gap-4.

Geeignet für / Nicht geeignet für

Geeignet für: Legacy- oder konverterkompatible Inhalte, die bereits von diesem Renderer abhängen.

Nicht geeignet für: neue, manuell erstellte Seiten; verwenden Sie die weiter oben aufgeführten kanonischen strukturierten Blöcke.

Hinweise

Dies ist ein Legacy-/Kompatibilitäts-Renderer. Er akzeptiert für die Roh-URL nur die URL-Schemata http und https und kann untergeordnete Blöcke nach der Karte rendern.

Menü (`menu`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/menu.blade.php

Gerendertes HTML

<nav class="wb-stack wb-gap-2" aria-label="Menu">
  <ul class="wb-cluster wb-cluster-2 wb-cluster-between">
    <li><a href="/page" class="wb-btn wb-btn-secondary">Page</a></li>
  </ul>
</nav>

Wichtigste CSS-/WebBlocks-UI-Klassen

Verwendet die Klassen des navigation-auto-Renderers.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
Renderer-Verhalten	delegiert	Bindet den Navigation-Auto-Renderer direkt ein.
settings.menu_key/location	bekannter Menüschlüssel	Folgt dem Menüauswahlverhalten von Navigation Auto.
bevorzugt für neue Seiten	n/a	Verwenden Sie bewusst Navbar Navigation oder Navigation Auto, nicht menu.

Geeignet für / Nicht geeignet für

Geeignet für: Legacy- oder konverterkompatible Inhalte, die bereits von diesem Renderer abhängen.

Nicht geeignet für: neue, manuell erstellte Seiten; verwenden Sie die weiter oben aufgeführten kanonischen strukturierten Blöcke.

Hinweise

Dieses Kompatibilitäts-Partial delegiert direkt an navigation-auto.blade.php.

Metrikkarte (`metric-card`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/metric-card.blade.php

Gerendertes HTML

<div class="wb-stat">
  <div class="wb-stat-label">Label</div>
  <div class="wb-stat-value">42</div>
  <div class="wb-stat-delta">+8%</div>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-stat, wb-stat-label, wb-stat-value, wb-stat-delta, optionaler untergeordneter Wrapper wb-stack wb-gap-4.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
Renderer-Verhalten	delegierter Alias	Delegiert an einen vorhandenen Renderer-Pfad; die genaue Einstellungszuordnung folgt dem Delegaten, soweit sichtbar.
bevorzugt für neue Seiten	n/a	Bevorzugen Sie den in den Hinweisen genannten kanonischen Block anstelle dieses Alias-/Kompatibilitätsblocks.

Geeignet für / Nicht geeignet für

Geeignet für: Legacy-Inhalte des metric-card-Alias.

Nicht geeignet für: neue Inhalte; verwenden Sie Stat Card oder Columns-Statistiken.

Hinweise

Dies ist ein Legacy-/Kompatibilitäts-Metrik-Renderer. Der aktuell veröffentlichte Katalog verwendet stat-card.

Showcase-Liste (`showcase-list`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/showcase-list.blade.php

Gerendertes HTML

<section class="wb-stack wb-gap-6">
  <div class="wb-stack wb-gap-1">
    <h2>Projects</h2>
    <p>Selected work.</p>
  </div>
  <article class="wb-card wb-card-muted wb-public-showcase-item">
    <div class="wb-card-body wb-stack wb-gap-4">
      <div class="wb-stack wb-gap-1">
        <h3>Project</h3>
        <p>Summary.</p>
      </div>
      <section class="wb-gallery" aria-label="Project screenshots">
        <div class="wb-gallery-grid">
          <figure class="wb-gallery-item">
            <a href="/media/full.jpg" class="wb-gallery-trigger" data-wb-gallery-target="#wb-gallery-viewer-1">
              <img src="/media/full.jpg" alt="Project image" class="wb-gallery-media">
            </a>
            <figcaption class="wb-gallery-caption">Screenshot</figcaption>
          </figure>
        </div>
      </section>
      <a href="/project" class="wb-link">View project</a>
    </div>
  </article>
</section>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-stack, wb-gap-6, wb-gap-1, wb-card, wb-card-muted, wb-card-body, wb-gap-4, wb-gallery, wb-gallery-grid, wb-gallery-item, wb-gallery-trigger, wb-gallery-media, wb-gallery-caption, wb-link, plus das CMS-spezifische wb-public-showcase-item.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.items	Array	Rendert pro Eintrag ein Showcase-Element als abgeblendete (muted) Karte.
item.images[].asset_id	Medien-id	Rendert Galerie-Abbildungen und registriert einen gemeinsamen Galerie-Viewer, wenn Bilder vorhanden sind.
item.url	sichere URL	Rendert externen wb-link mit target/rel.
item.title/subtitle/url_label	Text	Rendert Showcase-Überschriften und Link-Beschriftung.

Geeignet für / Nicht geeignet für

Geeignet für: Legacy- oder konverterkompatible Inhalte, die bereits von diesem Renderer abhängen.

Nicht geeignet für: neue, manuell erstellte Seiten; verwenden Sie die weiter oben aufgeführten kanonischen strukturierten Blöcke.

Hinweise

Dies ist ein Legacy-/Kompatibilitäts-Renderer, der auf settings.items basiert. Er kann gallery-viewer-Overlay-Markup in PublicOverlayRegistry einfügen.

Sidebar-Navigationselement-Link (`sidebar-nav-item-link`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/sidebar-nav-item-link.blade.php

Gerendertes HTML

<a href="/docs" class="wb-sidebar-link is-active" aria-current="page">
  <i class="wb-icon wb-icon-book-open wb-sidebar-icon" aria-hidden="true"></i>
  <span>Docs</span>
</a>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-sidebar-link, wb-nav-group-item, is-active, wb-icon, wb-sidebar-icon.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
nested-Eingabe	true	Verwendet wb-nav-group-item.
nested-Eingabe	false	Verwendet wb-sidebar-link.
URL/Beschriftung des Sidebar-Elements	vorhanden	Für die Anker-Ausgabe erforderlich.
Element-Icon	konfiguriert	Rendert i.wb-icon.wb-icon-{icon}.wb-sidebar-icon.
Aktiv-Helfer	true	Fügt is-active und aria-current="page" hinzu.

Geeignet für / Nicht geeignet für

Geeignet für: interne Sidebar-Link-Ausgabe, die von den Sidebar-Element-Renderern gemeinsam genutzt wird.

Nicht geeignet für: direkte Seitenkomposition.

Hinweise

Dies ist ein interner Helfer für sidebar-nav-item und sidebar-nav-group. Bei verschachteltem Rendern wechselt die Klasse zu wb-nav-group-item.

Sidebar-Navigationsmenü-Element (`sidebar-navigation-menu-item`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/sidebar-navigation-menu-item.blade.php

Gerendertes HTML

<div class="wb-nav-group is-open" data-wb-nav-group>
  <button type="button" class="wb-nav-group-toggle is-active" aria-expanded="true" data-wb-nav-group-toggle>
    <span class="wb-nav-group-icon"><i class="wb-icon wb-icon-folder" aria-hidden="true"></i></span>
    <span class="wb-nav-group-label">Group</span>
    <span class="wb-nav-group-arrow" aria-hidden="true"></span>
  </button>
  <div class="wb-nav-group-items">
    <a href="/child" class="wb-nav-group-item">Child</a>
  </div>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-nav-group, is-open, wb-nav-group-toggle, is-active, wb-nav-group-icon, wb-icon, wb-nav-group-label, wb-nav-group-arrow, wb-nav-group-items, wb-nav-group-item, wb-sidebar-link, wb-sidebar-icon.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
NavigationItem link_type	Gruppe mit sichtbaren untergeordneten Elementen	Rendert .wb-nav-group mit Toggle und verschachtelten Elementen.
nested-Eingabe	true	Untergeordnete Links verwenden wb-nav-group-item.
showIcons-Eingabe	true	Erlaubt das Rendern der Sidebar-Icons der Elemente.
Aktiv-Helfer	true	Fügt is-open/is-active und aria-current hinzu, wo zutreffend.

Geeignet für / Nicht geeignet für

Geeignet für: internes Rendern von CMS-Menüelementen für die Sidebar-Navigation.

Nicht geeignet für: direkte Seitenkomposition.

Hinweise

Dieser Helfer rendert CMS-NavigationItem-Zeilen für sidebar-navigation, wenn dieser Block menübasiert ist statt auf manuellen untergeordneten Blöcken zu basieren.

Slider (`slider`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/slider.blade.php

Gerendertes HTML

<section class="wb-stack wb-gap-3">
  <h3>Slider</h3>
  <div class="wb-slider wb-card wb-card-muted" data-wb-slider>
    <div class="wb-slider-track" data-wb-slider-track>
      <article class="wb-slider-slide" data-wb-slider-slide>
        <div class="wb-card-body wb-stack wb-gap-3">
          <img src="/media/slide.jpg" alt="Slide">
          <div class="wb-stack wb-gap-1">
            <strong>Slide title</strong>
            <p>Caption.</p>
          </div>
        </div>
      </article>
    </div>
    <div class="wb-card-body wb-slider-controls">
      <button type="button" class="wb-btn wb-btn-secondary" data-wb-slider-prev>Previous</button>
      <div class="wb-slider-dots" role="tablist">
        <button type="button" class="wb-slider-dot is-active" data-wb-slider-dot></button>
      </div>
      <button type="button" class="wb-btn wb-btn-secondary" data-wb-slider-next>Next</button>
    </div>
  </div>
  <p class="wb-text-sm wb-text-muted">Caption</p>
</section>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-stack, wb-gap-3, wb-slider, wb-card, wb-card-muted, wb-slider-track, wb-slider-slide, wb-card-body, wb-gap-1, wb-slider-controls, wb-btn, wb-btn-secondary, wb-slider-dots, wb-slider-dot, is-active, wb-text-sm, wb-text-muted.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
Galerie-Medien	ein oder mehrere Assets	Rendert Folien aus galleryAssets().
Anzahl der Galerie-Medien	mehr als eins	Rendert Zurück-/Weiter-Steuerelemente und Punkte.
title	Text	Rendert über dem Slider.
subtitle	Text	Rendert abgeblendeten Hilfetext unter dem Slider.

Geeignet für / Nicht geeignet für

Geeignet für: Legacy- oder konverterkompatible Inhalte, die bereits von diesem Renderer abhängen.

Nicht geeignet für: neue, manuell erstellte Seiten; verwenden Sie die weiter oben aufgeführten kanonischen strukturierten Blöcke.

Hinweise

Dies ist ein Legacy-/Kompatibilitäts-Renderer, der auf galleryAssets() basiert. Slider-Steuerelemente werden nur gerendert, wenn mehr als ein Folien-Asset vorhanden ist.

Statistiken (`stats`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/stats.blade.php

Gerendertes HTML

<section class="wb-stack wb-gap-4">
  <div class="wb-grid wb-grid-3">
    <div class="wb-stat">
      <div class="wb-stat-label">Metric</div>
      <div class="wb-stat-value">42</div>
    </div>
  </div>
</section>

Wichtigste CSS-/WebBlocks-UI-Klassen

Verwendet den columns-Renderer mit variant = stats, einschließlich wb-stat, wb-stat-label, wb-stat-value und wb-stat-delta für untergeordnete column_item-Blöcke.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
Renderer-Verhalten	delegierter Alias	Delegiert an einen vorhandenen Renderer-Pfad; die genaue Einstellungszuordnung folgt dem Delegaten, soweit sichtbar.
bevorzugt für neue Seiten	n/a	Bevorzugen Sie den in den Hinweisen genannten kanonischen Block anstelle dieses Alias-/Kompatibilitätsblocks.

Geeignet für / Nicht geeignet für

Geeignet für: Legacy-Inhalte des stats-Alias.

Nicht geeignet für: neue Statistikgruppen; verwenden Sie Columns mit der stats-Variante oder Stat Card.

Hinweise

Dieses Kompatibilitäts-Partial delegiert an columns.blade.php, nachdem die Variante auf stats gesetzt wurde.

Tabs (`tabs`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/tabs.blade.php

Gerendertes HTML

<div class="wb-card">
  <div class="wb-card-header">
    <strong>Tab</strong>
    <span>Subtitle</span>
  </div>
  <div class="wb-card-body">
    <div>Content</div>
  </div>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-card, wb-card-header, wb-card-body, optionaler untergeordneter Wrapper wb-stack wb-gap-4.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
title	Text/Standard	Rendert den Kartenkopf-Titel, standardmäßig Tab.
subtitle	Text	Rendert das sekundäre Kopfzeilen-Span.
content	Text/HTML-Text	Rendert innerhalb von .wb-card-body.
children	veröffentlichte untergeordnete Blöcke	Rendert untergeordnete Blöcke anschließend innerhalb von wb-stack wb-gap-4.

Geeignet für / Nicht geeignet für

Geeignet für: Legacy- oder konverterkompatible Inhalte, die bereits von diesem Renderer abhängen.

Nicht geeignet für: neue, manuell erstellte Seiten; verwenden Sie die weiter oben aufgeführten kanonischen strukturierten Blöcke.

Hinweise

Dies ist ein Legacy-/Kompatibilitäts-Renderer. Er rendert untergeordnete Blöcke nach der Karte, wenn welche vorhanden sind.

Testimonial (`testimonial`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/testimonial.blade.php

Gerendertes HTML

<blockquote class="wb-card wb-card-muted">
  <div class="wb-card-body wb-stack wb-gap-2">
    <p class="wb-m-0">Quote text.</p>
    <footer class="wb-text-sm wb-text-muted">Name</footer>
  </div>
</blockquote>

Wichtigste CSS-/WebBlocks-UI-Klassen

Verwendet den quote-Renderer mit variant = testimonial.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
Renderer-Verhalten	delegierter Alias	Delegiert an einen vorhandenen Renderer-Pfad; die genaue Einstellungszuordnung folgt dem Delegaten, soweit sichtbar.
bevorzugt für neue Seiten	n/a	Bevorzugen Sie den in den Hinweisen genannten kanonischen Block anstelle dieses Alias-/Kompatibilitätsblocks.

Geeignet für / Nicht geeignet für

Geeignet für: Legacy-Inhalte des testimonial-Alias.

Nicht geeignet für: neue Zitate; verwenden Sie bei Bedarf Quote mit der testimonial-Variante.

Hinweise

Dieses Kompatibilitäts-Partial delegiert an quote.blade.php, nachdem die Variante auf testimonial gesetzt wurde.

Fallback-Renderer (`fallback`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/fallback.blade.php

Gerendertes HTML

<section class="wb-card wb-card-muted">
  <div class="wb-card-body wb-stack wb-gap-3">
    <div class="wb-stack wb-gap-1">
      <h3>Block title</h3>
      <p>Block content.</p>
    </div>
    <div class="wb-grid wb-grid-2">
      <!-- fallback child/content output -->
    </div>
  </div>
</section>

Wichtigste CSS-/WebBlocks-UI-Klassen

Fallback-Zweige verwenden vorhandene Primitive, darunter wb-card, wb-card-muted, wb-card-body, wb-stack, wb-gap-1, wb-gap-2, wb-gap-3, wb-grid, wb-grid-2, wb-grid-3, wb-table-wrap, wb-table, wb-table-striped, wb-slider, wb-btn, wb-link, wb-input, wb-textarea und wb-select.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
settings.items/cards/entries	Arrays	Kann je nach Fallback-Zweig kompatible Listen-/Kartenausgaben steuern.
settings.rows/options/related_slugs	Arrays	Wird von Fallback-Zweigen verwendet, wenn vorhanden.
Blocktyp/Quellkontext	variiert	Für die genaue Zweigauswahl ist eine Bestätigung anhand des Quellcodes erforderlich.

Geeignet für / Nicht geeignet für

Geeignet für: sicheres, reduziertes Rendern nicht unterstützter Produktionsblöcke.

Nicht geeignet für: geplante Seitenkomposition oder normale Migrationen.

Hinweise

Dies ist der Sicherheits-Renderer für unbekannte oder Übergangs-Slugs. Er enthält zweigspezifische Ausgaben für ältere Slugs wie comparison, timeline, product-card, pagination, input, textarea, select, checkbox-group und radio-group. Bevorzugen Sie die Dokumentation dedizierter Renderer-Dateien, wo sie existieren.

Fehlender Renderer (`missing-renderer`)

Renderer-Quelle

packages/webblocks-cms/resources/views/pages/partials/blocks/missing-renderer.blade.php

Gerendertes HTML

<div class="wb-alert wb-alert-warning">
  <div>
    <div class="wb-alert-title">Missing Block Renderer</div>
    <div>Expected renderer for <code>unknown</code> at <code>...</code>.</div>
  </div>
</div>

Wichtigste CSS-/WebBlocks-UI-Klassen

wb-alert, wb-alert-warning, wb-alert-title.

Einstellungen -> Klassen-/Markup-Zuordnung

Einstellung	Wert	Auswirkung auf die Ausgabe
Typ-Slug	beliebiger Slug ohne Renderer	Zeigt einen Warnhinweis mit dem Namen der erwarteten Renderer-Datei.
Umgebung	Fallback-Pfad außerhalb der Produktion	Wird verwendet, wenn außerhalb der Produktion kein öffentlicher Renderer existiert.
Laufzeiteinstellungen	n/a	Keine Blockeinstellungen beeinflussen diese Warnausgabe.

Geeignet für / Nicht geeignet für

Geeignet für: Entwickler-Sichtbarkeit, wenn außerhalb der Produktion kein Renderer existiert.

Nicht geeignet für: Gestaltung öffentlicher Inhalte.

Hinweise

Dieser Diagnose-Renderer wird verwendet, wenn kein konkreter Block-Renderer aufgelöst werden kann.