Interface Guide for Merchants ============================= *LaterPay Purchase Button and Purchase Links* .. image:: /_static/img/buy_now_pay_later.png :align: center :width: 300px :alt: Buy Now, Pay Later button **LaterPay's mission is to make buying digital content as convenient as possible**. An important part of this is to provide a consistent user experience across all websites that use LaterPay. Here are a few guidelines to ensure purchasing with LaterPay is as easy as possible for your users. Most of the **guidelines are not mandatory**, but there are a few rules you should keep in mind. Required Elements ----------------- Please make sure our purchase button contains all required elements: A LaterPay purchase button or link must include (at minimum) * The **LaterPay Cart icon** * The **price** * The **currency** (as a currency sign (e.g. "$") or currency code (e.g. "USD")) * Price and currency are only mandatory if they aren't stated **very close** to the purchase button or link already .. image:: /_static/img/99cents_examples.png :width: 250px :alt: Button examples with dollar sign and USD Call-To-Action Text ------------------- Additionally, you may want to add call-to-action text in the purchase button or link. If you do, please make sure that the copy clearly reflects what the user can expect after clicking this purchase button or link. * *Read* Now for *$0.30*, Pay *Later* * *Watch* Now for *$0.99*, Pay *Later* * *Subscribe* Now for *$2.99/Month* * *Contribute* Now *$3.00*, Pay *Later* * *Donate* Now *$10.00* .. image:: /_static/img/contribute_now_pay_later.png :align: center :width: 400px :alt: Contribute Now $0.99, Pay Later button When you are referring to **Contributions**, **Donations**, or **Subscriptions**, please stick to the following scheme for your purchase button or link: +------------------------------+-------------------------+--------------------------+ | | | **Pay Later** | | **Pay Now** | | | | | | | | | | Your users don't have | | Your users have to pay | | | | to pay immediately | | immediately | +------------------------------+-------------------------+--------------------------+ | | **Donation** | | Donate Now $4.00, Pay | | Donate Now $4.00 | | | | | Later | | | | if you are a 501(c)(3) | | | | | registered non-profit | | | | | organization | | | +------------------------------+-------------------------+--------------------------+ | | **Contribution** | | Contribute Now $4.00, | | Contribute Now $4.00 | | | | | Pay Later | | | | if you don't sell content | | | | | in exchange for money but | | | | | are asking for a | | | | | contribution without | | | | | anything in return | | | +------------------------------+-------------------------+--------------------------+ | | **Subscription** | | *Pay Later* | | Subscribe Now for | | | | | *Subscriptions are* | | $4.00/Month | | | if a user is entering an | | *not yet available* | | | | auto-renewing subscription | | | | | contract | | | +------------------------------+-------------------------+--------------------------+ Shape ----- A LaterPay purchase button can have any shape as long as your users can recognize it as a **clickable element** and it **contains all the necessary** **information** (see above). We recommend a **rectangular** shape with a **corner radius of 3px**. Color and Contrast ------------------ You may choose the color of your LaterPay purchase button or link and its text color freely. Please make sure that both * The **contrast** between the **button's or link's background** and the **button or link** itself * And the **contrast** between the **button's background color** and its **text color** are `sufficiently high `_ (for more information about accessibility please `see here `_). .. image:: /_static/img/bad_and_good_contrast.png :width: 300px :alt: Examples of bad contrast and good contrast Resources --------- You can download the Laterpay cart logo for use on purchase buttons, from the "Assets" section at the bottom of our `Press Kit page `_.