Paypal Buttons: How to create different most types of PayPal Buttons with HTML code

A Simple donate Button

Creating a simple donation button is easy. The first step is to use the basic paypal FORM code:

 
<form name="_xclick" action="https://www.paypal.com/cgi-bin/webscr" method="post">
	<input type="hidden" name="cmd" value="_donations">
	<input type="hidden" name="business" value="youremail@youremail.com">
	<input type="hidden" name="item_name" value="Donate to my cause">
	<input type="hidden" name="currency_code" value="USD">
	<input type="image" src="http://www.paypal.com/en_US/i/btn/btn_donate_LG.gif" border="0" name="submit" alt="Make payments with PayPal - it's fast, free and secure!">
</form>

That ends up looking like this:

The form is pretty straightforward with some required hidden fields. Let's go over them.

cmd

The cmd hidden input field tells paypal how to interpret the form. Different types of buttons require different types of CMD values.

business

This is your paypal account email address. It's a required field for all forms.

item_name

This optional field is the title that your item gets when the page switches over to paypal. It's very important to put something here to let your users know what they're buying or donating.

currency_code

If you're in the US, the value here should always be USD, otherwise, you can consult the paypal guide for your currency code

image

This is essentially a link to paypal's standard button, you can replace the link to one of your own buttons by putting in the correct SRC attribute.

Creating a Link

Sometimes, it's convenient to create a link to a donation instead of a button. In that case you can use a CURL instead of a form.

 
<a href="https://www.paypal.com/webscr?cmd=_donations&business=youremail@youremail.com&item_name=Donate&currency_code=USD">Donate</a>

That would look like this

Donate

If you analyze this and the previous bunch of code, you'll see that they are pretty similar. It's a standard CURL where the first part of the link is the name of the location of the page, followed by a ? question mark and name=value pairs separated by an ampersand (&).

If you have the code for the button, you can easily make your own links by analyzing this structure.

Buy Now Button

If you want users to be able to purchase an item, then the code is similar to the donation code with some notable differences.

 
<form name="_xclick" action="https://www.paypal.com/cgi-bin/webscr" method="post">
	<input type="hidden" name="cmd" value="_xclick">
	<input type="hidden" name="business" value="youremail@youremail.com">
	<input type="hidden" name="item_name" value="Buy This Swank Item">
	<input type="hidden" name="currency_code" value="USD">
	<input type="hidden" name="amount" value="15.00"> 
	<input type="hidden" name="return" value="http://planetoftheweb.com/admin/form-thanks.php"> 
	<input type="image" name="submit" border="0" src="https://www.paypal.com/en_US/i/btn/btn_buynow_LG.gif" alt="PayPal - The safer, easier way to pay online">  
</form>

That ends up looking like this:

First, you'll notice the cmd value has changed to _xclick. The SRC of the button is also different since it says something else now. We've also added a few fields that were not necessary for a donation.

amount

Normally, you don't tell people how much to donate, but with purchases, this becomes a required field.

return

When the user finishes purchasing the item, you can optionally provide a URL for paypal to send the user to when they've completed the purchase.

Subscribe Button

If you want people to purchase a subscription, the code changes somewhat. The business stays the same, and the cmd value changes.

 
<form action="https://www.paypal.com/cgi-bin/webscr" method="post">  
	<input type="hidden" name="business" value="youremail@youremail.com">  
	<input type="hidden" name="cmd" value="_xclick-subscriptions">  
 
	<!-- Identify the subscription. -->  
	<input type="hidden" name="item_name" value="Subscription Name">
	<input type="hidden" name="item_number" value="Subscription Item ID"> 
	<input type="hidden" name="currency_code" value="USD">
	<input type="hidden" name="a3" value="5.00">   <!-- Subscription Amount --> 
	<input type="hidden" name="p3" value="1">     <!-- Duration  1 --> 
	<input type="hidden" name="t3" value="M">    <!-- Frequency Month --> 
	<input type="image" name="submit" border="0" src="https://www.paypal.com/en_US/i/btn/btn_subscribe_LG.gif" alt="PayPal - The safer, easier way to pay online">
</form> 

That will look like this:

Obviously, subscriptions require a bunch of code that is different than other

item_number

When you offer a subscription, this field allows you to enter a unique ID to identify the specific subscription people are purchasing.

Subscriptions have three different frequency fields that you'll need to use:

a3

This field allows you to specify how much you'll charge for the subscription

p3

This let's you specify how often the subscriptions will be purchased for. Just a number, so if you want to specify that people will pay for this item on a monthly basis, you would put a "1" in this field

t3

The timeline of the frequency. So if you wanted to charge people every week for a subscription, you would put the value M here

Shopping Carts

Paypal also gives you the tools for creating shopping carts. This requires a bunch of different pieces of code for each function of the cart.

Add to Cart

Obviously, the first piece of code is the Add to Cart button.

 
<form method="post" action="https://www.paypal.com/cgi-bin/webscr">
	<input type="hidden" name="cmd" value="_cart">
	<input type="hidden" name="add" value="1"> 
	<input type="hidden" name="business" value="youremail@youremail.com">
	<input type="hidden" name="item_name" value="MyItem">
	<input type="hidden" name="item_number" value="123">
	<input type="hidden" name="amount" value="4.99">
	<input type="hidden" name="shipping" value=".50"> 
	<input type="hidden" name="handling" value="2.00 "> 
	<input type="hidden" name="currency_code" value="USD">
	<input type="image" src="http://images.paypal.com/en_US/i/btn/x-click-but22.gif" border="0" name="submit" width="87" height="23" alt="Make payments with PayPal - it's fast, free and secure!">
</form>

And it looks like this:

There's only a elements items we haven't seen before here.

add

This is just a hidden field to tell paypal you're adding this item...or at least one of these items.

shipping & handling

Although we haven't seen these before, these will make sense for some of your forms and not for others.

View Cart Button

When you're doing carts in your sites, you're going to need a button to let people take a look at all the stuff they have in their cart.

 
<form name="_xclick" target="paypal" action="https://www.paypal.com/us/cgi-bin/webscr" method="post">
	<input type="hidden" name="cmd" value="_cart">
	<input type="hidden" name="business" value="youremail@youremail.com">
	<input type="image" src="https://www.paypal.com/en_US/i/btn/view_cart_new.gif" border="0" name="submit" alt="Make payments with PayPal - it's fast, free and secure!">
	<input type="hidden" name="display" value="1">
</form>

looks like this:

It's interesting to note that the only difference between this and the previous code is the lack of a few fields. Otherwise, it's exactly as the previous call.

Useful Tools

These are a list of the most common paypal buttons and how to code them. For a complete list of paypal codes and what they do, check out the List of all Paypal variables.

If you don't really want to know a lot of HTML and don't care to customize your pages yourself, you can use their excellent Shopping Cart Button Factory to create any number of buttons.

blog comments powered by Disqus