How to integrate Razorpay gateway into your website – Simple Method

Here is the best solution to add Razorpay to your website. Razorpay is one of my personal favorite payment gateway which I used for the last couple of years.

Go to the Razorpay website and log in. and visit this link https://dashboard.razorpay.com/app/keys     to get the API key. create one if you haven’t already and copy the secret keep it somewhere safe.

If you created an API key already regenerate the secret and keep it.

<button id="rzp-button1">Pay</button>
<script src="https://checkout.razorpay.com/v1/checkout.js"></script>
<script>
var options = {
    "key": "YOUR_KEY_ID", // Enter the Key Secret generated from the Dashboard
    "amount": "50000", // which means 500 :  Amount is in currency subunits. Default currency is INR. Hence, 50000 refers to 50000 paise
    "currency": "INR",
    "name": "Acme Corp",
    "description": "Test Transaction",
    "image": "https://example.com/your_logo",
    "order_id": "order_9A33XWu170gUtm",     //This is a sample Order ID. Pass the `id` obtained in the response of Step 1
    "handler": function (response){
        alert(response.razorpay_payment_id);
        alert(response.razorpay_order_id);
        alert(response.razorpay_signature)
    },
    "prefill": {
        "name": "Ajith Jojo",
        "email": "[email protected]",
        "contact": "9999999999"
    },
    "notes": {
        "address": "Razorpay Corporate Office"
    },
    "theme": {
        "color": "#3399cc"
    }
};
var rzp1 = new Razorpay(options);
rzp1.on('payment.failed', function (response){
        alert(response.error.code);
        alert(response.error.description);
        alert(response.error.source);
        alert(response.error.step);
        alert(response.error.reason);
        alert(response.error.metadata.order_id);
        alert(response.error.metadata.payment_id);
});
document.getElementById('rzp-button1').onclick = function(e){
    rzp1.open();
    e.preventDefault();
}
</script>

Add your API secret Here  "key": "YOUR_KEY_ID"

Change customer name and address

Also, take care of the amount. here 50000 (50000 paise) means INR  500.00

That’s all .. it will work perfectly .. try it .. let me know if you have any issues