{"id":18073,"date":"2026-09-24T14:24:39","date_gmt":"2026-09-24T08:39:39","guid":{"rendered":"https:\/\/www.bay20.com\/de\/?p=18073"},"modified":"2026-09-24T14:25:36","modified_gmt":"2026-09-24T08:40:36","slug":"so-verweisen-sie-in-bigcommerce-stencil-vorlagendateien-auf-benutzerdefinierte-metafelder","status":"publish","type":"post","link":"https:\/\/www.bay20.com\/de\/so-verweisen-sie-in-bigcommerce-stencil-vorlagendateien-auf-benutzerdefinierte-metafelder\/","title":{"rendered":"So verweisen Sie in BigCommerce-Stencil-Vorlagendateien auf benutzerdefinierte Metafelder"},"content":{"rendered":"\n<p>Metafelder sind die Methode von <a href=\"https:\/\/www.bay20.com\/de\/bigcommerce-entwicklungsunternehmen\/\" target=\"_blank\" rel=\"noopener\" title=\"\">BigCommerce<\/a>, um strukturierte, benutzerdefinierte Daten an ein Produkt, eine Kategorie, eine Marke oder einen Warenkorb anzuh\u00e4ngen \u2013 also Informationen, die \u00fcber die Standardfelder hinausgehen. Sie sind unter einem Namensraum und einem Schl\u00fcssel organisiert, sodass mehrere Apps oder Funktionen ihre eigenen Daten speichern k\u00f6nnen, ohne sich gegenseitig zu behindern. Metafelder sind ein wirklich n\u00fctzlicher Bestandteil der Plattform. Sie geh\u00f6ren aber auch zu den Dingen, deren Einbindung in eine Shop-Seite am meisten Verwirrung stiftet.<\/p>\n\n\n\n<p>Jemand versucht, ein Metafeld in eine Stencil-Vorlage einzubinden, und greift dabei auf dasselbe Muster zur\u00fcck, das bei benutzerdefinierten Feldern funktioniert: Man durchl\u00e4uft ein Array des Produktobjekts, gleicht es mit einem Namen ab und gibt den Wert aus. Doch dann wird nichts angezeigt \u2013 weder eine Fehlermeldung noch eine leere Zeichenfolge, einfach gar nichts, weil das Array, das man durchl\u00e4uft, gar nicht existiert. Das ist meist der Moment, in dem jemand erkennt, dass Metafelder und benutzerdefinierte Felder in einer Vorlage v\u00f6llig unterschiedlich behandelt werden.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Warum unterscheiden sich Metafelder von benutzerdefinierten Feldern?<\/h2>\n\n\n\n<p>Benutzerdefinierte Felder sind der einfache Fall. Sie sind bereits im Seitenkontext vorhanden, wenn Ihre Vorlage ausgef\u00fchrt wird, und zwar als \u201eproduct.custom_fields\u201c, ein Array aus {Name, Wert}-Paaren. Eine Schleife, abgleichen, fertig.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>{{#each product.custom_fields}}\n  {{#if (eq this.name \"thread_count\")}}\n    &lt;span class=\"thread-count\"&gt;{{this.value}}&lt;\/span&gt;\n  {{\/if}}\n{{\/each}}<\/code><\/pre>\n\n\n\n<p>Metafelder haben damit nichts zu tun. Sie sind nicht Teil des Standard-Produktkontexts, den Stencil erstellt. Wenn Sie in einer Standardvorlage von Cornerstone nach \u201eproduct.metafields\u201c suchen, werden Sie nichts finden. Keine noch so ausgekl\u00fcgelte Schleife kann Daten zur\u00fcckgeben, die gar nicht erst abgerufen wurden.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"980\" height=\"490\" src=\"https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/09\/custon_fields-vs-metafields-980x490.png\" alt=\"\" class=\"wp-image-18044\" srcset=\"https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/09\/custon_fields-vs-metafields-980x490.png 980w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/09\/custon_fields-vs-metafields-300x150.png 300w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/09\/custon_fields-vs-metafields-768x384.png 768w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/09\/custon_fields-vs-metafields-800x400.png 800w, https:\/\/www.bay20.com\/de\/wp-content\/uploads\/2026\/09\/custon_fields-vs-metafields.png 1000w\" sizes=\"auto, (max-width: 980px) 100vw, 980px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Legen Sie den richtigen \u201epermission_set\u201c f\u00fcr die Metafelder fest<\/h2>\n\n\n\n<p>Bevor Sie \u00fcberhaupt eine Vorlage bearbeiten, gibt es ein Feld im Metafeld selbst, das entscheidet, ob es f\u00fcr den Storefront \u00fcberhaupt sichtbar ist. Jedes Metafeld verf\u00fcgt \u00fcber einen \u201epermission_set\u201c mit einem der folgenden Werte: \u201eapp_only\u201c, \u201eread\u201c, \u201ewrite\u201c, \u201eread_and_sf_access\u201c oder \u201ewrite_and_sf_access\u201c. Nur die beiden Varianten mit \u201e_sf_access\u201c sind f\u00fcr die GraphQL-API des Storefront sichtbar. Stencil nutzt die GraphQL-API, um Metafelddaten in eine Seite zu laden.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Verwenden Sie GraphQL-Frontmatter, um Metafelder abzurufen<\/h2>\n\n\n\n<p>Da Metafelder nicht im Standardkontext enthalten sind, m\u00fcssen Sie sie selbst abrufen. Dazu m\u00fcssen Sie eine GraphQL-Abfrage im Front Matter der Vorlage verwenden. Der Front Matter befindet sich am Anfang einer Stencil-Vorlage zwischen den Markierungen \u201e&#8212;\u201c. Ein dortiger GQL-Block f\u00fchrt vor dem Rendern der Seite eine Abfrage an die Storefront-GraphQL-API durch und f\u00fcgt das Ergebnis unter einem von Ihnen gew\u00e4hlten Namen wieder in den Seitenkontext ein.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>---\ngql: |\n  query productMetafieldsById($productId: Int!) {\n    site {\n      product(entityId: $productId) {\n        entityId\n        metafields(namespace: \"shared\") {\n          edges {\n            node {\n              key\n              value\n            }\n          }\n        }\n      }\n    }\n  }\n---\n\n{{#each data.site.product.metafields.edges}}\n  {{#if (eq this.node.key \"size-guide\")}}\n    &lt;div class=\"size-guide\"&gt;{{{this.node.value}}}&lt;\/div&gt;\n  {{\/if}}\n{{\/each}}<\/code><\/pre>\n\n\n\n<p>Beachten Sie, dass es keinen separaten Variablenblock gibt, der \u201eproductId\u201c einer Variablen zuordnet. \u201e$productId\u201c ist eine der speziellen Variablen, die Stencil je nach Seitentyp automatisch erkennt. Auf der Produktseite f\u00fcgt Stencil die aktuelle \u201eproductId\u201c in eine Abfrage ein, die eine Variable mit genau diesem Namen deklariert. Sie m\u00fcssen diese nicht selbst f\u00fcllen. Wenn Sie nicht auf eine dieser speziellen Variablen zur\u00fcckgreifen, k\u00f6nnen Sie auch eine Abfrage ganz ohne Variablen schreiben.<\/p>\n\n\n\n<p>Das Argument \u201enamespace\u201c \u00fcbernimmt hier die eigentliche Arbeit. Metafelder werden gezielt nach Namespaces gruppiert, damit du eine Abfrage auf eine bestimmte Gruppe beschr\u00e4nken kannst. Du musst nicht jedes an ein Produkt angeh\u00e4ngte Metafeld abrufen, unabh\u00e4ngig davon, ob du es ben\u00f6tigst oder nicht. Wenn ein Feld nicht angezeigt wird, \u00fcberpr\u00fcfe, ob der Namespace in deiner Abfrage genau mit dem \u00fcbereinstimmt, unter dem es gespeichert wurde. Ein Fehler wird hier stillschweigend ignoriert \u2013 ein Tippfehler f\u00fchrt lediglich dazu, dass das Metafeld so aussieht, als w\u00fcrde es nicht existieren.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Warum ist die Einheitlichkeit bei der Namensgebung hier so wichtig?<\/h2>\n\n\n\n<p>Sowohl der Namespace als auch der Schl\u00fcssel d\u00fcrfen maximal 64 Zeichen lang sein. BigCommerce behandelt beide als w\u00f6rtliche Zeichenfolgen, sodass weder Gro\u00df-\/Kleinschreibung ber\u00fccksichtigt wird noch eine unscharfe Suche stattfindet. Wenn Sie etwas unter dem Namespace \u201eShared\u201c speichern und dann nach \u201eshared\u201c suchen, erhalten Sie kein Ergebnis. Es sieht so aus, als h\u00e4tte das Feld nie existiert. Aus diesem Grund ist es hilfreich, sich fr\u00fchzeitig auf eine Namenskonvention zu einigen. Kleinbuchstaben und Bindestriche funktionieren gut. Das scheint auf den ersten Blick eine Kleinigkeit zu sein. Sobald jedoch drei Personen mit drei unterschiedlichen Schreibgewohnheiten Metafelder zum selben Shop hinzuf\u00fcgen, wird dies zu einem wirklich l\u00e4stigen Fehler, der nur schwer aufzusp\u00fcren ist.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Warum funktioniert das nicht automatisch in jeder Vorlage?<\/h2>\n\n\n\n<p>Der Abruf befindet sich im Front Matter einer bestimmten Vorlage und gilt daher nur dort. Das Hinzuf\u00fcgen eines GQL-Blocks zu \u201eproduct.html\u201c macht diese Daten weder in \u201ecategory.html\u201c noch an anderer Stelle verf\u00fcgbar. Stattdessen ben\u00f6tigt jede Vorlage, die ein bestimmtes Metafeld ben\u00f6tigt, eine eigene Kopie dieses Front-Matter-Blocks. Das vergisst man leicht, besonders wenn man von benutzerdefinierten Feldern kommt, da diese ohne jegliche Einrichtung \u00fcberall angezeigt werden. Wenn also ein Metafeld auf der Produktseite einwandfrei dargestellt wird, aber in einer wiederverwendeten Komponente \u2013 beispielsweise einem Partial f\u00fcr verwandte Produkte \u2013 verschwindet, ist das in der Regel der Grund daf\u00fcr. Das Partial hat nie nach den Daten gefragt. Nur die \u00fcbergeordnete Vorlage hat dies getan.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Wo dies tats\u00e4chlich zum Einsatz kommt<\/h2>\n\n\n\n<p>Gr\u00f6\u00dfentabellen, Pflegehinweise und ausf\u00fchrlichere Datenbl\u00e4tter sind die \u00fcblichen Anwendungsf\u00e4lle \u2013 alles, was strukturierter ist als ein einfaches benutzerdefiniertes Feld, aber nicht ganz in die Hauptproduktbeschreibung passt. Metafelder tauchen auch auf eine zweite, weniger sichtbare Weise auf: Apps schreiben oft ihre eigenen Metafelder rein f\u00fcr den internen Gebrauch, die mit \u201eapp_only\u201c gekennzeichnet sind und direkt neben den _sf_access-Feldern stehen, die auf der Seite angezeigt werden sollen. Beide Arten k\u00f6nnen gleichzeitig f\u00fcr dasselbe Produkt vorhanden sein. Doch egal, wie die Abfrage geschrieben ist: Nur die Felder, die explizit f\u00fcr den Shop freigegeben wurden, werden jemals in eine Vorlage \u00fcbernommen.<\/p>\n\n\n\n<p><strong><a href=\"https:\/\/www.bay20.com\/de\/kontakt-uns\/\" target=\"_blank\" rel=\"noopener\" title=\"\">Kontaktieren<\/a> Sie uns unter wargis@bay20.com \/ manish@bay20.com oder rufen Sie uns unter +91-9582784309 oder +91-8800519180 an, wenn Sie Unterst\u00fctzung zu <a href=\"https:\/\/www.bay20.com\/de\/bigcommerce-entwicklungsunternehmen\/\" target=\"_blank\" rel=\"noopener\" title=\"\">BigCommerce<\/a> ben\u00f6tigen.<\/strong><\/p>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Metafelder sind die Methode von BigCommerce, um strukturierte, benutzerdefinierte Daten an ein Produkt, eine Kategorie, eine Marke oder einen Warenkorb anzuh\u00e4ngen \u2013 also Informationen, die \u00fcber die Standardfelder hinausgehen. Sie sind unter einem Namensraum und einem Schl\u00fcssel organisiert, sodass mehrere Apps oder Funktionen ihre eigenen Daten speichern k\u00f6nnen, ohne sich gegenseitig zu behindern. Metafelder sind [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":18046,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[13,85],"tags":[175],"class_list":["post-18073","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-bigcommerce","category-bigcommerce-stencil","tag-bigcommerce"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/posts\/18073","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/comments?post=18073"}],"version-history":[{"count":1,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/posts\/18073\/revisions"}],"predecessor-version":[{"id":18074,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/posts\/18073\/revisions\/18074"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/media\/18046"}],"wp:attachment":[{"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/media?parent=18073"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/categories?post=18073"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.bay20.com\/de\/wp-json\/wp\/v2\/tags?post=18073"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}