sections

Stripe Integration Tutorial Using PHP – Credit Card Payment Processing


in this video you will learn how to process credit card payments using stripe API and also we are going to create a pricing page where you list are multiple products and are going to sell all of them dynamically so stay with me hey what's up guys Senaid here from coding passive income, the place where I help others to become a web developer much easy and faster than they will do it on day own so if that's something that interests you consider subscribing so before we actually start reading any code I would like to explain it the basics that you need to understand for this tutorial so that it's easier for you to understand everything so what we're going to do is we will first create one pricing page so let's assume this is our pricing page and here we will use cards from boost up for to display the price of the product title and please some filters and then PayPal and since as I said in introduction that you are going to sell multiple products we will have a lot of these here so it will be dynamically so really the number of these is not limited 20 so what will happen is we will create it so that when someone click on this pay now button the small pop-up will come here and then the wish that will need to enter his credit card information struck API will verified and if everything is OK he will make a post to one page so let's say here and this page will be our actually stripe API dot PHP file so in this file all that we need to do is to verify once again here get the informations and then actually make a charge from that credit card and after we did that if everything is okay from here it's just optional what you are going to do you can just store information to some database or you can maybe send an email or whatever you would like to but the critical piece here is to understand how to create an emic with the pricing page and also how to connect everything with stripe API so let me so how to ride a goat so now I'm here at my PHP store and I have created a new project stripe payments and also I have created an MPO pricing dot PHP file so first thing that I'm going to do is I will just create a normal HTML document nothing special and I will specify the title as pricing page okay so since we are going to design this page in bootstrap for we are going to download the latest version so go to get boo SATCOM download and then I will just copy the Bulls obsidian link or maybe if you want I can show you how to download the source files so let's I will compile it okay and I will tell them all to this project folder okay so I will extract everything delete this archive and then as you can see here we have CSS files and we have J s Fox but at the moment we are just going to need CSS box so here I will say link relationship style sheet and then have I'll say boo subs folder CSS and then boost up mean dot CSS ok so now first thing we need to define in boosts up is of course container so maybe let me tell something a little bit ok so I will one container and in this container I'm going to create one row and now in this row I will just create a car so I will say class car and in this card you are going to have card heater okay and then I want us to look at this and say card body ok and in this card body I'm going to have one car title ok so this will be the title of our product so let's see product number one okay and then down below we will have one list so I'll see okay and then in this list they'll have different least group items so this will be quite future one so let me just duplicate this couple of times okay and that's it so here in the heater I'm just going to say that you are going to have one let's say age to class will be let's say price and then here we will have some price okay so all of this we are going to create dynamically but for now we are just going to create one product to sell just create a design so let's check this so this is how it looks like at the moment of course we can make it a little bit nicer so here I will create some style okay we cannot use external file but let's add moment or just use inline here so first I want to move container down for let's say hundred pixels the next thing that I love is to set for the card let's save it to 300 pixels okay so maybe the cool will be if we create some horror effect for the horror on the card so let's say they will say transform it will scale for 15 or maybe 0-5 just a little bit and then transition let's say easy okay and then I will just delete this time okay so let's see what we have so far so refresh smooth ah it's bigger and when I go or with the mouse it looks nice okay so next thing is I would love to remove this border in the list here so let's say that at least group item we will set border to the zero pixels and maybe add padding for five pixels so let's see okay so this is looking I would be better so maybe here for this card body which we can say text to the center okay and then this car title maybe we can make it alpha bit bigger so let's say 801 okay okay and now I would love just to do this price to make what it looks at the bit nicer so maybe for pricing or maybe it was better if we said price price I will say that font size will be let's say set to pixels something really big but then here for this dollar sign I've just to use pen and I will create class let's say currency okay I'll see dollar okay and now for the currency I'm going to set position to the relative and then maybe let's say font size will be something really small in comparison with the price so let's say 25 pixels and then probably we will need to move this up so let's I'm not sure how big it needs to be okay so let's check this click on the currency and then let's try to say – let's say 30 pixels okay so we are pretty close so maybe let's do something like this okay so that you want pick so and then let's just set it to the center okay so now this is the basic design for our product so of course we should move this card to separate column let's say md4 so just copy here and then now if we want to duplicate all we need to do is to just copy paste like we have different products and here's the result so this is three different products and that is what you are going to create and basic we are able to have like hundred products or whatever number you would love okay so I'll just undo this and that's it so we have this one product and now let's create this dynamically so I will just create a new file so let's say new PHP file and I will name it products okay and basically what I want to achieve is to have one associative array so I'll name it products equal array okay and now in this product we are going to have different so let's say each of them will have different ID so let's say this will be product number one okay that's his ID and for that product I'm going to have some basic informations like let's say title my amazing product number one then we are going to have price okay so let's say the price for this one will be so as you can see I want say that price x6 $67 but I'm adding two zeros because it's like we are multiplied by 100 and that is how it needs to be for stripe API okay so I will just do it like this and then I will just say he filters and filters can be an array again so let's say we say he future one future – and then future three okay so that is the product one and we can duplicate it and say we will have another one so this will be product number two the price will be let's say $147 okay and then we will have another one let's say $37 product number three okay so let's see how we are going to display now all those different products on the pricing page so as you can see we need to duplicate this rose so here before it I will say HP and here I will say so first of course we need to encode it at the top products so I'll say products PHP and then here I will say that for each products as let's say product ad and then the ashramites product attributes okay we are going to echo this so first I want to decide when we are going to echo this new row when we want to create new row so I will have one variable here let's see column number equal one so first one is 1 so C if call number equal 1 we will say echo and then get this okay and then down below we will go in say like if call number equal 3 okay we need to close this ok and we need to rest this column number to the 0 else you'll see call number plus plus we are just increasing ok so we can delete one of these ok and now we just need to print this part so copy ok and I will say here account and just paste this here we go okay so now from our products we need to get title price and futures so first one here is price so I'll just get it by attributes price okay and we need to divide by 100 to get the real price okay after that we need to get the name of the product so I'll see attributes title okay and now as you can see here we have the list of all the futures so we should use another for each okay so here I will cause the economy that we have opened another one just make sure nothing is wrong and then here I will say for each attributes futures as future I'm just going to echo here that future like this okay so here we are basically going through this array and going through all the filters that we have listed here okay so let's see what we have got right now do we have any mistake so pretty much it is looking good we have sixty seven dollars one hundred forty seven thirty seven okay and then we have this title quite big and then all the filters okay so maybe we should change this to page two to make up to be smaller so it looks a little bit nicer and now let's test what will happen if we add another product so I will duplicate let's say product number four now let's say the price will be two hundred seven okay and then let's say future three two one just make a little bit of difference so refresh and now you can see that it has been added down below so maybe we can just add here like break so let's see it's looking good so as many times as we add a new product it will be listed on the pricing page but let's delete it for now we have only three at the moment okay so now that is all that's happening with the basic design of pricing page and now the next thing that we need to do is to actually integrate the stripe API to this pricing page so in my previous tutorials I usually never go to the documentation and start explaining all the things that you need to read or know and I will just go straight away to the code but I have noticed that the pattern that many of you guys don't understand quite a lot of the things and you just wonder from where I have got some parts of the code and for that reason I decide that this time we will go together through the document documentation and that I'm going to show you how you can learn and do something if anything change in the future with this tutorial okay so first thing that I want to go that you go is to the dogs check out and or maybe before that does make sure that you log into their poor dot stripe dot-com because if you are logged in into the dashboard like I am at the moment in the dogs they will just use all the publishable and secret keys from your account which is amazing you don't need to do that okay so first we need to add paper sorry stripe button to this pricing page so here you have clear explanation of what is happening and what is workflow for the customer and what's happening in the background you can read that on your own are not going through this I'm just going to focus on things that do matter and this is that all we need to do is to actually copy this code okay and then go to space and into the our pricing page and as you can see if we analyze this you can see that this is basically a four we need to have some action and send all the details to our PHP code we will use stripe API and then here as you can see we have data key and this is as you can see my test publisher key and if you are not logged in you won't see anything here so that's why it's important that you are all cool so hey guys already logged in and data amount is the price and then data name the name of your product and other things you can leave as is so let's do this so I will copy this okay and then I'll go to the pricing and then here below close a list I will make maybe let's say two breaks and then paste this code okay like this and now here I will modify action and let's say we will have one file stripe ipn dot PHP okay and that file you are going to pass ID of the product okay so we will append and it is product ID that you are getting here in the for each loop okay suppress ID the next thing is data amount okay and we have that in the attributes price okay now we need the title here cell C attributes title and pretty much that's it so let's see what we have got so far so if we refresh you can see now that we have for each card for each product different button so maybe let's remove one brake too much like this okay cool so if we click on this one you can see that it tries to charge 67 dollars now if we do check this one it's hot 147 and this one is 37 so as you can see this is just how dynamically everything is working so far okay cool now the next thing that we need to do is to create this stripe IP n dot PHP file so I'll go to the project go to the noon PHP file then stripe IP n okay and also while I'm here I will does look like this and create it like config dot PHP and in this part we are just going to write everything related to the initialization of stripe APM okay so now once we have created this on the client side we will need also the server-side code as you can see here so just click there and here is explanation on how you can write the PHP code and here you have comments on every step what is happening so we are setting API key then we are getting the details from our form it is here and then we are creating a chart okay so I will just copy this and paste in the stripe ap and file but now as you can see here we have some red flags because we don't have this namespace and that means that we didn't initialize already the stripe appian so maybe let's search like this github stripe API yes okay and I'm just going to download everything to the same folder and now I'm going to extract everything here okay and delete the archive so now once you have extracted in this folder you can see that we have all the different files and folders but actually all that you need is this init file and this then this library folder and if you open this we can see that it only requires all the files from the library folder okay so I will just select everything and exclude those two and then just do it okay so now in the config I'm going to require from the start folder init file and then maybe I'm just going to create one let's say strap stripe details equal array and then I will say here since we need to have one secret key and then publish a low key so I will say secret P okay and then we need to have publisher okay okay and that's it so the secret key for me at the moment is this one okay here and the publishable is this one here so I'll get it and included so that I will just call it from this variable those keys and then any time that I want to go alive all that I need to do is to just update the keys here and I'm ready to do it okay and then I will just copy this to my in it okay so does copy and comment – and then he are equal okay so here I'll do it like this okay and our API key is stripe details and then secret key okay and now on the pricing we need to go from stripe details of the shadow P and then here let's say I include config and in the config I will include products because we are going to need them in stripe AP and file – okay so let's check our page so what is the problem permission denied that's because of my server settings so let me just quickly modify this recursive and should be fine yeah okay so this part is looking good so now when we try to pay all the details will be sent to the stripe AP and Phi and I want to show you what you are going to get as you can see they have already written that we will get stripe token but also I want to see what other details we are going to get so I will say egg free and then say warden pause because I want to see everything and then I will hit exit so let's try this so let's say I will try to purchase this one so go baby the card my email let's say test live

com and then I will use this card so you can use this one you can find test cards on stripe documentation so this is the one that I want to use and then we need to use some expiration date just in the future so let's say like this some random and then pay 147 so good I'm rejected to stripe APN and now as you can see as an ID it's pass it as that we have walked product number two we have stripe token okay we have stripe doc and tart card and we have stripe email okay so maybe let's just do like this so we have token already here so I'll say email is post stripe email and then product ID is ID okay and that's it so now before we create a chart on the users account first I want to verify that in our products we actually have the product with this ID so I will say if not he said products product ID I will just let's say oh just read it person to them pricing the pH P okay X so let's try this so we have here product one product to product three it all looks good and if we refresh this it's all good it just says that we have problem with start talking an email okay and that's okay but let's now try to access product for and can see now I have been redirected to the pricing PHP because I'm trying to treat and now let's try to purchase this one with $67 next time you will just use to remember okay no 67 okay so now this part is looking good so guys if you get a problem like this as you can see the problem is that stripe is not able to destroy paper is not able to communicate with the stripe and as you can see here it is our setting certificate verify location Safa and most of the time the problem is because on our localhost we do not have SSL installed and basically for if even if you have live web server and for you to have an stripe API work properly you will need to have an SSL on your domain so the easy fix for you while you're working on localhost is just that you go here in the stripe APN and then just set SSL Certificates to the false okay and now this means that we are we for stripe API to work without SSL okay and after this let's just make a test for this I will hit refresh continue and what is the processing or such token so that's a king let's try again so let's out try to purchase this one okay okay of course the price will be different it won't be $67 for now because we didn't implement this part okay so this part here is looking good and if we go to our striped airport hit refresh we can see the new sale just a moment ago for $999 because that is what we are travelling here in the stripe Appian okay so first we can say that here if not visit this Product ID but before that we can say that if not is it was token or not is it this okay we are going to resurrect to them okay that's it okay so now here we need to just put all the details here so in order to get an amount we will get it from our products and then by product ID and after that we will get just the price currency is a key and not the description we will for our example just use the title of the product okay like this and that's it okay so let's see what will happen so I'll hit refresh continue okay now I am the pricing again because the token doesn't exist so I will now try to purchase this one we need again to insert all those details that's very boring sometimes okay some random number P 147 so good I'm sure what has happened right now so the truck is not here we have been redirected but why surprise fraud idea King and we said if not is it not talking about stripe dock so that is our mistake okay let's try again okay it looks good mom they'll hit refresh and now you can see that we have got another sale okay there are two successful payments so I'll go to the payment and now we can see that we had made the first one and then we have the second one as you can see here's an email amount USD and if we open everything is looking just the way it needs to be and now from here once we have made a chart we can decide what we want to do so from here you can send an email okay or you can store information to the database whatever it might be so of course for all of these you have clear explanation on my youtube channel and different video tutorials if you want to learn each of those I'm going to do it again so I will just heal this plane so message echo success you have been chartered and then it will does display the price so ICQ dollars okay and that's it and let's make it this once again so we can't use this token again okay let's try let's try out to purchase this one okay and now if we check our webpage here payments and the payment is right here okay guys so pretty much that's it I hope that you have enjoyed this video it's quite a long video but I really wanted to go into the details and if you do enjoy it please like it and shave your friends and of course if you have any questions please ask in the comments below take care

Source: Youtube

Stripe Integration Tutorial Using PHP – Credit Card Payment Processing

Choose A Format
Personality quiz
Series of questions that intends to reveal something about the personality
Trivia quiz
Series of questions with right and wrong answers that intends to check knowledge
Poll
Voting to make decisions or determine opinions
Story
Formatted Text with Embeds and Visuals
List
The Classic Internet Listicles
Countdown
The Classic Internet Countdowns
Open List
Submit your own item and vote up for the best submission
Ranked List
Upvote or downvote to decide the best list item
Meme
Upload your own images to make custom memes
Video
Youtube, Vimeo or Vine Embeds
Audio
Soundcloud or Mixcloud Embeds
Image
Photo or GIF
Gif
GIF format
%d bloggers like this: