Quick Guide: Creating Paypal Buttons with ActionScript 3.0
In this tutorial we’ll quickly create two different Paypal buttons: "Buy Now" and "Donate". All we’ll need is a Paypal Business Account to generate some code for us.
Final Result Preview
Let’s take a look at the final result we will be working towards:
Step 1 – Document Setup
Launch Flash and create a new ActionScript 3.0 document (File > New…). Set the stage size to 600 px width and 400px height with 30 fps. I’ve chosen black (#000000) for the background.
Step 2 – Create the Flash Buttons
Create two layers. Name the first layer "Buttons" and the second "Actions". On the "Buttons" layer, create two buttons; one with the text "Donate a Cup of Coffee" and the other with the text "Buy Donuts". Select the Donate button, then go to properties and assign an instance name of "btDonate". Lastly, assign an instance name of "btBuynow " for the Buy Now button.
Step 3 – Login to Paypal.com
Go to www.paypal.com and login as shown in the image below.
Step 4 – Customizing the Donate Button
Go to "Merchant Services" and click on the option "Donations" located in the "Key Features" panel.
Firstly, we’ll customize our button "Donate". Enter a name for the "Service" and then a "Donation ID". Now choose the currency and select "Donors contribute a fixed amount" (just type an amount). The final task for this step is to select "Plain text e-mail address".
Now we move to step 2 and check "Save button at Paypal"; this is a new feature and it’s very useful.
For step 3 we’ll customize the advanced features. Select "No" for the first two options and if you wish, you can enter the url for "cancellation" and "successful" pages.
Click on "Create button" and the next screen will show you the HTML code.
Step 5 – Customizing the Buy Now Button
To customize the other button, again go to "Merchant Services". This time, click on the "Buy Now" option located in the "Key Features" panel.
Within the first step choose "Products" from the combo box, select "Accept payments for" and "No, create a Buy Now button". Then enter a "Name" and "ID" for your service or product. Set the "price", "currency " and specify the "shipping" amount.
Then, go to step 2 and check "Save button at Paypal".
Lastly, within step 3 select "No" for the first two options and again, if you wish, you can type the url for "cancellation" and "successful" pages.
Click on "Create button".
Step 6 – Copy the HTML Code
Now the two buttons have been created, go to your "Profile" and click on "My Saved Buttons" which you’ll find in the "Selling Preferences" panel. Click on the "Action" drop down menu and select "View code". Copy the code, go back to Flash and paste the clipboard contents into your "Actions" layer. Repeat these steps for the other button and comment it all as HTML code.
Step 7 – Define "EventListener"
Copy the following lines of code into your "Actions" layer:
btDonate.addEventListener(MouseEvent.CLICK, donate); btBuynow.addEventListener(MouseEvent.CLICK, buynow);
Step 8 – Define the "buynow" and "donate" Functions
Copy the following lines of code into your "Actions" layer:
function donate (event:MouseEvent):void
{
var url:String = "https://www.paypal.com/cgi-bin/webscr"; //<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
var request:URLRequest = new URLRequest(url);
var paypal_donate:URLVariables = new URLVariables();
paypal_donate.cmd="_s-xclick"; //<input type="hidden" name="cmd" value="_s-xclick">
paypal_donate.hosted_button_id="4893693"; //<input type="hidden" name="hosted_button_id" value="4893693">
request.data = paypal_donate;
navigateToURL(request);
trace(paypal_donate)
}
function buynow (event:MouseEvent):void
{
var url:String = "https://www.paypal.com/cgi-bin/webscr"; //<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
var request:URLRequest = new URLRequest(url);
var paypal_buynow:URLVariables = new URLVariables();
paypal_buynow.cmd="_s-xclick"; //<input type="hidden" name="cmd" value="_s-xclick">
paypal_buynow.hosted_button_id="4901978"; //<input type="hidden" name="hosted_button_id" value="4901978">
request.data = paypal_buynow;
navigateToURL(request);
trace(paypal_buynow)
}
Conclusion
Test your movie to check the link between flash and paypal.com. If you wish, you can modify the paypal buttons (taxes, tracking, inventory, donation amount, etc), have fun playing with it! I hope you enjoyed this quick guide.
Enjoyed this Post?
Subscribe to our RSS Feed, Follow us on Twitter or simply recommend us to friends and colleagues!
By Dario Gutierrez
Related Posts
Magma design - More
Active Basix
Just getting started? Start with our basix tutorials on the fundamentals. View All Basix Tutorials
Other Plus Sites ...
aetuts+ audiotuts+ vectortuts+ tuts+ phototuts+ cgtuts+ nettuts+ psdtuts+ activetuts+Create a Tutorial, Get Paid!
Have something to teach the world? Want to earn money doing it? Tutorials, screencasts, and articles published here on Activetuts+ are largely contributed by readers just like you! We'll pay you great money for good content. Find Out More
Greate tutorials
Awesome tutorial! Was looking for these!
Thanks!
Nice tut. I guess this would also work for opening any external page!
Nice.
Good tutorial. Simple and straight forward.
nice tut.. this will be very helpful..
Awesome! very well explained
Awesome ! Really effective
nice tut thanks!
it’s so fantastic please sent me this like any tuts at pakhrin299@hotmail.com
Lol. Just subscribe to the RSS
Me da mucho orgullo saber que un compatriota mexicano escribe en este tipo de sitios con gran calidad. Te felicito. Vi tu sitio y me gusto mucho la gráfica además de su sencillez.
yo soy del estado de México y llevo diseñando en flash como tres años, mi fuerte más bien es el diseño y animación, me cuesta la programación.
Yo también hago tutos pero con tópicos más comunes.
Te dejo Saludos!!!
Gracias María, checa mi nuevo blog de labs tengo 2 tuts por publicar, quedate pendiente. Saludos desde Cancun. Sigueme en twitter @_dariux. Saludos.
Thanks Maria, you can check my new blog dg labs, I have 2 tuts for soon publish, I will wait your visit. Best regards!
wooow
gooog
very nice tut…
no add to shopping cart button?
Is it possible to let the user input any other amount instead of the predefined values?
Sure teneb, let me modify the code and publish it here.
Teneb here the new file, now you can input a quantity for the “buy button”. I hope can help you.
http://labs.dariux.com/paypal-buttons-with-qty.fla
thanks
how would a view cart work though?
Nice tutorial. It would be grand if you taught us how to also create “View Cart” and “Checkout” buttons to complete the tutorial.
x lisa x
Awsome tutorial, been looking for something like this!!
this is great! I am stuck trying to incorporate the flash combobox component so I can have choices for sizes. Any pointers?
Thanks!
@atanism: shopping cart? like if you wanted to buy a dozen donuts? haha
-Eric
how would i create a flash action script 3.0 button with multiple options, that communicates with paypal, to purchase products, I’ve created individual buttons in flash (for Now) using AC 2.0 see (i.e) on my site…
gogreekstore.com
Hi Jesse, let me modify the source code and send a copy with this features.
hey did u have a chance to modify the source code? and I would definitely appreciate a “view cart” button to work the same way.
hey… any luck
This is Good Man,In moment need me Flash Button to use for Pay Pal.
View cart code for ActionScript 3.0 is soooooooo hard to find…why?
Is there a way to have it so that instead of donating a cup of coffee, it goes to a Text input box (numbers only)
Where the user enters like 5.00 and that is what they are donating?
Or 7.00 and thats their donation?
Is that possible?
Thanks
hey guys this is the tuts ive been after for ages does any one know how to make a view cart button
i keep getting ioerror
great tut could anyone help me create a view cart the same way i keep gettng a error
Great tutorial Dario! Is it possible to create an “Add to Cart” button using the method shown in this tutorial?
hey… did you have any luck
Can this be modified to work with actionscripting 2.0 ??
How can I make a button like this using flash actionscript 2 & 1?
Nice Script very simple and easy. Thanks Faraz
This is an excellent start for me … thank you. I am working to build a shopping cart using Flash CS3 and would like to know if it is possible to add combo boxes containing color/size options and passed onto paypal for purchase using Actionscript 3?
Could you please post it in ActionScript 2.0?
I just need the script in AS2.0 for “buy now” button.
I’d appreciate any help,
Not totally related, but if you want to create over a hundred buttons, it is obviously quite painful to do it through button manager, is there any other way to create paypal buttons. I have a mysql database in the background with all the info. I need, but I don’t have the hosted_button_id for each button unless I create the buttons online?
Thanks for any help.
Thanks, was playing around with the coding for a bit myself ^^;
Hey Dario,
nice tutorial
do you know the codes sending paypal your shopping & handling cost?
I am thinking of making shopping fee based on the country selected by users.
This is very awesome tutorial. However, I am a regular (type:personal) PayPal user and don’t have Business account. Can I still be to create a donation?
In code, where you get your ID, I get encrypted text:
<input type="hidden" name="encrypted" value="—–BEGIN PKCS7—–o;vn;eovna;onv;oaivnoeivnoiWHATEVERkjnadkjn —–END PKCS7—–;
is it still doable?
very nice can i use the same code for action Script 3.
Please guide me
Thanks
Steroids