Idee & Motivation

Kennst du das? Du möchtest Inhalte auf deiner Bricksbuilder Website dynamisch anzeigen – z. B. Infos zu bestimmten Seiten, Benutzern, Tools oder sogar externe Daten. Doch statt sich durch komplexe Custom Queries, Hooks und Shortcodes zu wühlen, willst du eine elegante Lösung direkt im BricksBuilder?

Mit einer einfachen Syntax wie {name:gruppe:feld:id} kannst du strukturierte Daten flexibel im Content einfügen – ganz ohne komplizierte Abfragen.

Der Denkansatz

Statt jeden Wert manuell abzurufen oder jeden Inhalt individuell zu programmieren, bauen wir ein generisches System:

• Modular: Neue Felder & Gruppen lassen sich einfach konfigurieren
• Flexibel: Tags können überall verwendet werden (Textfelder, Titel, HTML)
• Erweiterbar: Später können Daten auch von einer API oder DB kommen

Struktur & Aufbau

Unser Ziel: Ein simples, aber erweiterbares Fundament.

Schritt 1: Konfiguration – Gruppen & Felder definieren

Zuerst bestimmen wir, welche Datenquelle welche Felder hat. Diese Konfiguration steuert alles:

function get_custom_tag_sources() {
    return [
        'gruppe1' => [
            'label'    => 'Beispiel-Gruppe 1',
            'endpoint' => 'daten/{id}', // optional – nur zur Demonstration
            'fields'   => [
                'feld1' => 'Feld A',
                'feld2' => 'Feld B',
            ],
        ],
        'gruppe2' => [
            'label'    => 'Beispiel-Gruppe 2',
            'endpoint' => 'daten/{id}/details',
            'fields'   => [
                'feldX' => 'Feld X',
                'feldY' => 'Feld Y',
            ],
        ],
    ];
}

Gedanke dahinter:

Statt Inhalte hart zu codieren, geben wir dem System die „Landkarte“ mit – die Felder kennt es dann selbstständig.

Schritt 2: Dynamische Tags registrieren (für Bricks)

Jetzt sagen wir Bricks, welche Tags zur Verfügung stehen – basierend auf der Konfiguration:

add_filter('bricks/dynamic_tags_list', function ($tags) {
    foreach (get_custom_tag_sources() as $group_key => $group) {
        foreach ($group['fields'] as $field_key => $label) {
            $tags[] = [
                'name'  => '{api:' . $group_key . ':' . $field_key . ':<id>}',
                'label' => 'API: ' . $label,
                'group' => $group['label'],
            ];
        }
    }
    return $tags;
});

Gedanke dahinter:

Tags wie {api:gruppe1:feld2:123} werden automatisch zur Auswahl gestellt – kein extra Code nötig pro Feld.

Schritt 3: Einzelne Tags auswerten & rendern

Beim Rendern ersetzen wir das Tag durch einen Beispielwert – in der Praxis könnten hier echte Daten zurückkommen:

add_filter('bricks/dynamic_data/render_tag', function ($tag, $post = null, $context = 'text') {
    if (!preg_match('/^{api:([a-z0-9_]+):([a-z0-9_]+):([^}]+)}$/', $tag, $m)) {
        return $tag;
    }

    [$full, $group, $field, $id] = $m;

    return "Demo-Wert für [$group → $field → $id]";
}, 20, 3);

Gedanke dahinter:

Die Logik prüft, ob das Tag der erwarteten Struktur entspricht – und extrahiert dann die relevanten Teile.

Schritt 4: Content automatisch nach Tags durchsuchen

Damit auch Texte, die mehrere Tags enthalten, dynamisch ersetzt werden, fügen wir noch einen Content-Parser hinzu:

add_filter('bricks/dynamic_data/render_content', 'custom_parse_content', 20, 3);
add_filter('bricks/frontend/render_data', 'custom_parse_content', 20, 2);

function custom_parse_content($content, $post = null, $context = 'text') {
    if (strpos($content, '{api:') === false) return $content;

    preg_match_all('/{api:([a-z0-9_]+):([a-z0-9_]+):([^}]+)}/', $content, $matches);

    foreach ($matches[0] as $i => $full_tag) {
        $value = apply_filters('bricks/dynamic_data/render_tag', $full_tag, $post, $context);
        $content = str_replace($full_tag, $value, $content);
    }

    return $content;
}

Alle passenden Tags im Content werden ersetzt – ob im Textblock, Button oder sogar HTML-Inhalt.