How to integrate striped to collect reoccurring payments as well regular regular payments on your website?
This is for a wordpress website so before i dive in and show you how to do this all for free with stripe and in grading it integrating it using their code i’m going to go down the rabbit hole what i first started to do is finding different plugins that would work and so obviously i came and found this there’s seven stripe wordpress plugins 2020 it’s pre and paid most of them are all paid if you want to do reoccurring so there’s wp simple pro pl uh simple pay pro uh that’s about 99 wp pay for multiple payment gateway plug-in again 59 pay woocommerce stripe payment gateway again if used woocommerce i wouldn’t recommend it compared when you have a shopify out there in the marketplace 59 wp full stripe come in here 49 uh extended license all that renewable stripe payment terminal wordpress 21 uh striped green downloads uh that gets into 19. woocommerce strike payment gateway there’s no cost and that goes into woocommerce but typically there there is a cost when it it gets set up in there and then strike payments optimum stripe here free but anytime you upgrade it’s going to ask for the reoccurring payment plan so there’s all different things you can go into their their websites their download factions as strike payments the woocommerce one uh the stripe green downloads and they offer all great features and they’ll integrate on your website and you can set up tracking and yeah it might be a little more effective to be paid or you can just use what i’m going to show you here in a second was just using stripe to integrate it right and here’s the rest of them uh and feel free to use these uh i don’t get any affiliate commission uh any of that stuff and like i said they work and they’re they’re have some great things uh what i did do is we use uh elegant themes right for our wordpress dashboard so if you go into our wordpress page here so you can see here this is just a fairly blank canvas of a website where just working on and i want to show you so if we exit visual builder right now uh we’re gonna just discard and exit here go in here so if you notice when you scroll here and hit checkout
It’s going to go right into the checkout stripe payment page it’s going to pull it up and people can purchase the reoccurring payment. It’s that simple. So we’re going to add show you how to add a second one here so hit the back button. We’re gonna go into wherever this is we’re gonna hit enable visual builder.
Let this load for a second and then why that loans we’re going to actually go into creating a product and we already have one created but i’ll just show you walking through how simple it is so you’re in stripe you just click add payment put in the information you want in here upload the image add the description come to the pricing right come to pricing put in whatever you want. uh It’s going to require us to do this and then we can go into pricing come down here put in whatever we want is it reoccurring is it one time payment so reoccurring monthly weekly daily whatever you want to set uh you can put additional options price descriptions free trials and so forth and you just click save product so we have one in here.
So we’re going to click this once you have one created you can come down here you’re going to see these three lines here under pricing click that you’re going to hit get checkout code snippet so this is where you can create a success url so this is a once somebody pays they’re gonna land on this page and that’s where you put your tracking pixel for a purchase uh for a cost per acquisition through facebook through google or any other platforms obviously if the url is cancelled they go to this one you put the tracking on that and then you can run retargeting ads then what you’re going to do is come here and copy this code here so we’re going to copy this just click copy and then you’re going to come into your website so we’re going to recreate this for you guys we’re going to delete that so we’re going to be real simple here we’re going to just duplicate the duplicate this one and then here we don’t we come in here we click add a code snippet i really recommend elegant themes it’s a great theme and then we’re going to paste this code in here right so then we’re going to hit save let’s delete this one so it’s not confusing and there’s one little issue that i want to solve by adding one set of code so we’re going to exit visual builder. Here i want to show you what happens is so on this one you notice my mouse turns into a little clickable hand to do that but the original code is set where it’s not clickable right even though you can click on it and it will go to that page uh it just wasn’t good enough for me i want to make that code clickable so you come into the code here and this is actually the code loaded and you notice this yellow code here it has this cursor pointer you want to add that in the style function under the background padding right after the size 1em you’re going to see in here so come in here we’re going to have to go back to enable visual builder
So come in here we’re going to edit this code click the little wheel click the uh edit icon so we got to come in here on the button so notice radius font 1m so we paste that code in here so now it has that code it added that and cursor pointed and it finished with that so you got to make sure it’s exactly that code if you mess up one little thing it won’t work and then just hit the check mark come back in here hit save you can do this in any wordpress you don’t need elegant themes elegant themes just creates the wysiwyg that allows you to just put in like a code snippet or so forth uh come in here otherwise in wordpress you would go into edit that html find that code and put it in here so now notice with that little check pointer code so again it’s just this cursor pointer code here we add that in stripe so when we scroll over it looks like a more clickable button and you can change the color by adjusting all that code as well but we just really care about making it clickable like i said we click that button and then it goes to the checkout page the downside is we can’t put our tracking pixel on this because this is the checkout stripe url so that’s in there obviously if you’re in stripe and we’re able to add the the url in here that’d be great i’m not sure if you can the tracking pixels or any of that stuff but you can quickly add a tracking pixel um using google tag manager so if they click on this button butting button using the css then it would fire and add to cart and then obviously if they purchase they’d go to your thank you page that successful purchase url and that would file our purchase and that’s how you would track all your purchases or cancel purchases or people who add to cart for retargeting and so forth so it’s that simple how to integrate uh stripe on your website on your wordpress website like i said i really recommend elegant themes uh it’s a great platform it’s super inexpensive you can do so much with it with wordpress and design sites very quickly and effectively uh setting up stripe again is a quick integration you don’t need any of these plugins so hopefully this was really helpful please like and subscribe give us thumbs up uh set notifications on our channel we really appreciate it share it with other p people again this is how you integrate stripe with your wordpress website or any site for that matter that you can add that code to and all for free and integrate seamlessly without using plugins and so forth again thank you take care and wish you the best.
Recent Comments