Upgrading educational modals

Overview

Our latest version of Educational Modals (v4) contains a powerful new tool - Affirm Prequalification.  Prequalification allows your customers to discover how much they qualify to spend with Affirm on your site early on in their shopping process. This simple tool lets your customers shop with confidence. Shoppers who leveraged Prequalification during the feature beta program spent an average of up to 30% more per transaction - on top of the existing Affirm AOV lift. 

Simulated Affirm checkout screens on mobile devices.

Upgrading

The first step in the upgrade process is to determine what kind of Affirm Educational Modals are present on your site today. There are several methods of determining your current promos version, described below. If you are unsure which version you are using, and do not have developer resources available to assist in that determination, you can reach out to your Affirm technical contact.

How to tell which version of Affirm Educational Modals you are using

The required code changes will depend on what version of Educational Modals is currently on your site. We can deduce which version is on your site by inspecting code, knowing when you integrated, or by looking at the type of messaging on your site today.

Determine current Affirm Promos version by:

  • Inspecting your code
  • Integration date

Inspecting Code

1. Find a product page where Affirm 'Starting at $x a month' messaging is displayed.
2. Use the Developer Tools (Command + Option + i).
3. Go to the 'Elements' tab to see the page's Document Object Modal (DOM).
4. Press (Command + F) with your cursor clicked into the DOM element tree.
5. Search for learn-more.
6. Search for affirm-as-low-as.
7. Search for data-modal-id.

📘

Previous Version Details

  • If you find an element resembling: <a id="learn-more"..>, you are likely using Legacy Promos (v1).
  • If you find an element resembling: <a class="affirm-as-low-as"...>, you are likely using Promos v2 or v3.
  • If you find an element resembling: <a class="affirm-product-modal" data-modal-id="AB1ZXOKW..."...>, you are likely using Promos v2.

Integration Dates

  • Before October 2016
    • Legacy promos (v1) if an upgrade hasn't been done since.
  • Between October 2016 and June 2017
    • Promos v2
  • After June 2017
    • Promos v3

Upgrading to Affirm Educational Modals v4

We have specific documentation for upgrading your Promos integration, depending on your current version. If in doubt, you can always refer to our main Affirm Promos integration documentation on how to do the promos integration from a clean slate.