How to use brands metafields in your theme

Unfortunately, brand metafields cannot be accessed directly on the brand landing page. 

However, they can be accessed from the context of a product assigned to that brand. So, for example, you could use a brand metafield on a product page.

Once you have created your brand metafield, and you have enabled storefront access, it can be queried using GraphQL. 

One way to do this would be simply design your query and then make a JavaScript request. The downside of this is that any changes then become "client-side". 

However, there's a better way. A powerful part of stencil themes is the ability to add GraphQL queries to the front matter. When you do this, BigCommerce makes the response to this request available server-side. This means you can use GraphQL data within your template. 

For example, this query will search for a metafield with key "space_48" and key "test_content" within the current category. By adding it to the theme front matter a new object will be available for access in the template, e.g. gql.

---
product:
    videos:
        limit: {{theme_settings.productpage_videos_count}}
    reviews:
        limit: {{theme_settings.productpage_reviews_count}}
    related_products:
        limit: {{theme_settings.productpage_related_products_count}}
    similar_by_views:
        limit: {{theme_settings.productpage_similar_by_views_count}}

gql: "query brandMetatafieldByProductId($productId: Int!) {
    site {
      product(entityId: $productId) {
        entityId
        name
        brand {
          name,
          metafields(
            namespace: "space_48"
            keys: ["test_content"]
          ) {
            edges {
              node {
                value
              }
            }
          }
        }
      }
    }
  }
"


---

Assuming that this was raw HTML then it could be outputted at the top of the page by adding this to the category.html template and using triple braces `{{{ }}}`:

{{#each gql.data.site.product.brand.metafields.edges}}
    {{{node.value}}}
{{/each}}

Alternatively, if the metafield was used to enable/disable functionality per brand. It could be checked within a condition like so:

{{#each gql.data.site.product.brand.metafields.edges}}
    {{#eq node.value "Yes"}}
       The flag was enabled for this brand.
    {{/eq}}
{{/each}}