Today, laravelcode share with you how to integrate paypal payment gateway in php with sample code. currently many payment gateway in available in market, but i thinks paypal is most populer for make payment in online and integrate in most of website and even android application also.
In this tutorials we are make one simple add to cart with paypal payment ussing by simple html, css and php, simply follow this step and easaly integrate paypal in your php code.
[ADDCODE]
Create index.php:
In the first step create index.php file in your any blank folder and put into it following code.
we are using simple boostrap layout for pay with paypal and make simple add to cart design if you copy and past this following code and then run your index file your html output looking like that. show this screenshot.
<!DOCTYPE html>
<html>
<head>
<title>LaravelCode - Paypal Integration Demo In PHP</title>
<link rel="stylesheet" type="text/css" href="https://laravelcode.com/css/app.css">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<?php
// test url
$paypalUrl='https://www.sandbox.paypal.com/cgi-bin/webscr';
// live url
$paypalUrl='https://www.paypal.com/cgi-bin/webscr';
$paypalId='test-facilitator-1@gmail.com';
?>
<div id="app">
<nav class="navbar navbar-default navbar-static-top">
<div class="container">
<div class="navbar-header">
<!-- Collapsed Hamburger -->
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#app-navbar-collapse" aria-expanded="false">
<span class="sr-only">Toggle Navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!-- Branding Image -->
<a class="navbar-brand" href="https://laravelcode.com/">
LaravelCode Demo
</a>
</div>
<div class="collapse navbar-collapse" id="app-navbar-collapse">
<!-- Left Side Of Navbar -->
<ul class="nav navbar-nav">
</ul>
<!-- Right Side Of Navbar -->
<ul class="nav navbar-nav navbar-right">
</ul>
</div>
</div>
</nav>
<div class="container">
<div class="row">
<div class="col-md-12 col-md-offset-0">
<div class="panel panel-default">
<div class="panel-heading">Products List</div>
<div class="panel-body">
<div class="col-md-4">
<form action="<?php echo $paypalUrl; ?>" method="post" name="frmPayPal1">
<input type="hidden" name="business" value="<?php echo $paypalId; ?>">
<input type="hidden" name="cmd" value="_xclick">
<input type="hidden" name="item_name" value="It Solution Stuff">
<input type="hidden" name="item_number" value="2">
<input type="hidden" name="amount" value="84">
<input type="hidden" name="no_shipping" value="1">
<input type="hidden" name="currency_code" value="USD">
<input type="hidden" name="cancel_return" value="/cancel.php">
<input type="hidden" name="return" value="/success.php">
<figure class="snip1249">
<div class="image">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/331810/sample85.jpg" alt="sample85"/><i class="ion-ios-star-outline"></i>
</div>
<figcaption>
<h3>Time Piece</h3>
<p>I'm killing time while I wait for life to shower me with meaning.</p>
<div class="price">
<s>$99.00</s>$84.00
</div>
<button class="add-to-cart">Pay By Paypal</button>
</figcaption>
</figure>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="https://laravelcode.com/js/app.js"></script>
</body>
</html>
Create style.css:
Now, create style.css file for pay by paypal product layout, and put into it simple this css code.
/* Icon set - http://ionicons.com */
@import url(https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css);
@import url(https://fonts.googleapis.com/css?family=Raleway:400,500);
figure.snip1249 {
font-family: 'Raleway', Arial, sans-serif;
position: relative;
float: left;
overflow: hidden;
margin: 10px 1%;
/*min-width: 220px;*/
/*max-width: 310px;*/
/*width: 100%;*/
background: #1a1a1a;
color: #ffffff;
text-align: left;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 100%);
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 100%);
}
figure.snip1249 * {
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: all 0.35s ease-in-out;
transition: all 0.35s ease-in-out;
}
figure.snip1249 .image {
position: relative;
}
figure.snip1249 img {
max-width: 100%;
vertical-align: top;
}
figure.snip1249 i {
position: absolute;
top: 7px;
left: 12px;
font-size: 32px;
opacity: 0;
z-index: 2;
-webkit-transition-delay: 0;
transition-delay: 0;
}
figure.snip1249 h3 {
margin: 0;
font-weight: 500;
text-transform: uppercase;
}
figure.snip1249:before,
figure.snip1249:after {
width: 120px;
height: 120px;
position: absolute;
top: 0;
left: 0;
content: '';
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease;
z-index: 1;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.35) 100%);
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.35) 100%);
-webkit-transition-delay: 0.2s;
transition-delay: 0.2s;
}
figure.snip1249:before {
background-color: #20638f;
-webkit-transform: skew(-45deg) translateX(-150%);
transform: skew(-45deg) translateX(-150%);
border-right: 1px solid #20638f;
}
figure.snip1249:after {
background-color: #962d22;
-webkit-transform: skew(-45deg) translateX(-175%);
transform: skew(-45deg) translateX(-175%);
border-right: 1px solid #962d22;
}
figure.snip1249 figcaption {
padding: 25px 80px 25px 25px;
background-color: #ffffff;
color: #000000;
position: relative;
font-size: 0.9em;
}
figure.snip1249 figcaption p {
margin-bottom: 15px;
}
figure.snip1249 figcaption:before {
width: 150px;
height: 150px;
position: absolute;
bottom: 0;
right: 0;
content: '';
z-index: 1;
background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.35) 100%);
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.35) 100%);
background-color: #20638f;
-webkit-transform: skew(-45deg) translateX(50%);
transform: skew(-45deg) translateX(50%);
border-right: 1px solid #20638f;
}
figure.snip1249 .add-to-cart {
display: inline-block;
width: auto;
border: 2px solid #20638f;
padding: 0.4em 0.6em;
color: #20638f;
text-decoration: none;
font-weight: 800;
font-size: 0.9em;
text-transform: uppercase;
}
figure.snip1249 .add-to-cart:hover {
background-color: #20638f;
color: #ffffff;
}
figure.snip1249 .price {
position: absolute;
right: 0;
bottom: 0;
color: #ffffff;
z-index: 2;
text-transform: uppercase;
padding: 20px;
font-weight: 800;
font-size: 1.2em;
text-align: center;
}
figure.snip1249 .price s {
display: block;
font-size: 0.85em;
font-weight: 400;
opacity: 0.8;
}
figure.snip1249:hover i,
figure.snip1249.hover i {
opacity: 0.7;
-webkit-transition-delay: 0.3s;
transition-delay: 0.3s;
}
figure.snip1249:hover h3,
figure.snip1249.hover h3 {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1;
}
figure.snip1249:hover:before,
figure.snip1249.hover:before {
-webkit-transition-delay: 0s;
transition-delay: 0s;
-webkit-transform: skew(-45deg) translateX(-50%);
transform: skew(-45deg) translateX(-50%);
}
figure.snip1249:hover:after,
figure.snip1249.hover:after {
-webkit-transition-delay: 0.1s;
transition-delay: 0.1s;
-webkit-transform: skew(-45deg) translateX(-75%);
transform: skew(-45deg) translateX(-75%);
}
/* Demo purposes only */
body {
/*background-color: #212121;*/
}
Create success.php:
Now, create success.php file. if your paypal payment pay successfully then after payment user redirect on this file. you can manage here your database logic. like insert data in database and show success message to user.
$itemNo = $_REQUEST['item_number'];
$itemTransaction = $_REQUEST['tx']; // Paypal transaction ID
$itemPrice = $_REQUEST['amt']; // Paypal received amount
$itemCurrency = $_REQUEST['cc']; // Paypal received currency type
$price = '20.00';
$currency='USD';
if($itemPrice==$price && $itemCurrency==$currency)
{
echo "Payment Successful";
}
else
{
echo "Payment Failed";
}
Create cancel.php:
Last create one another file cancel.php for in-case paypal payment have some issue then user redirect on Cancel.php file after canceletion and here you can manage cancel message.
echo "Payment Canceled";
We are hope you like this tutorials, if any question regarding any query please post your question in our forums click on bellow link Laravelcode's Forums