HTML Reference for Promotional Messaging

Add an HTML element to your category, product, cart, and payment pages to display promotional messaging across your site. Explore the HTML reference for promotional messaging components.

Type

Data type

Value

Description

Class required

string

These classes determine the Affirm promotional messaging component to display.

affirm-as-low-as

Displays monthly payment messaging with educational product modal.

affirm-product-modal

Displays educational product modal.

data-amount\ required

integer

The product price amount passed to display loan price specific messaging. Value in USD cents (e.g. $100 = 10000).

  • *data-promo-id** optional

string

Calls a specific promotional messaging template and/or financing program.

data-page-type\ required

string

Identifies your promotional messaging so Affirm can apply the necessary customizations based on which page they are displayed.

homepage

Your site's homepage.

landing

A landing page that describes Affirm.

search

Your site's search results page.

category

Your site's category page.

product

A product description page.

cart

Your site's cart page.

payment

The payment selection page.

banner

A banner image (use for any promotional messaging triggered by your banner or image regardless of page location).

marketplace

The marketplace landing page.

data-affirm-type
optional

string

Sets the Affirm logo type. Default displays Affirm logo image.

text

Displays Affirm logo in plain text.

symbol

Displays Affirm logo as a symbol.

data-affirm-color
optional

string

Sets the Affirm logo color. Default displays the primary (indigo) Affirm logo.

black

Displays black color Affirm logo.

white

Displays white color Affirm logo.

data-category
optional

string

Identifies the product category associated with the messaging for analytics tracking (e.g., electronics, furniture).

data-brand
optional

string

Identifies the brand category associated with the messaging for analytics tracking (e.g., Samsung, Goodyear).

data-sku
optional

string

Identifies the SKU associated for promotional financing on select products only and analytics tracking(e.g., ABC123, SMSNG-50-TV).

data-learnmore-show
optional

string

Shows or suppresses the link to the modal.

false

Suppresses the link and hyperlinks the entire promo.

true

Shows the link.