Standard-WordPress-Felder genügen, bis Ihr erstes individuelles Projekt ansteht. Sobald Sie Produktspezifikationen auf einer Karte anzeigen, einer Seite eine Galerie hinzufügen oder einen Block mit Versandbedingungen einbinden müssen, stoßen Sie an die Grenzen des Editors: Titel, Text, Kategorien, das war's.

Es gibt einen Ausweg, und der heißt nicht ACF Pro für 149 $ pro Jahr. Benutzerdefinierte Meta-Boxen fügen der Beitragsbearbeitungsoberfläche beliebige Felder hinzu, ohne visuellen Builder und ohne ein Dutzend überflüssiger Module. Genau das leistet CMB2: Es stellt eine PHP-API bereit, mit der Sie Meta-Boxen in Code beschreiben, der in der Versionsverwaltung lebt, nicht in der Datenbank.

Im Folgenden finden Sie den vollständigen Arbeitsablauf: von der Installation des Plugins bis zur Ausgabe der Daten im Frontend. Am Ende dieses Artikels verfügen Sie über eine funktionierende Meta-Box-Datei, die sich an jeden Inhaltstyp anpasst, von Seiten bis zu WooCommerce-Produkten.

💡 Kurzüberblick:

• Installieren Sie CMB2 aus dem WordPress.org-Verzeichnis: Das Plugin ist kostenlos und mit zwei Klicks installiert.
• Erstellen Sie eine Datei metaboxes.php in Ihrem Theme-Ordner und beschreiben Sie die benötigten Felder über den Hook cmb2_admin_init.
• Binden Sie die Datei mit einer einzigen require_once-Zeile in functions.php ein und prüfen Sie die Meta-Box im Admin-Bereich.
• Geben Sie die gespeicherten Daten im Frontend mit get_post_meta() und korrektem Escaping aus.

Was ist CMB2: Code statt eines visuellen Builders

CMB2 ist eine Entwicklerbibliothek, die Meta-Boxen, benutzerdefinierte Felder und Formulare in WordPress erstellt. Von Haus aus unterstützt sie Dutzende Feldtypen: Text, WYSIWYG-Editor, Datei-Upload, Datumsauswahl, Farbauswahl, Radio-Buttons, Dropdowns, Wiederholfelder und Gruppen.

Der Hauptunterschied zu ACF: CMB2 besitzt keinen visuellen Builder. Alle Meta-Boxen werden in PHP-Dateien innerhalb Ihres Themes beschrieben. Für Entwickler ist das ein Vorteil: Die Konfiguration lebt in Git, sie kann nicht versehentlich über das Admin-Panel gelöscht werden, und die Migration zwischen Staging und Produktion reduziert sich auf ein Code-Deployment. Gleichzeitig ist CMB2 vollständig kostenlos, während ACF Pro Sie rund 149 $ pro Jahr für wiederholbare Felder und Gruppen kostet.

Die Bibliothek wird seit 2014 aktiv gepflegt. Auf WordPress.org hat das Plugin eine 5-Sterne-Bewertung und über 300.000 aktive Installationen. Das GitHub-Repository erhält regelmäßige Updates: Die letzte Version adressierte die Kompatibilität mit PHP 8.4 und WordPress 6.7. Dies ist kein aufgegebenes Projekt, das in sechs Monaten fallengelassen wird.

Schritt 1: Das Plugin installieren

Gehen Sie zu Plugins → Installieren, geben Sie „CMB2" in das Suchfeld ein und klicken Sie auf „Installieren". Nach der Aktivierung lädt das Plugin seine Engine, ändert aber von sich aus nichts im Admin-Bereich: Meta-Boxen erscheinen erst, nachdem Sie sie im Code beschrieben haben.

Falls Sie CMB2 manuell in Ihr Theme einbinden, ohne es über das Admin-Panel zu installieren, fügen Sie Folgendes am Anfang von functions.php hinzu:

1
require_once __DIR__ . '/cmb2/init.php';

Zwei wichtige Punkte. Erstens: init.php sollte so früh wie möglich geladen werden, außerhalb jeglicher Hooks. Umschließen Sie es nicht mit if ( ! class_exists(...-Prüfungen; CMB2 behandelt Konflikte durch doppeltes Laden selbst. Zweitens: Bei manueller Einbindung müssen Sie CMB2 manuell aktualisieren, anders als bei automatischen Updates über das Admin-Panel.

Schritt 2: Die Meta-Box-Datei schreiben

Erstellen Sie im Wurzelverzeichnis Ihres Child-Themes einen Ordner cmb2-metaboxes und darin eine Datei metaboxes.php. Diese Datei wird alle Ihre Felddefinitionen enthalten.

Nachfolgend sehen Sie funktionierenden Code, der WooCommerce-Produkten einen Texteditor, eine Kurzbeschreibung und eine Badge-Auswahl hinzufügt. Kopieren Sie ihn in metaboxes.php:

1
add_action( 'cmb2_admin_init', 'sdstudio_register_metaboxes' );
2
 
3
function sdstudio_register_metaboxes() {
4
 
5
    $prefix = '_sdstudio_';
6
 
7
    $cmb = new_cmb2_box( array(
8
        'id'           => 'product_extra_info',
9
        'title'        => __( 'Дополнительная информация о товаре', 'cmb2' ),
10
        'object_types' => array( 'product' ),
11
        'context'      => 'normal',
12
        'priority'     => 'high',
13
        'show_names'   => true,
14
    ) );
15
 
16
    $cmb->add_field( array(
17
        'name'    => __( 'Описание для карусели на главной', 'cmb2' ),
18
        'desc'    => __( 'Текст, который будет показан в слайдере товаров.', 'cmb2' ),
19
        'id'      => $prefix . 'carousel_desc',
20
        'type'    => 'wysiwyg',
21
        'options' => array(
22
            'textarea_rows' => 5,
23
        ),
24
    ) );
25
 
26
    $cmb->add_field( array(
27
        'name' => __( 'Короткое описание', 'cmb2' ),
28
        'desc' => __( 'Одна строка — для карточки товара в сетке.', 'cmb2' ),
29
        'id'   => $prefix . 'short_desc',
30
        'type' => 'textarea_small',
31
    ) );
32
 
33
    $cmb->add_field( array(
34
        'name' => __( 'Бейдж товара', 'cmb2' ),
35
        'desc' => __( 'Метка «Новинка», «Хит» или «Распродажа».', 'cmb2' ),
36
        'id'   => $prefix . 'badge',
37
        'type' => 'select',
38
        'show_option_none' => true,
39
        'options'          => array(
40
            'new'   => __( 'Новинка', 'cmb2' ),
41
            'hit'   => __( 'Хит', 'cmb2' ),
42
            'sale'  => __( 'Распродажа', 'cmb2' ),
43
        ),
44
    ) );
45
 
46
}

Was hier passiert: Der Hook cmb2_admin_init feuert, wenn das Admin-Panel geladen wird, und registriert die Meta-Box auf der Produktbearbeitungsseite. new_cmb2_box() erzeugt einen Container mit dem Titel „Zusätzliche Produktinformationen", und drei add_field()-Aufrufe fügen ihm Felder hinzu: einen WYSIWYG-Editor, ein kompaktes Textfeld und ein Dropdown mit vordefinierten Optionen. Jedes Feld erhält eine eindeutige id mit dem Präfix _sdstudio_, um Konflikte mit anderen Plugins zu vermeiden.

Falls Sie reguläre Seiten anstelle von WooCommerce benötigen, ersetzen Sie 'object_types' => array( 'product' ) durch 'object_types' => array( 'page' ). Für mehrere Inhaltstypen listen Sie diese auf: array( 'page', 'post' ).

Die vollständige Liste der Feldtypen finden Sie in der offiziellen CMB2-Dokumentation auf GitHub. Dutzende Optionen sind standardmäßig verfügbar: von einfachem Text und WYSIWYG-Editoren über Datei-Uploads, Farbauswahlen und Radio-Buttons bis hin zu Taxonomien. Wählen Sie den richtigen Typ für Ihre spezifische Aufgabe anhand der Dokumentation, nicht durch Raten.

Schritt 3: In functions.php einbinden

Nun müssen Sie die erstellte Datei laden. Öffnen Sie functions.php in Ihrem Child-Theme und fügen Sie eine einzelne Zeile vor dem schließenden ?>-Tag hinzu oder am Ende der Datei, falls kein schließendes Tag vorhanden ist:

1
require_once __DIR__ . '/cmb2-metaboxes/metaboxes.php';

Sichern Sie functions.php, bevor Sie den Code hinzufügen. Ein Syntaxfehler in require_once legt die Seite mit einem fatalen PHP-Fehler lahm, und Sie können die Datei nur per FTP oder über Ihr Hosting-Panel wiederherstellen. Öffnen Sie nach dem Speichern ein beliebiges Produkt im Admin-Bereich und prüfen Sie, ob die Meta-Box „Zusätzliche Produktinformationen" unterhalb des Content-Editors erscheint.

Füllen Sie die Testfelder aus und klicken Sie auf „Aktualisieren". CMB2 speichert die Daten automatisch in der Tabelle wp_postmeta. Es sind keine zusätzlichen save_post-Hook-Aufrufe erforderlich: Die Bibliothek fängt das Speichern des Beitrags ab und verarbeitet ihre Felder selbstständig.

Schritt 4: Daten im Frontend ausgeben

Die Daten sind in der Datenbank gespeichert; nun müssen Sie sie den Besuchern zeigen. Öffnen Sie die Theme-Datei, die für die Produktseite zuständig ist, üblicherweise single-product.php oder content-single-product.php. Fügen Sie den Code innerhalb des WordPress-Loops ein:

1
<?php
2
$carousel_desc = get_post_meta( get_the_ID(), '_sdstudio_carousel_desc', true );
3
$badge         = get_post_meta( get_the_ID(), '_sdstudio_badge', true );
4
 
5
if ( ! empty( $carousel_desc ) ) : ?>
6
    <div class="product-carousel-desc">
7
        <?php echo wp_kses_post( $carousel_desc ); ?>
8
    </div>
9
<?php endif; ?>
10
 
11
<?php if ( ! empty( $badge ) ) : ?>
12
    <span class="product-badge product-badge--<?php echo esc_attr( $badge ); ?>">
13
        <?php echo esc_html( $badge ); ?>
14
    </span>
15
<?php endif; ?>
16

Aufschlüsselung: get_post_meta() ruft den Wert anhand der Feld-ID ab. Für ein WYSIWYG-Feld verwenden Sie wp_kses_post(), das erlaubte HTML-Tags zulässt und potenziell gefährliche filtert. Für einfachen Text oder ein Select-Feld genügt esc_html(): Es wandelt Sonderzeichen in HTML-Entitäten um und verhindert XSS.

Wurde die Meta-Box für Seiten erstellt ('object_types' => array( 'page' )), platzieren Sie denselben Code in page.php oder content-page.php. Die Mechanik ist identisch: get_post_meta() innerhalb des Loops, Escaping je nach Feldtyp.

Video: CMB2 von der Installation bis zur funktionierenden Meta-Box

In diesem 20-minütigen Tutorial führt der Autor den vollständigen Arbeitsablauf vor: Installation, Felderstellung, Dateieinbindung und Datenausgabe im Frontend. Hilfreich anzusehen, falls die textlichen Anleitungen Lücken hinterlassen haben.

⁉️🤔 Häufig gestellte Fragen

Wie unterscheidet sich CMB2 von ACF?

ACF bietet einen visuellen Feld-Builder direkt im Admin-Bereich: Sie können eine Meta-Box zusammenstellen, ohne eine einzige Codezeile zu schreiben. CMB2 erfordert die Beschreibung der Felder in PHP-Dateien innerhalb Ihres Themes. Für Entwickler, die ihre Konfiguration in Git speichern, ist CMB2 komfortabler: Meta-Boxen hängen nicht vom Datenbankzustand ab, sie können nicht versehentlich über das Admin-Panel gelöscht werden, und die Migration zwischen Staging und Produktion reduziert sich auf ein Code-Deployment. ACF Pro kostet ab 149 $ pro Jahr für wiederholbare Felder und Gruppen; CMB2 ist kostenlos.

Kann CMB2 ohne Installation des Plugins genutzt werden?

Ja. Kopieren Sie den CMB2-Ordner in Ihr Theme und binden Sie init.php in functions.php ein, wie in Schritt 1 gezeigt. Dieser Ansatz eignet sich für Premium-Themes, die sofort nach der Aktivierung funktionieren sollen, ohne dass der Nutzer ein Drittanbieter-Plugin installieren muss. Der Nachteil: Sie müssen CMB2 bei jeder neuen Version manuell aktualisieren.

Funktionieren CMB2-Felder im Gutenberg-Editor?

Ja, CMB2-Meta-Boxen werden unterhalb des Gutenberg-Editors in gewohnter Weise angezeigt, im Bereich unter dem Inhalt. Allerdings integrieren sie sich standardmäßig nicht in Editor-Blöcke. Wenn Sie ein Feld direkt in einen Block einbetten müssen, ist zusätzliche Entwicklung über die CMB2-API und register_block_type() erforderlich.

Was tun, wenn die Meta-Box nicht im Admin-Bereich erscheint?

Prüfen Sie drei Dinge. Erstens: Stimmt object_types mit dem Typ des bearbeiteten Beitrags überein? Für WooCommerce-Produkte benötigen Sie 'product', nicht 'post'. Zweitens: Liegt ein PHP-Syntaxfehler vor? Aktivieren Sie WP_DEBUG in wp-config.php und prüfen Sie das Log. Drittens: Kollidiert das Feld-ID-Präfix mit einem anderen Plugin? Verwenden Sie ein eindeutiges Präfix wie _sdstudio_.

Kann ich wiederholbare Feldgruppen erstellen?

Ja. CMB2 unterstützt wiederholbare Felder über das Flag 'repeatable' => true und wiederholbare Gruppen über $cmb->add_group_field(). Eine Gruppe erlaubt es, einen Block „Merkmal: Wert" hinzuzufügen und neue Instanzen mit einer Schaltfläche „Zeile hinzufügen" direkt im Admin-Bereich zu erzeugen.

Funktioniert CMB2 mit Multisite?

Ja, das Plugin ist vollständig kompatibel mit WordPress Multisite. Meta-Boxen können global in der functions.php des aktiven Netzwerk-Themes oder individuell für jede Site registriert werden. Der Aufruf von get_post_meta() funktioniert in beiden Modi gleich.

CMB2 oder ACF: Welcher Ansatz für Ihre Aufgabe

CMB2 löst genau eine Aufgabe: das Erstellen benutzerdefinierter Meta-Boxen durch Code, wobei die Konfiguration in Theme-Dateien statt in der Datenbank gespeichert wird. Die Wahl hängt von Ihrem Arbeitsablauf ab, nicht von einem abstrakten „Was ist besser".

• Wenn Sie Entwickler sind und die gesamte Projektkonfiguration in Git speichern, wählen Sie CMB2. Meta-Boxen leben in metaboxes.php, werden mit Ihrem Theme ausgeliefert und erfordern keine Datenbanksynchronisation zwischen Staging und Produktion.

• Wenn Sie einen visuellen Builder, wiederholbare flexible Felder und fertige Gutenberg-Blöcke ohne Code benötigen, wählen Sie ACF Pro. Das Abonnement ab 149 $ jährlich macht sich durch die Geschwindigkeit beim Prototyping bezahlt.

• Wenn Ihr Projekt bereits CMB2 nutzt und die Meta-Boxen zuverlässig funktionieren, bleiben Sie dabei. Die Bibliothek ist nicht aufgegeben, erfordert keine dringende Migration und erhält regelmäßig Kompatibilitäts-Updates.

Probieren Sie beide Ansätze auf einer Testseite aus: Erstellen Sie dieselbe Meta-Box in CMB2 und in ACF. Der Unterschied im Ansatz wird innerhalb von 20 Minuten offensichtlich. Welches Tool nutzen Sie? Teilen Sie es in den Kommentaren mit.