Mobilia + Flair Shopify theme guide

By: Out of the Sandbox
We've put together this guide for setting up Flair in the Mobilia Shopify theme by Out of the Sandbox. 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

There are multiple files you may need to edit depending on your theme setup

Edit sections/product-template.liquid, sections/product-details-template.liquid or sections/product-description-bottom-template.liquid:

<h1 class="product_name" itemprop="name">{{ product.title }}</h1>
<div data-flair-product-badge data-product-id={{ product.id }}></div>

And add line 2.

On collection pages

There are multiple files you may need to edit depending on your theme setup

Edit snippets/product-thumbnail.liquid or snippets/product-info.liquid:

<span class="title" itemprop="name">{{ product.title }}</span>
<div data-flair-product-badge data-product-id={{ product.id }}></div>

And add line 2.

Install Flair banners

Edit sections/header.liquid:

<div data-flair-banner></div>
{% if section.settings.show_announcement_bar != blank %}

And add line 1.

Additional Resources