> ## Documentation Index
> Fetch the complete documentation index at: https://docs.withflex.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Shopify Marketing App

> Promote HSA/FSA eligibility on your Shopify store with the Flex Marketing App.

Flex makes it easy to promote HSA/FSA eligibility on your Shopify store. With the [Flex Marketing App](https://apps.shopify.com/flex-marketing), you can add badges to your product pages — helping customers understand how to pay with their HSA/FSA cards. These badges drive trust, boost purchase intent, and reinforce that your business supports flexible, tax-advantaged spending.

## Why use the Flex Marketing App?

Merchants who actively promote HSA/FSA eligibility using the Flex badge consistently see stronger performance compared to those who don't. The app is built to do more than just display eligibility — it enhances the full customer journey.

### Why it matters

**Increase awareness**\
Catch customer attention earlier in the journey with visible, trustworthy badges.

**Educate customers**\
The Flex badge includes built-in education (via hover modal) that guides customers through using their HSA/FSA funds.

**Boost conversion rates**\
When customers know they can use pre-tax funds, they're more likely to complete a purchase.

**Improve customer experience**\
Clear, consistent messaging reduces confusion and supports inquiries around eligibility.

**Stay compliant without extra effort**\
Choose your product type (Always Eligible or Dual Use) to keep messaging accurate and IRS-aligned.

**Save time with easy setup**\
The app integrates directly into the Shopify theme editor, with no custom code required.

## Getting started

To use the badge, start by installing the Flex Marketing App:

1. Go to the [Flex Marketing App](https://apps.shopify.com/flex-marketing) on the Shopify App Store.
2. Click **Add app**, then follow the prompts to install it in your store.

Once installed, you'll be able to customize and add the Flex badge directly within your Shopify theme editor.

## Add the Flex badge to product pages

<div className="mx-auto w-full rounded-xl overflow-hidden relative mt-6 mb-6" style={{ paddingTop: '56.25%' }}>
  <iframe className="absolute top-0 left-0 w-full h-full" src="https://www.youtube.com/embed/Ol2J07tk7gc" title="YouTube video player" frameBorder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen />
</div>

<Steps titleSize="h3">
  <Step title="Open your Shopify Admin">
    Navigate to **Online Store > Themes** and click **Customize** on your live theme.
  </Step>

  <Step title="Choose a Product Template">
    Use the top dropdown to select **Products**, then choose the template you'd like to edit (e.g., *Default product*).

    <Warning>
      If you're using a shared template across all products, only add the badge to eligible products. If needed, create separate templates for eligible and non-eligible SKUs.
    </Warning>
  </Step>

  <Step title="Add the Flex Badge Block">
    In the sidebar, click **Add block** and select the **Flex badge** under the *Apps* section. Drag it to your preferred location — we recommend placing it just below the price.
  </Step>

  <Step title="Set Product Type: Always Eligible or Dual Use (LOMN)">
    For each badge, select the product type:

    * **Always Eligible** – no documentation required
    * **Dual Use (LOMN)** – customer must complete a telehealth consultation

    This controls the badge label and behavior to ensure compliance and transparency.
  </Step>

  <Step title="Customize the Badge Appearance">
    Adjust the size, alignment, and color mode (light/dark) in the right-hand sidebar.
  </Step>

  <Step title="Educate Customers with Hover Modal">
    For Dual Use products, the badge includes an optional hover modal that explains the HSA/FSA process — including how customers qualify and what to expect at checkout.
  </Step>

  <Step title="Preview and Save">
    Once configured, preview the product page and click **Save**. The badge will now appear on eligible product pages.
  </Step>
</Steps>

## Not on Shopify?

For non-Shopify merchants, make sure to explore the rest of the Flex Merchant Success resources to implement HSA/FSA marketing solutions on your site.