How to Add Simple Pay Pal Buttons to Your Website
Simple buttons do not provide selectable options or a special instructions field.
Click on the images for a larger view.


Login to the Pay Pal Website:
Go to www.paypal.com and look for the login section. Your username should be an email address, followed by the password you selected when you signed up for Pay Pal. Make sure you select a difficult password that is not easily guessed. It is a good idea to have some combination of both letters and numbers.


Select the Merchant Services Tab:
Once you have successfully logged into your Pay Pal account, select the Merchant Services tab. The tab is located in the main navigation bar at the top of your screen.


Select Pay Pal Shopping Cart:
Click on the link named PayPal Shopping Cart. The image to the left should help you to locate it.


Create a "Button Template" using Variables:
In an effort to add the greatest number of "Add to Cart" buttons in the least amount of time, we are going to create Button Templates. Place the following values in the appropriate fields...

Item Name / Service: ITEM NAME
Item ID / Number: ITEM NUMBER
Price of Item / Service you want to sell: 1.00


Click on Create Button Now:
Once you have your variables in place, click on Create Button Now. More advanced users may want to create their own buttons. If you wish to experiment with this option, simply create a button called mybutton.jpg and upload it to your site. Once you are done, type the URL in the space provided. It should look like this...

http://www.[ your domain ]/file/image/mybutton.jpg


Locate your HTML Code:
The following page will contain two separate blocks of HTML Code. These blocks are highlighted in the image on your left. The first block is the code for your "Add to Cart" buttons. The second block of code is for your "View Cart" buttons. Each of these pieces of code will need to be copied to Notepad for future use.


Copy the "Add to Cart" HTML Code:
To copy the code, place your cursor anywhere inside the top block and click your mouse. Now, if you push Ctrl + A on your keyboard, the entire block of code should become highlighted. That is called a "Select All" function. Follow that with Ctrl + C, and the code will be copied to your computer's memory. Now we're ready to open Notepad.


Paste the Code into Notepad:
Open the Notepad program and paste the code to a new document. (NOTE: Notepad can usually be found by following this path... Start >> All Programs >> Accessories >> Notepad.) Once Notepad is open to a new document, click your mouse inside the document to set the cursor and then Ctrl + V on your keyboard. That will paste the HTML Code from your computer's memory into the document.

Click the ENTER key several times to skip down to document.
We're going to paste more code here in just a second...


Copy the "View Cart" HTML Code:
Again, place your cursor anywhere inside the lower block and click your mouse. Now, if you push Ctrl + A on your keyboard, the entire block of code should become highlighted. Follow that with Ctrl + C, and the code will be copied to your computer's memory. Now lets go back to our opened Notepad document.


Paste the Code into Notepad:
Return to the Notepad program and paste the code further down the page of the same document. Click your mouse inside the document to set the cursor and then Ctrl + V on your keyboard. That will paste the HTML Code from your computer's memory into the document.

This code is generally used only once per page whereas the "Add to Cart" code may be modified and used dozens of times per page.


Locate the Variables within the "Add to Cart" Code:
The image to the left will show you the location of the three variables within the "Add to Cart" HTML Code. These variables will be replace with the actual Name, Number, and Price of the item or service you wish to sell.


Replace the Variables with Real Product Information:
In this example, we have replaced the Item Name with "Large Blue Widget" and the Item Number with "LBW001". In addition, the price was changed from $1.00 to "$34.95". This is the information that will be submitted to PayPal.

Be very careful not to remove the quotes on either end of the information you change. HTML is very particular and if the quotes are removed, your buttons will not work properly!


Copy the Modified HTML Code from Notepad:
To copy the code, highlight the entire section with your mouse. Be careful to select ONLY the "Add to Cart" portion. The "View Cart" portion will be used later. Once the code is highlighted, follow push Ctrl + C, and the code will be copied to your computer's memory. Now we're ready to return to the website editor.


Locate and Open the Appropriate Content Type:
If you have not added the content for the item or service you intend to sell, you may want to reference the Clone Page help files. Building the content first, and THEN adding the PayPal buttons will greatly decrease the development time required to create your site.


Switch the Editor from Normal to Source Mode:
Once the editor is open, switch it from Normal Editing Mode to the Source Mode. This is done by simply clicking on the Source button. This button is located just to the left of the BOLD (B) button. The image on the left shows the button highlighted in blue. Once clicked, the HTML code will be displayed rather than the WYSIWYG (What You See Is What You Get) editor.


Locate & Highlight the Button Marker in the HTML:
Scroll down in the editing area and locate the button's place holder. "BUTTON" generally serves as a good marker because it is easy to locate. Once it is found, highlight it with the mouse. Be careful not to highlight any of the other HTML tags... you only want to replace the portion designated by your marker.

Click Ctrl + V on your keyboard to replace
your marker with the button code.


Save your Changes:
Once you have pasted your code into the source mode of the editor, you are ready to save your changes. You do not need to return to the normal mode. Click the save button at the bottom of your Content Manager screen.


Below is an example of the large blue widget "Add to Cart" button!



Large Blue Widget
Add the description of the large blue widget here.

Quantity: 1

Next Product / Service
Add the description of the next product or service here.

Quantity

BUTTON




Related Topics:
Cloning Pages
PayPal Shipping Options
Adding Purchasing Options




View Cart Buttons
Collecting Tax with PayPal
Why Should I Use PayPal


This online manual was created with the same program you are learning to use!