How to show Flair on Gen 2 (legacy)

This guide covers adding Flair badges and banners to your Shopify theme using Gen 2 Liquid snippets.

Find the right file

Refer to the manual sections of these guides for details on finding the right file:

• Product pages - How to show Flair on product pages
• Collection pages - How to show Flair on collection, home, and search pages

Add badges

{% render "flair-product-badges" product: product %}

Snippet options

• product - the Shopify product variable. The variable name may change depending on your theme.
• flair_layout - (optional) The Flair badge layout name.

Using a layout

{% render "flair-product-badges" product: product, flair_layout: "my layout" %}

Add banners

{% render "flair-banners" %}

Snippet options

• flair_layout - (optional) The Flair banner layout name.

Using a layout

{% render "flair-banners" flair_layout: "my layout" %}

Reload Flair for dynamic content

Flair loads badges and banners automatically on page load. For content loaded dynamically (product recommendations, collection filters, AJAX carts), use the following functions to reload Flair on the page:

Reload badges

FlairApp.refreshProductBadges()

Reload banners

FlairApp.refreshBanners()