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

 

Post Your Questions on our forum

Post a question on Forum

Ajith Jojo Joseph

Self taught, dedicated young entrepreneur with many licensed products under his sleeve. Passionate about technology, business and excellence in general.

Share with your friends:

Leave a Reply

Your email address will not be published.

New Open Source CRM for project Management and Invoicing

I’m excited to announce the launch of my new open source project: Gmax CRM. an invoicing and project management tool […]

December 31, 2022

Post View Counts WordPress plugin (Documentation)

The Post View Counts plugin is a simple tool for tracking and displaying the number of views for each post […]

December 30, 2022

How to create Laravel Flash Messages

Laravel flash messages are a convenient way to display one-time notifications to the user after a form submission or other […]

December 22, 2022

How to make Custom Artisan Command in Laravel

Custom Artisan commands are a useful feature of Laravel that allow you to define your own command-line commands for tasks […]

December 22, 2022

Digital Marketing Toolkit

Get Free Access to Digital Marketing Toolkit. You can use all our tools without any limits

Get Free Access Now