Warehouse + Flair Shopify theme guide

By: Maestrooo
We've put together this guide for setting up Flair in the Warehouse Shopify theme by Maestrooo. This page includes instructions for setting up Flair badges (aka labels or stickers) and Flair banners.

How to edit your theme

  • Visit Shopify Admin > Themes and click Actions > Edit code.

Install Flair product badges

On product pages

Edit snippets/product-meta.liquid:

<div class="product-meta">
{%- if template.name == 'product' and template != 'product.quick-view' -%}
<h1 class="product-meta__title heading h1">{{ product.title }}</h1>
{%- else -%}
<h3 class="product-meta__title heading h2">
<a href="{{ product.url }}">{{ product.title }}</a>
</h3>
{%- endif -%}
<div data-flair-product-badge data-product-id={{ product.id }}></div>

And add line 9.

On older versions edit snippets/product-info.liquid

On collection pages

Edit snippets/product-item.liquid:

<a href="{{ filtered_variant.url | default: product.url }}" class="product-item__title text--strong link">{{ product.title }}</a>
<div data-flair-product-badge data-product-id={{ product.id }}></div>

And add line 2.

Install Flair banners

Edit layout/theme.liquid:

<body>
<div data-flair-banner></div>

And add line 2.

Additional Resources