Integration
Shopify
Installation

Flex Shopify Payments App Installation

Follow the steps below to set up your Flex account and configure your Shopify store.

Create an account with Flex

Navigate to the registration page (opens in a new tab) to create an account. If you already have an account, you can log in here (opens in a new tab).

Add Payout Information

Click the prompt at the top of the screen to add your payout information.

⚠️

If you do not have a Stripe account, you can create one here (opens in a new tab).

Install Flex Shopify Payments App

Navigate to the Flex Shopify Payments App Listing Page (opens in a new tab) and select Install. After selecting install, you will be prompted to the configuration page.

Install Pixel

The pixel is used to retrieve cart information throughout the customer's checkout journey. With this cart information, Flex is able to determine which products are HSA/FSA eligible and which are not.

Sync Products & Assign Eligibility

Flex will sync the products from your Shopify Store and create a corresponding product in Flex. We will also configure a webhook that will listen for any product changes on your Shopify store.

Depending on the number of products in your store, this process may take a few minutes.

Once synced, you can assign HSA/FSA eligibility to your products. Depending on the product, it may qualify as HSA/FSA eligible by being on the Eligible Product List, requiring a prescription, or by issuing a Letter of Medical Necessity.

  • If a product is eligible via the Eligible Product List, enter the GTIN corresponding to that product.
  • If a product is eligible via Letter of Medical Necessity, you can assign it a corresponding visit type that was provided by your Flex representative.
  • If a product is eligible via Prescription, you can select the eligibility type as Prescription or Vision.

Confirm Flex Checkout Functionality

Navigate to Settings and select Customer Events to verify the Flex Pixel status is 'Connected'.

Verify the checkout is working by adding a product to the cart and selecting 'Pay with HSA/FSA' at checkout. You should be redirected to the Flex Checkout to enter payment details.

Confirm Flex Payment Functionality

Navigate to Settings and select Payments to verify that "Pay with Flex" is set to 'Active'.

If you do not see "Pay with Flex," select Add payment method and search for Flex.

You're all set!

You have successfully installed the Flex Shopify Payments App and enabled Flex Shopify Payments on your store.

Shopify Theme App Extension

Now that you've installed the Flex Shopify App, you need to add badges to your HSA/FSA eligible products to inform customers which items can be purchased with their HSA/FSA. Follow our guide below to add the Flex badge to your eligible product pages.

Sign Into Your Shopify Admin

Log in to your Shopify admin page and select Online Store.

Select Your Live Theme

From the Themes tab, select Customize to access your live theme.

Select Your Product Template

⚠️

In this example, the Flex Test Store has only one 'Default product' template. This means any changes made to this template will affect all products. Ensure you only add HSA/FSA badges to eligible products. You can learn more about Shopify templates here (opens in a new tab).

From the dropdown menu at the top of the page, select Products and then choose the product template you wish to edit.

Add a New Block or Section

In the sidebar, select Add block (or Add section) at your desired location.

Select Apps

You'll need to select Apps to see the Flex options. Select one of the Flex options to add it to your page.

Adjust Your HSA/FSA Badge

For best results, we recommend putting the badge just below the price, similar to where you may see a 'Buy Now, Pay Later Option'. With the badge selected, you can also adjust the color mode, alignment, and size in the right sidebar.

Final Result

Once completed, the Flex badge should be visible on the eligible product pages you selected.

Video Tutorial