Advertisement
Tools

Quick Guide: Creating Paypal Buttons with ActionScript 3.0

by

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.

Related Posts
  • Code
    Theme Development
    Custom Controls in the Theme CustomizerTheme customizer custom control 400
    In the last article, we explored the advanced controls available in the Theme Customizer, and how to implement them. We’re going to look at how to create our own custom control, allowing you to choose which Category of Posts are displayed on the home page. To get started, download version 0.6.0 of our Theme Customizer Example.Read More…
  • Code
    PHP
    Validation and Exception Handling: From the UI to the BackendProcedural to oop php retina preview
    Sooner or later in your programming career you will be faced with the dilemma of validation and exception handling. This was the case with me and my team also. A couple or so years ago we reached a point when we had to take architectural actions to accommodate all the exceptional cases our quite large software project needed to handle. Below is a list of practices we came to value and apply when it comes to validation and exception handling.Read More…
  • Web Design
    UX
    Walk Users Through Your Website With Bootstrap TourTour retina
    When you have a web application which requires some getting used to from your users, a walkthrough of the interface is in order. Creating a walkthrough directly on top of the interface makes things very clear, so that's what we're going to build, using Bootstrap Tour.Read More…
  • Code
    PHP
    Acceptance Testing With CodeceptionIntro to codeception retina preview
    Typically new features for web applications are tested by visiting the appropriate page in a browser, maybe filling out some form data, submitting the form, and then developers or testers hope to see their desired result. This is the natural way most web developers test their apps. We can continue with this natural testing process and improve upon it to ensure our apps are as stable as possible by using Codeception. Read More…
  • Code
    JavaScript & AJAX
    Working With IndexedDB - Part 2Indexeddb retina preview
    Welcome to the second part of my IndexedDB article. I strongly recommend reading the first article in this series, as I'll be assuming you are familiar with all the concepts covered so far. In this article, we're going to wrap up the CRUD aspects we didn't finish before (specifically updating and deleting content), and then demonstrate a real world application that we will use to demonstrate other concepts in the final article.Read More…
  • Code
    PHP
    How to Accept Payments With StripeCode
    Processing credit cards is unfortunately far more difficult than we might hope, as developers. Given that it’s such a common task, is it really necessary that we jump through countless hoops (surrounded by fire, of course) for the sole purpose of processing a payment? Merchants? Gateways? SSL? Security? Very quickly, a seemingly simple operation can become an overwhelmingly confusing and, more importantly, dangerous task. Any time that you find yourself handling a user’s sensitive data, you better be on your toes. Read More…