Popular Searches:
Accept Payment

Inline Payment

Here are some cards that work on BudPay's test environment.

Inline (Popup)

BudPay Popup provides a simple and convenient payment flow for web. It can be integrated in five easy steps, making it the easiest way to start accepting payments.


                                        <form id="paymentForm">
                                            <input class="form-control" type="text" id="email" name="email" placeholder="E-mail Address" required>
                                            <input class="form-control" type="text" id="first_name" name="first_name" placeholder="First Name">
                                            <input class="form-control" type="text" id="last_name" name="last_name" placeholder="Last Name">
                                            <input class="form-control" type="text" id="phone" name="last_name" placeholder="Phone">
                                            <input class="form-control" type="tel" id="amount" name="amount" placeholder="Amount" required>
                                            <div class="form-button">
                                                <button type="submit" onclick="payWithBudPay()" class="ibtn ibtn-full">Pay</button>
                                        <script src="https://inlinepay.budpay.com/budpay-inline-custom.js"></script>


                                            const paymentForm = document.getElementById('paymentForm');
                                            paymentForm.addEventListener("submit", payWithBudPay, false);

                                            function payWithBudPay(e) {
                                                    key: 'pk_test_xolsnu5dpqpia2a7a8iftygugzyluz2qffkhlid', // Replace with your public key
                                                    email: document.getElementById('email').value,
                                                    amount: document.getElementById('amount').value,
                                                    first_name: document.getElementById('first_name').value,
                                                    last_name: document.getElementById('last_name').value,
                                                    currency: 'NGN', // Use GHS for Ghana Cedis or USD for US Dollars
                                                    reference: '' + Math.floor((Math.random() * 100000000000) + 1) + new Date().getSeconds() + new Date().getMilliseconds(), // generates a pseudo-unique reference. Please replace with a reference you generated. or remove the line entirely so our API will generate one for you
                                                    callback: function(response) {
                                                    //this happens after the payment is completed successfully
                                                    var reference = response.reference;
                                                    alert('Payment complete! Reference: ' + reference + ', Status: ' + response.status);
                                                    onClose: function (response) {
                                                    alert('Transaction was not completed, window closed.');


To initialize the transaction, you'll need to pass information such as email, first name, last name amount, transaction reference, etc. Email and amount are required. You can also pass any other additional information such as logo_url and callback_url object field. Here is the full list of parameters you can pass:

Param Type Required? Decription
key string Yes Your public key from BudPay. Use test key for test mode and live key for live mode
email string Yes Customer Email address
amount string Yes Amount to pay
first_name string No Customer First Name
last_name string No Customer Last Name
currency string Yes Currency charge should be performed in.
reference string No Unique case sensitive transaction reference
logo_url string No Payment popup custom logo url
callback_url string No Custom callback url, if not set in your account settings or want a unique callback url for the payment