PayPal Credit

Introduction

Buy now, pay later with PayPal Credit. PayPal Credit is like a credit card that customers can use for purchases on your store. It takes minutes to apply, and if they're approved, they'll have a credit limit assigned to their PayPal account right away.

Settings

Settings related to the PayPal Credit payment method can be found by navigating to the Store > Settings > Payment Providers section.

🚧

Please be aware that PayPal and PayPal Credit payment methods share username, password and signature live and test credentials.

Basket Page

❗️

The PayPal Credit implementation differs significantly from the classic PayPal integration.

One of the main differences is that instead of redirecting users to the custom handling page e.g. /basket/paypal-express from the basket/checkout, an AJAX request should be triggered.

📘

New JavaScript files can be added to the basket template, following the below example:

{include file="\_includes/header.tpl.html" page\_js\_template="basket-paypal-credit"}

Payment flow:

1. Customer enters basket page.
2. If the PayPal Credit payment method is enabled, and the basket contents qualifies for this payment method, the {$paypal_credit} smarty variable will contain a value of "true".
3. Any change of a baskets content should either trigger a page refresh or download new basket details via the /ajax/Ajax_Basket/getBasketDetails AJAX call. A new variable called "paypal_credit_allowed" will contain a boolean value of "true" where PayPal Credit is enabled, and the current basket content qualifies for this payment method, otherwise it will contain "false".

$.get('/ajax/Ajax_Basket/getBasketDetails', params, function (responseJson) {
            if (!responseJson.paypal_credit_allowed) {
                $('.paypal-credit-checkout-button').parent().hide().prev('.basket_buttons').hide();
            } else {
                $('.paypal-credit-checkout-button').parent().show().prev('.basket_buttons').show();
            }
    }, 'json');

4. Once a customer would like to proceed with a PayPal Credit payment, an AJAX call should be made to /ajax/Ajax_Basket/doPayPalCreditCheckout

$(function(){
    $('.paypal-credit-checkout-button').click(function(){
        $.get('/ajax/Ajax_Basket/doPayPalCreditCheckout', {}, function (responseJson) {
            if (responseJson.url.length > 0) {
                window.location.replace(responseJson.url);
            }
        });
    });
});

5. On the successful AJAX request, a JSON response will contain a "url", which should be used for user redirection.

Below, we've included an example implementation of the PayPal Credit payment method, for use inside the basket template. Please note that further to the below solution, always include a PayPal Credit payment method in HTML, in case background AJAX calls become unavailable.

<span class="basket_buttons" {if !isset($paypal_credit) OR $paypal_credit neq true}style="display:none;"{/if}>
	{site_text page="Basket" part="Text: or"}
</span>
<span class="basket_buttons" {if !isset($paypal_credit) OR $paypal_credit neq true}style="display:none;"{/if}>
	<a class="paypal-credit-checkout-button">
		<img src="/templates/{$templates_dir}/_images/basket/ppcredit-logo-medium.png" width="174" height="32" {site_text page="Basket" part="Image Alt: Pay Using PayPal Credit" type="alt"}/>
	</a>
</span>

Checkout Page

🚧

A new payment_type value, which should be used for PayPal Credit, has been created as "paypal_credit".

Payment flow:

1. User enters checkout page.
2. If PayPal Credit is enabled and basket qualifies for this payment method, the {$paypal_credit} smarty variable will contain value of "true", otherwise "false". The value of {$totalPaymentOptions} is also incremented by one.
3. On successful checkout, the user will get redirected straight to PayPal, otherwise the user will be returned to checkout page.

Please see below, an example of a PayPal Credit implementation for the checkout page.

{if isset($paypal_credit) AND $paypal_credit eq true}
<p>
<label class="checkout_label_radio" for="paypal_credit">{site_text page="Checkout" part="Label: PayPal Credit"}</label>
<input type="radio" class="radio" name="payment_type" id="paypal_credit" value="paypal_credit" {$page.payment_paypal_credit} />
</p>
{/if}

Return Page

Once a user finishes the payment flow on the PayPal side, they will be redirected to "/checkout/paypal-credit-complete".

In case of payment failure a "checkout/failed-order.tpl.html" template will be rendered, otherwise the user will be redirected to "/checkout/order-complete" page.

New PayPal Credit transaction data can be accessed via the {$transaction_info.additional_data} smarty variable.

📘

PayPal Credit errors can be accessed via the {$errors} smarty variable inside "checkout/failed-order.tpl.html"

Please see below, an example usage of additional transaction data inside the "checkout/order-complete-page.tpl.html" template:

        {if $transaction_info.additional_data}
            <h2>{site_text page="Checkout Order Complete" part="Label: Transaction Additional Fields Data"}</h2>
            <ul>
                {foreach from = $transaction_info.additional_data item="additional_data"}
                <li>{$additional_data.field_name}: {$additional_data.field_value}</li>
                {/foreach}
            </ul>
        {/if}

📘

Looking for information on PayPal Credit in relation to our API?

Please see the Aurora API: PayPal Credit article for more information.

📘

Looking for information on PayPal Credit in relation to Site Text?

Information regarding the use of Site Text for by PayPal Credit can be found in Site Text: PayPal.

Testing in the Live Environment

Please note that testing of the PayPal credit integration, in both the test and live environment, is strongly recommend - as each implementation will differ slightly.